From 7385e139b0c9efca7430458cee982e63e282f4ae Mon Sep 17 00:00:00 2001
From: Patrick Williams <patrick@stwcx.xyz>
Date: Thu, 8 Dec 2022 06:13:13 -0600
Subject: prettier: re-format

Prettier is enabled in openbmc-build-scripts on Markdown, JSON, and YAML
files to have consistent formatting for these file types.  Re-run the
formatter on the whole repository.

Change-Id: I2804ee3ab5ff6bcbf986b028db2fafec8e616779
Signed-off-by: Patrick Williams <patrick@stwcx.xyz>
---
 docs/guide/components/alerts/index.md       |   6 +-
 docs/guide/components/buttons/index.md      |   6 +-
 docs/guide/components/file-upload/readme.md |  10 +-
 docs/guide/components/info-tooltip/index.md |   7 +-
 docs/guide/components/page-section/index.md |   5 +-
 docs/guide/components/page-title/index.md   |   8 +-
 docs/guide/components/readme.md             |   3 +-
 docs/guide/components/status-icon/readme.md |  17 +--
 docs/guide/components/table/index.md        | 165 +++++++++++++---------------
 docs/guide/components/toasts/index.md       |   7 +-
 10 files changed, 107 insertions(+), 127 deletions(-)

(limited to 'docs/guide/components')

diff --git a/docs/guide/components/alerts/index.md b/docs/guide/components/alerts/index.md
index aa2c5e13..0ce5167c 100644
--- a/docs/guide/components/alerts/index.md
+++ b/docs/guide/components/alerts/index.md
@@ -1,11 +1,11 @@
 # Alerts
+
 An alert is an inline message that contains a short description that a user
 cannot manually dismiss. With exception to the error message on the login page,
 alerts are not triggered by user action. Success and error notifications based
 on user actions are created using a toast component.
 
