Update the IndexTable component to prevent a scrollbar flash (#11817)

### WHY are these changes introduced?

The scrollbar in `IndexTable`  initially shows and then hides on render.

🌀 [Spin
link](https://admin.web.index-table-test.sam-rose.us.spin.dev/store/shop1)

**Before**


https://github.com/Shopify/polaris/assets/11774595/cc494771-cebb-4969-bed3-6d017ecf1c97

**After**

No flash of scrollbar.

### WHAT is this pull request doing?

This updates the default state of the scrollbar to be hidden and updates
the `SCROLL_BAR_PADDING` since the inline padding has been increased
from `--p-space-050` to `--p-space-200`).

### 🎩 checklist

- [ ] Tested a
[snapshot](https://github.com/Shopify/polaris/blob/main/documentation/Releasing.md#-snapshot-releases)
- [ ] Tested on
[mobile](https://github.com/Shopify/polaris/blob/main/documentation/Tophatting.md#cross-browser-testing)
- [ ] Tested on [multiple
browsers](https://help.shopify.com/en/manual/shopify-admin/supported-browsers)
- [ ] Tested for
[accessibility](https://github.com/Shopify/polaris/blob/main/documentation/Accessibility%20testing.md)
- [ ] Updated the component's `README.md` with documentation changes
- [ ] [Tophatted
documentation](https://github.com/Shopify/polaris/blob/main/documentation/Tophatting%20documentation.md)
changes in the style guide

Co-authored-by: Marc Thomas <marc.thomas@shopify.com>

.changeset/tricky-beans-fold.md

@@ -0,0 +1,5 @@
+---
+'@shopify/polaris': patch
+---
+
+[IndexTable] Initially hide the scrollbar and update scrollbar padding

polaris-react/src/components/IndexTable/IndexTable.tsx

@@ -141,7 +141,7 @@ export interface TableHeadingRect {
   offsetLeft: number;
 }
 
-const SCROLL_BAR_PADDING = 4;
+const SCROLL_BAR_PADDING = 16;
 const SCROLL_BAR_DEBOUNCE_PERIOD = 300;
 
 function IndexTableBase({
@@ -196,8 +196,7 @@ function IndexTableBase({
 
   const [tableInitialized, setTableInitialized] = useState(false);
   const [stickyWrapper, setStickyWrapper] = useState<HTMLElement | null>(null);
-  const [hideScrollContainer, setHideScrollContainer] =
-    useState<boolean>(false);
+  const [hideScrollContainer, setHideScrollContainer] = useState<boolean>(true);
 
   const tableHeadings = useRef<HTMLElement[]>([]);
   const stickyTableHeadings = useRef<HTMLElement[]>([]);