@eturnity/eturnity_reusable_components 7.37.5 → 7.39.0

package/src/components/inputs/toggle/Toggle.stories.js

@@ -1,77 +1,77 @@
-import Toggle from './index.vue'
-
-export default {
-  title: 'Toggle',
-  component: Toggle,
-  // argTypes: {},
-}
-
-const Template = (args, { argTypes }) => ({
-  // Components used in your story `template` are defined in the `components` object
-  components: { Toggle },
-  // The story's `args` need to be mapped into the template through the `setup()` method
-  props: Object.keys(argTypes),
-  template: '<toggle v-bind="$props" />',
-
-  // import Toggle from "@eturnity/eturnity_reusable_components/src/components/inputs/toggle"
-  //To use:
-  // <toggle
-  //   @on-toggle-change="onInputChange($event)"
-  //   :isChecked="toggleValue" // Boolean
-  //   label="My Label Text"
-  //   toggleColor="red"
-  //   size="small" // small, medium
-  //   backgroundColor="blue"
-  //   labelAlign="right"
-  //   fontColor="black"
-  //   :disabled="true"
-  // />
-})
-
-export const Default = Template.bind({})
-Default.args = {
-  isChecked: true,
-  size: 'small', // "small" or "medium"
-  disabled: false,
-}
-
-export const Medium = Template.bind({})
-Medium.args = {
-  isChecked: true,
-  size: 'medium', // "small" or "medium"
-  disabled: false,
-}
-
-export const CustomColor = Template.bind({})
-CustomColor.args = {
-  isChecked: true,
-  size: 'small', // "small" or "medium"
-  disabled: false,
-  toggleColor: 'red',
-  backgroundColor: 'blue',
-}
-
-export const LabelLeft = Template.bind({})
-LabelLeft.args = {
-  isChecked: true,
-  size: 'small', // "small" or "medium"
-  label: 'My Label Text',
-  disabled: false,
-  labelAlign: 'left',
-}
-
-export const LabelRight = Template.bind({})
-LabelRight.args = {
-  isChecked: true,
-  size: 'small', // "small" or "medium"
-  label: 'My Label Text',
-  disabled: false,
-  labelAlign: 'right',
-}
-
-export const Disabled = Template.bind({})
-Disabled.args = {
-  isChecked: false,
-  size: 'small', // "small" or "medium"
-  disabled: true,
-}
+import Toggle from './index.vue'
+
+export default {
+  title: 'Toggle',
+  component: Toggle,
+  // argTypes: {},
+}
+
+const Template = (args, { argTypes }) => ({
+  // Components used in your story `template` are defined in the `components` object
+  components: { Toggle },
+  // The story's `args` need to be mapped into the template through the `setup()` method
+  props: Object.keys(argTypes),
+  template: '<toggle v-bind="$props" />',
+
+  // import Toggle from "@eturnity/eturnity_reusable_components/src/components/inputs/toggle"
+  //To use:
+  // <toggle
+  //   @on-toggle-change="onInputChange($event)"
+  //   :isChecked="toggleValue" // Boolean
+  //   label="My Label Text"
+  //   toggleColor="red"
+  //   size="small" // small, medium
+  //   backgroundColor="blue"
+  //   labelAlign="right"
+  //   fontColor="black"
+  //   :disabled="true"
+  // />
+})
+
+export const Default = Template.bind({})
+Default.args = {
+  isChecked: true,
+  size: 'small', // "small" or "medium"
+  disabled: false,
+}
+
+export const Medium = Template.bind({})
+Medium.args = {
+  isChecked: true,
+  size: 'medium', // "small" or "medium"
+  disabled: false,
+}
+
+export const CustomColor = Template.bind({})
+CustomColor.args = {
+  isChecked: true,
+  size: 'small', // "small" or "medium"
+  disabled: false,
+  toggleColor: 'red',
+  backgroundColor: 'blue',
+}
+
+export const LabelLeft = Template.bind({})
+LabelLeft.args = {
+  isChecked: true,
+  size: 'small', // "small" or "medium"
+  label: 'My Label Text',
+  disabled: false,
+  labelAlign: 'left',
+}
+
+export const LabelRight = Template.bind({})
+LabelRight.args = {
+  isChecked: true,
+  size: 'small', // "small" or "medium"
+  label: 'My Label Text',
+  disabled: false,
+  labelAlign: 'right',
+}
+
+export const Disabled = Template.bind({})
+Disabled.args = {
+  isChecked: false,
+  size: 'small', // "small" or "medium"
+  disabled: true,
+}