-[Learn more about Bootstrap-vue alert
-options](https://bootstrap-vue.js.org/docs/components/alert)
+[Learn more about Bootstrap-vue alert options](https://bootstrap-vue.js.org/docs/components/alert)
 
 ![Alert examples](./alert.png)
 
@@ -13,4 +13,4 @@ options](https://bootstrap-vue.js.org/docs/components/alert)
 <alert show variant="warning">This is a warning message</alert>
 <alert show variant="danger">This is an error message</alert>
 <alert show variant="info">This is an info message</alert>
-```
\ No newline at end of file
+```
diff --git a/docs/guide/components/buttons/index.md b/docs/guide/components/buttons/index.md
index 83b8e8a7..251316ff 100644
--- a/docs/guide/components/buttons/index.md
+++ b/docs/guide/components/buttons/index.md
@@ -6,10 +6,10 @@ can be themed by setting the `variant` prop on the component to one of the
 [theme-color map keys](/guide/guidelines/colors). To create a button that looks
 like a link, set the variant value to `link`.
 
-[Learn more about Bootstrap-vue
-buttons](https://bootstrap-vue.js.org/docs/components/button)
+[Learn more about Bootstrap-vue buttons](https://bootstrap-vue.js.org/docs/components/button)
 
 ### Icon only buttons
+
 Add `btn-icon-only` class to the button and add `title` attribute to get helper
 text on hover over the button.
 
@@ -57,4 +57,4 @@ text on hover over the button.
 <b-button disabled variant="link" title="Delete" class="btn-icon-only">
   <icon-trashcan />
 </b-button>
-```
\ No newline at end of file
+```
diff --git a/docs/guide/components/file-upload/readme.md b/docs/guide/components/file-upload/readme.md
index fb833648..e0819a85 100644
--- a/docs/guide/components/file-upload/readme.md
+++ b/docs/guide/components/file-upload/readme.md
@@ -4,12 +4,13 @@
 component. The purpose of this component is to upload files to the BMC.
 
 To use this component:
+
 1. Import it into the single file component (SFC)
 2. Add the `<form-file />` tag
 3. Add the optional `id` , `disabled`, `accept` and `state` prop as required
 
-[Learn more about the Bootstrap-vue Form File
-component](https://bootstrap-vue.org/docs/components/form-file)
+[Learn more about the Bootstrap-vue Form File component](https://bootstrap-vue.org/docs/components/form-file)
+
 ### Optional properties
 
 - `id`- Used to set the `id` attribute on the rendered content, and used as the
@@ -23,10 +24,7 @@ component](https://bootstrap-vue.org/docs/components/form-file)
 ## Example of form file
 
 ```vue
-<form-file
-  id="image-file"
-  accept=".tar"
-  >
+<form-file id="image-file" accept=".tar">
 </form-file>
 ```
 
diff --git a/docs/guide/components/info-tooltip/index.md b/docs/guide/components/info-tooltip/index.md
index b6117924..4b6416c9 100644
--- a/docs/guide/components/info-tooltip/index.md
+++ b/docs/guide/components/info-tooltip/index.md
@@ -4,15 +4,12 @@ The `InfoTooltip` is a custom component that uses a Bootstrap-vue tooltip with
 an info icon. This custom component requires a title property containing the
 tooltip text to display to the user.
 
-[Read more about the Bootstrap-vue tooltip
-component](https://bootstrap-vue.org/docs/components/tooltip)
+[Read more about the Bootstrap-vue tooltip component](https://bootstrap-vue.org/docs/components/tooltip)
 
 ## Example
 
 ```vue
-<info-tooltip
-  :title="Title" //should be translated
-/>
+<info-tooltip :title="Title" //should be translated />
 ```
 
 ![Tooltip example](./info-tooltip.png)
diff --git a/docs/guide/components/page-section/index.md b/docs/guide/components/page-section/index.md
index 2a8a22ef..94113c58 100644
--- a/docs/guide/components/page-section/index.md
+++ b/docs/guide/components/page-section/index.md
@@ -4,10 +4,9 @@ The `<page-section>` component will render semantic HTML. By adding a
 `:section-title` prop to the `<page-section>` component, the localized text
 string will be rendered in an `h2` header element.
 
-``` vue
+```vue
 // Example: `src/views/AccessControl/Ldap/Ldap.vue`
     <page-section :section-title="$t('pageLdap.settings')">
 ```
 
-[View the page section component source
-code](https://github.com/openbmc/webui-vue/blob/master/src/components/Global/PageSection.vue).
\ No newline at end of file
+[View the page section component source code](https://github.com/openbmc/webui-vue/blob/master/src/components/Global/PageSection.vue).
diff --git a/docs/guide/components/page-title/index.md b/docs/guide/components/page-title/index.md
index db43f29f..2f635e74 100644
--- a/docs/guide/components/page-title/index.md
+++ b/docs/guide/components/page-title/index.md
@@ -1,4 +1,5 @@
 # Page title
+
 The `<page-title>` component will automatically render the page title that
 corresponds with the title property set in the route record's meta field in
 `src/router/routes.js`.
@@ -19,10 +20,9 @@ Optional page descriptions can be included by using the description prop
 `:description` prop and passing in the i18n localized text string. Translations
 are found in the `src/locales` folder.
 
-``` vue
+```vue
 // Example: `src/views/AccessControl/Ldap/Ldap.vue`
-  <page-title :description="$t('pageLdap.pageDescription')" />
+<page-title :description="$t('pageLdap.pageDescription')" />
 ```
 
-[View the page title component source
-code](https://github.com/openbmc/webui-vue/blob/master/src/components/Global/PageTitle.vue).
+[View the page title component source code](https://github.com/openbmc/webui-vue/blob/master/src/components/Global/PageTitle.vue).
diff --git a/docs/guide/components/readme.md b/docs/guide/components/readme.md
index aef688af..b200b305 100644
--- a/docs/guide/components/readme.md
+++ b/docs/guide/components/readme.md
@@ -1,4 +1,5 @@
 # Overview
+
 Vue components are the building blocks of the OpenBMC Web UI. It uses both
 Boostrap-Vue components, as well as custom components. Using these components
 assures consistency throughout the application. They also improve the developer
@@ -7,4 +8,4 @@ HTML markup. If the feature you're working on includes a new layout pattern,
 rather than adding raw markup to the page, consider creating a component that
 other sections of the application can use as well.
 
-[Learn more about Vue components](https://vuejs.org/v2/guide/components.html)
\ No newline at end of file
+[Learn more about Vue components](https://vuejs.org/v2/guide/components.html)
diff --git a/docs/guide/components/status-icon/readme.md b/docs/guide/components/status-icon/readme.md
index aef1f93c..e2041986 100644
--- a/docs/guide/components/status-icon/readme.md
+++ b/docs/guide/components/status-icon/readme.md
@@ -9,6 +9,7 @@ following statuses:
 - danger
 
 To use this component:
+
 1. Import it into the single file component (SFC)
 2. Add the `<status-icon />` tag
 3. Add the optional status prop and set the value to one of the statuses
@@ -29,9 +30,7 @@ import StatusIcon from '@/components/Global/StatusIcon'
 ## Status icon with success status
 
 ```vue
-<status-icon
-:status="success"
-/>
+<status-icon :status="success" />
 ```
 
 ![StatusIcon success icon example](./success.png)
@@ -39,9 +38,7 @@ import StatusIcon from '@/components/Global/StatusIcon'
 ## Status icon with info status
 
 ```vue
-<status-icon
-:status="info"
-/>
+<status-icon :status="info" />
 ```
 
 ![StatusIcon info icon example](./info.png)
@@ -49,9 +46,7 @@ import StatusIcon from '@/components/Global/StatusIcon'
 ## Status icon with warning status
 
 ```vue
-<status-icon
-:status="warning"
-/>
+<status-icon :status="warning" />
 ```
 
 ![StatusIcon warning icon example](./warning.png)
@@ -59,9 +54,7 @@ import StatusIcon from '@/components/Global/StatusIcon'
 ## Status icon with danger status
 
 ```vue
-<status-icon
-:status="danger"
-/>
+<status-icon :status="danger" />
 ```
 
 ![StatusIcon danger icon example](./danger.png)
diff --git a/docs/guide/components/table/index.md b/docs/guide/components/table/index.md
index 614ef60f..47bc51d8 100644
--- a/docs/guide/components/table/index.md
+++ b/docs/guide/components/table/index.md
@@ -1,17 +1,16 @@
 # Table
 
-All tables in the application are using the [BoostrapVue table
-component](https://bootstrap-vue.org/docs/components/table).
+All tables in the application are using the
+[BoostrapVue table component](https://bootstrap-vue.org/docs/components/table).
 
 To use the component, include the `<b-table>` tag in the template. The component
 is registered globally so does not need to be imported in each SFC.
 
 ## Basic table
-There are a few required properties to maintain consistency across the
-application. The full list of options can be viewed on the [Bootstrap-vue table
-component's documentation
-page](https://bootstrap-vue.org/docs/components/table#comp-ref-b-table-props).
 
+There are a few required properties to maintain consistency across the
+application. The full list of options can be viewed on the
+[Bootstrap-vue table component's documentation page](https://bootstrap-vue.org/docs/components/table#comp-ref-b-table-props).
 
 ### Required properties
 
@@ -20,12 +19,13 @@ page](https://bootstrap-vue.org/docs/components/table#comp-ref-b-table-props).
 - `hover` - enables table row hover state
 - `responsive` or `stacked` - makes the table responsive (enables horizontal
   scrolling or stacked view) at the defined breakpoint
-- `show-empty` *(required if table data is generated dynamically)* - shows an
+- `show-empty` _(required if table data is generated dynamically)_ - shows an
   empty message if there are no items in the table
-- `empty-text` *(required if table data is generated dynamically)* - the
+- `empty-text` _(required if table data is generated dynamically)_ - the
   translated empty message
 
-![Basic table example](./table.png) ![Basic empty table
+![Basic table example](./table.png)
+![Basic empty table
 example](./table-empty.png)
 
 ```vue
@@ -41,36 +41,36 @@ example](./table-empty.png)
 </template>
 
 <script>
-  export default {
-    data() {
-      items: [
-        {
-          name: 'Babe',
-          age: '3 years',
-          color: 'white, orange, grey'
-        },
-        {
-          name: 'Grey Boy',
-          age: '4 months',
-          color: 'grey'
-        },
-      ],
-      fields: [
-        {
-          key: 'name',
-          label: this.$t('table.name') //translated label
-        },
-        {
-          key: 'age',
-          label: this.$t('table.age') //translated label
-        },
-        {
-          key: 'color',
-          label: this.$t('table.color') // translated label
-        }
-      ]
-    }
+export default {
+  data() {
+    items: [
+      {
+        name: 'Babe',
+        age: '3 years',
+        color: 'white, orange, grey'
+      },
+      {
+        name: 'Grey Boy',
+        age: '4 months',
+        color: 'grey'
+      },
+    ],
+    fields: [
+      {
+        key: 'name',
+        label: this.$t('table.name') //translated label
+      },
+      {
+        key: 'age',
+        label: this.$t('table.age') //translated label
+      },
+      {
+        key: 'color',
+        label: this.$t('table.color') // translated label
+      }
+    ]
   }
+}
 </script>
 ```
 
@@ -85,7 +85,6 @@ columns and add the following props to the `<b-table>` component:
 
 ![Table sort example](./table-sort.png)
 
-
 ```vue
 <template>
   <b-table
@@ -130,9 +129,9 @@ export default {
 
 To add an expandable row in the table, add a column for the expand button in the
 fields array. Include the tdClass `table-row-expand` to ensure icon rotation is
-handled. Use the built in [cell
-slot](https://bootstrap-vue.org/docs/components/table#comp-ref-b-table-slots) to
-target the expand button column and add a button with the chevron icon.
+handled. Use the built in
+[cell slot](https://bootstrap-vue.org/docs/components/table#comp-ref-b-table-slots)
+to target the expand button column and add a button with the chevron icon.
 
 Include the
 [TableRowExpandMixin](https://github.com/openbmc/webui-vue/blob/master/src/components/Mixins/TableRowExpandMixin.js).
@@ -141,9 +140,10 @@ need to be included with the expand button. The `toggleRowDetails` method should
 be the button's click event callback. Be sure to pass the `row` object to the
 function.
 
-Use the [row-details
-slot](https://bootstrap-vue.org/docs/components/table#comp-ref-b-table-slots) to
-format the expanded row content. The slot has access to the row `item` property.
+Use the
+[row-details slot](https://bootstrap-vue.org/docs/components/table#comp-ref-b-table-slots)
+to format the expanded row content. The slot has access to the row `item`
+property.
 
 ### Summary
 
@@ -159,12 +159,7 @@ format the expanded row content. The slot has access to the row `item` property.
 
 ```vue
 <template>
-  <b-table
-    hover
-    responsive="md"
-    :items="items"
-    :fields="fields"
-  >
+  <b-table hover responsive="md" :items="items" :fields="fields">
     <template #cell(expandRow)="row">
       <b-button
         variant="link"
@@ -208,9 +203,9 @@ export default {
 
 ## Search
 
-The table is leveraging [BootstrapVue table
-filtering](https://bootstrap-vue.org/docs/components/table#filtering) for
-search. Add the
+The table is leveraging
+[BootstrapVue table filtering](https://bootstrap-vue.org/docs/components/table#filtering)
+for search. Add the
 [@filtered](https://bootstrap-vue.org/docs/components/table#filter-events) event
 listener onto the `<b-table>` component. The event callback should track the
 total filtered items count.
@@ -240,29 +235,29 @@ if there are no search matches.
 ```vue
 <template>
   <b-container>
-  <b-row>
-    <b-col>
-      <search
-        @changeSearch="onChangeSearchInput"
-        @clearSearch="onClearSearchInput"
-      />
-    </b-col>
-    <b-col>
-      <table-cell-count
-        :filtered-items-count="filteredItemsCount"
-        :total-number-of-cells="items.length"
-      />
-    </b-col>
-  </b-row>
-  <b-table
-    hover
-    responsive="md"
-    :items="items"
-    :fields="fields"
-    :filter="searchFilter"
-    :empty-filtered-text="$t('global.table.emptySearchMessage')"
-    @filtered="onFiltered"
-  />
+    <b-row>
+      <b-col>
+        <search
+          @changeSearch="onChangeSearchInput"
+          @clearSearch="onClearSearchInput"
+        />
+      </b-col>
+      <b-col>
+        <table-cell-count
+          :filtered-items-count="filteredItemsCount"
+          :total-number-of-cells="items.length"
+        />
+      </b-col>
+    </b-row>
+    <b-table
+      hover
+      responsive="md"
+      :items="items"
+      :fields="fields"
+      :filter="searchFilter"
+      :empty-filtered-text="$t('global.table.emptySearchMessage')"
+      @filtered="onFiltered"
+    />
   </b-container>
 </template>
 <script>
@@ -383,6 +378,7 @@ export default {
 ## Filters
 
 To add a table dropdown filter:
+
 1. Import the `<table-filter> `component and TableFilterMixin.
 1. Add a filters prop to the `<table-filters>` component. This prop should be an
    array of filter groups–each required to have a key, label, and values prop.
@@ -411,12 +407,7 @@ from the TableFilterMixin to show the filtered table data.
         />
       </b-col>
     </b-row>
-    <b-table
-      hover
-      responsive="md"
-      :items="filteredItems"
-      :fields="fields"
-    />
+    <b-table hover responsive="md" :items="filteredItems" :fields="fields" />
   </b-container>
 </template>
 <script>
@@ -454,20 +445,19 @@ export default {
 </script>
 ```
 
-
 ### Date filter
 
 To add a date filter, import the `<table-date-filter>` component. It will emit a
 `@change` event with the user input date values. There is a date filter method,
 `getFilteredTableDataByDate`, in the `TableFilterMixin`.
 
-
 ## Batch actions
 
 Batch actions allow a user to take a single action on many items in a table at
 once.
 
 To add table batch actions:
+
 1. Import the `<table-toolbar> `component and BVTableSelectableMixin
 1. Add the `selectable`, `no-select-on-click` props and a unique `ref` to the
    table. The table will emit a `@row-selected` event. Use the `onRowSelected`
@@ -571,10 +561,10 @@ export default {
 </script>
 ```
 
-
 ## Pagination
 
 To add table pagination:
+
 1. Import the BVPaginationMixin
 1. Add the `per-page` and `current-page` props to the `<table>` component.
 1. Add the below HTML snippet to the template. Make sure to update the
@@ -607,6 +597,7 @@ To add table pagination:
   </b-col>
 </b-row>
 ```
+
 ![Table pagination example](./table-pagination.png)
 
 ```vue
@@ -667,4 +658,4 @@ export default {
   }
 }
 </script>
-```
\ No newline at end of file
+```
diff --git a/docs/guide/components/toasts/index.md b/docs/guide/components/toasts/index.md
index 3f0c815d..b19643de 100644
--- a/docs/guide/components/toasts/index.md
+++ b/docs/guide/components/toasts/index.md
@@ -1,12 +1,13 @@
 # Toasts
+
 Use a toast message to indicate the status of a user action. For example, a user
 saves a form successfully, a toast message with the `success` variant is
-displayed.  If the user action was not successful, a toast message with the
+displayed. If the user action was not successful, a toast message with the
 `danger` variant is displayed.
 
 There are different transitions for the toast messages. The `success` toast
 message will auto-hide after 10 seconds. The user must manually dismiss the
-`informational`, `warning`, and `error` toast messages.  The `BVToastMixin`
+`informational`, `warning`, and `error` toast messages. The `BVToastMixin`
 provides a simple API that generates a toast message that meets the transition
 guidelines.
 
@@ -67,4 +68,4 @@ methods: {
     })
   }
 }
-```
\ No newline at end of file
+```
-- 
cgit v1.2.3