Documentation fixes

src/components/Table/Table.stories.svelte

@@ -89,8 +89,7 @@
     data: pressFreedom,
     title: 'Press Freedom Index',
     paginated: true,
-    source:
+    source: 'Source: Reporters Without Borders',
-      "Source: <a href='https://en.wikipedia.org/wiki/Press_Freedom_Index'>Reporters Without Borders</a>",
   }}"
 />
 
@@ -102,8 +101,7 @@
     searchable: true,
     paginated: true,
     title: 'Press Freedom Index',
-    source:
+    source: 'Source: Reporters Without Borders',
-      "Source: <a href='https://en.wikipedia.org/wiki/Press_Freedom_Index'>Reporters Without Borders</a>",
   }}"
 />
 
@@ -115,8 +113,7 @@
     paginated: true,
     filterField: 'Region',
     title: 'Press Freedom Index',
-    notes:
+    notes: 'Source: Reporters Without Borders',
-      "Source: <a href='https://en.wikipedia.org/wiki/Press_Freedom_Index'>Reporters Without Borders</a>",
   }}"
 />
 
@@ -130,8 +127,7 @@
     paginated: true,
     title: 'Press Freedom Index',
     dek: 'Reporters Without Borders ranks countries based on their level of press freedom using criteria such as the degree of media pluralism and violence against journalists.',
-    source:
+    source: 'Source: Reporters Without Borders',
-      "Source: <a href='https://en.wikipedia.org/wiki/Press_Freedom_Index'>Reporters Without Borders</a>",
   }}"
 />
 
@@ -145,8 +141,7 @@
     sortDirection: 'descending',
     paginated: true,
     title: 'Press Freedom Index',
-    source:
+    source: 'Source: Reporters Without Borders',
-      "Source: <a href='https://en.wikipedia.org/wiki/Press_Freedom_Index'>Reporters Without Borders</a>",
   }}"
 />
 

src/components/Table/stories/docs/both.md

@@ -2,12 +2,13 @@ Feel free to both search and filter.
 
 ```svelte
 <Table
-  data="{yourData}",
+  data="{yourData}"
-  searchable="{true}",
+  ,
-  filterField="{'Region'}",
+  searchable="{true}"
-  paginated="{true}",
+  filterField="{'Region'}"
-  title="{'Press Freedom Index'}",
+  paginated="{true}"
-  dek="{'Reporters Without Borders ranks countries based on their level of press freedom using criteria such as the degree of media pluralism and violence against journalists.'}",
+  title="{'Press Freedom Index'}"
-  source="{'Source: <a href="https://en.wikipedia.org/wiki/Press_Freedom_Index">Reporters Without Borders</a>'}",
+  dek="{'Reporters Without Borders ranks countries based on their level of press freedom using criteria such as the degree of media pluralism and violence against journalists.'}"
+  source="{'Source: Reporters Without Borders'}"
 />
 ```

src/components/Table/stories/docs/filter.md

@@ -2,10 +2,11 @@ Allow users to filter the table by providing one of the attributes as the `filte
 
 ```svelte
 <Table
-  data="{yourData}",
+  data="{yourData}"
-  filterField="{'Region'}",
+  ,
-  paginate="{true}"
+  filterField="{'Region'}"
-  title="{'Press Freedom Index'}",
+  paginated="{true}"
-  notes="{'Source: <a href="https://en.wikipedia.org/wiki/Press_Freedom_Index">Reporters Without Borders</a>'}",
+  title="{'Press Freedom Index'}"
+  notes="{'Source: Reporters Without Borders'}"
 />
 ```

src/components/Table/stories/docs/format.md

@@ -4,18 +4,18 @@ Among other things, this feature can be used to provide a unit of measurement wi
 
 ```svelte
 <script lang="ts">
-const fieldFormatters = {
+  const fieldFormatters = {
- 'Net worth (in billions)': (v) => '$' + v.toFixed(1)
+    'Net worth (in billions)': (v) => '$' + v.toFixed(1),
-};
+  };
 </script>
 
 <Table
   data="{yourData}"
-  fieldFormatters="{fieldFormatters}",
+  fieldFormatters="{fieldFormatters}"
-  sortable="{true}",
+  sortable="{true}"
-  sortField="{'Score'}",
+  sortField="{'Score'}"
-  sortDirection="{'descending'}",
+  sortDirection="{'descending'}"
-  title:"{'The Richest Women in the World'}",
+  title="{'The Richest Women in the World'}"
-  source: "{'Source: Forbes'}",
+  source="{'Source: Forbes'}"
 />
 ```

src/components/Table/stories/docs/paginate.md

@@ -9,6 +9,6 @@ This is a good option when publishing large tables for readers to explore. It wo
   data="{yourData}"
   paginated="{true}"
   title="{'Press Freedom Index'}"
-  source="{'<a href="https://en.wikipedia.org/wiki/Press_Freedom_Index">Reporters Without Borders</a>'}"
+  source="{'Reporters Without Borders'}"
 />
 ```

src/components/Table/stories/docs/search.md

@@ -2,10 +2,10 @@ Allow users to search the table by setting the optional `searchable` variable. M
 
 ```svelte
 <Table
-  data="{yourData}",
+  data="{yourData}"
-  searchable="{true}",
+  searchable="{true}"
-  paginated="{true}",
+  paginated="{true}"
-  title="{'Press Freedom Index'}",
+  title="{'Press Freedom Index'}"
-  notes="{'Source: <a href="https://en.wikipedia.org/wiki/Press_Freedom_Index">Reporters Without Borders</a>'}",
+  notes="{'Source: Reporters Without Borders'}"
 />
 ```

src/components/Table/stories/docs/sort.md

@@ -1,12 +1,12 @@
-Allow users to sort the table by setting the `searchable` input. Specify the starting order by setting `sortField` to a column name and `sortDirection` to `ascending` or `descending`.
+Allow users to sort the table by setting the `sortable` input. Specify the starting order by setting `sortField` to a column name and `sortDirection` to `ascending` or `descending`.
 
 ```svelte
 <Table
   data="{yourData}"
-  sortable="{true},"
+  sortable="{true}"
-  sortField="{'Score'},"
+  sortField="{'Score'}"
-  sortDirection="{'descending'},"
+  sortDirection="{'descending'}"
-  title="{'Press Freedom Index'},"
+  title="{'Press Freedom Index'}"
-  source="{'Source: <a href="https://en.wikipedia.org/wiki/Press_Freedom_Index">Reporters Without Borders</a>'},"
+  source="{'Source: Reporters Without Borders'}"
 />
 ```

src/components/Table/stories/docs/truncate.md

@@ -1,4 +1,4 @@
-When you table has 10 or more rows, consider clipping it by setting the `truncated` option. When it is enabled, the table is clipped and readers must request to see all rows by clicking a button below the table. By default this configuration will limit the table to five records. You can adjust the cutoff point by adjusting the `truncateLength` option.
+When you table has 10 or more rows, consider clipping it by setting the `truncated` option. When it is enabled, the table is clipped and readers must request to see all rows by clicking a button below the table. By default this configuration will limit the table to five records. You can change the cutoff point by adjusting the `truncateLength` option.
 
 This is a good option for simple tables with row counts between 10 and 30. It works best when the table doesn't require interactivity.