@weni/unnnic-system 1.16.17 → 1.16.19-develop.0

package/src/stories/ProgressBar.stories.js

@@ -1,73 +1,73 @@
-import unnnicProgressBar from '../components/ProgressBar/ProgressBar.vue';
-
-export default {
-  title: 'Progress/ProgressBar',
-  component: unnnicProgressBar,
-  argTypes: {
-    type: {
-      control: {
-        type: 'select',
-        options: ['primary', 'secondary'],
-      },
-    },
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-
-  components: {
-    unnnicProgressBar,
-  },
-
-  data() {
-    return {
-      percentage: 25,
-    };
-  },
-
-  template: `
-    <div>
-      <pre>v-model: {{ percentage }}</pre>
-      <unnnic-progress-bar v-model="percentage" v-bind="$props">
-      </unnnic-progress-bar>
-    </div>
-  `,
-
-  methods: {},
-});
-
-export const Primary = Template.bind({});
-
-Primary.args = {
-  title: 'Title name',
-};
-
-export const Secondary = Template.bind({});
-
-Secondary.args = {
-  title: 'Title name',
-  type: 'secondary',
-};
-
-export const Inline = Template.bind({});
-
-Inline.args = {
-  title: 'Title name',
-  inline: true,
-};
-
-export const Subtitle = Template.bind({});
-
-Subtitle.args = {
-  title: 'test',
-  subtitle: 'Subtitle or description',
-};
-
-export const SubtitleCanClose = Template.bind({});
-
-SubtitleCanClose.args = {
-  title: 'test',
-  subtitle: 'Subtitle or description',
-  canClose: true,
-};
+import unnnicProgressBar from '../components/ProgressBar/ProgressBar.vue';
+
+export default {
+  title: 'Progress/ProgressBar',
+  component: unnnicProgressBar,
+  argTypes: {
+    type: {
+      control: {
+        type: 'select',
+        options: ['primary', 'secondary'],
+      },
+    },
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+
+  components: {
+    unnnicProgressBar,
+  },
+
+  data() {
+    return {
+      percentage: 25,
+    };
+  },
+
+  template: `
+    <div>
+      <pre>v-model: {{ percentage }}</pre>
+      <unnnic-progress-bar v-model="percentage" v-bind="$props">
+      </unnnic-progress-bar>
+    </div>
+  `,
+
+  methods: {},
+});
+
+export const Primary = Template.bind({});
+
+Primary.args = {
+  title: 'Title name',
+};
+
+export const Secondary = Template.bind({});
+
+Secondary.args = {
+  title: 'Title name',
+  type: 'secondary',
+};
+
+export const Inline = Template.bind({});
+
+Inline.args = {
+  title: 'Title name',
+  inline: true,
+};
+
+export const Subtitle = Template.bind({});
+
+Subtitle.args = {
+  title: 'test',
+  subtitle: 'Subtitle or description',
+};
+
+export const SubtitleCanClose = Template.bind({});
+
+SubtitleCanClose.args = {
+  title: 'test',
+  subtitle: 'Subtitle or description',
+  canClose: true,
+};

package/src/stories/Radio.stories.js

@@ -1,46 +1,46 @@
-import unnnicRadio from '../components/Radio/Radio.vue';
-
-export default {
-  title: 'Form/Radio',
-  component: unnnicRadio,
-  argTypes: {
-    value: { control: { type: 'text' } },
-    disabled: { control: { type: 'boolean' } },
-    size: { control: { type: 'select', options: ['md', 'sm'] } },
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes).concat(['input']),
-  components: {
-    unnnicRadio,
-  },
-  data() {
-    return {
-      insideValue: 'option 1',
-    };
-  },
-  template: `
-    <div>
-      Inside value: {{ insideValue }}
-
-      <unnnic-radio v-model="insideValue" value="option 1" v-bind="$props">
-        Option 1
-      </unnnic-radio>
-
-      <unnnic-radio v-model="insideValue" value="option 2" v-bind="$props">
-        Option 2
-      </unnnic-radio>
-
-      <unnnic-radio v-model="insideValue" value="option 3" v-bind="$props">
-        Option 3
-      </unnnic-radio>
-    </div>
-  `,
-});
-
-export const Default = Template.bind({});
-Default.args = {
-  disabled: false,
-  size: 'md',
-};
+import unnnicRadio from '../components/Radio/Radio.vue';
+
+export default {
+  title: 'Form/Radio',
+  component: unnnicRadio,
+  argTypes: {
+    value: { control: { type: 'text' } },
+    disabled: { control: { type: 'boolean' } },
+    size: { control: { type: 'select', options: ['md', 'sm'] } },
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes).concat(['input']),
+  components: {
+    unnnicRadio,
+  },
+  data() {
+    return {
+      insideValue: 'option 1',
+    };
+  },
+  template: `
+    <div>
+      Inside value: {{ insideValue }}
+
+      <unnnic-radio v-model="insideValue" value="option 1" v-bind="$props">
+        Option 1
+      </unnnic-radio>
+
+      <unnnic-radio v-model="insideValue" value="option 2" v-bind="$props">
+        Option 2
+      </unnnic-radio>
+
+      <unnnic-radio v-model="insideValue" value="option 3" v-bind="$props">
+        Option 3
+      </unnnic-radio>
+    </div>
+  `,
+});
+
+export const Default = Template.bind({});
+Default.args = {
+  disabled: false,
+  size: 'md',
+};

package/src/stories/Select.stories.js

@@ -1,62 +1,62 @@
-import unnnicSelect from '../components/Select/Select.vue';
-
-export default {
-  title: 'example/Select',
-  component: unnnicSelect,
-  argTypes: {
-    size: { control: { type: 'select', options: ['md', 'sm'] } },
-    type: { control: { type: 'select', options: ['normal', 'error'] } },
-    search: { control: { type: 'boolean' } },
-    searchIconLeft: { control: { type: 'text' } },
-    searchPlaceholder: { control: { type: 'text' } },
-    optionsHeader: { control: { type: 'array' } },
-    hasCloudyColor: { control: { type: 'select', options: [true, false] } },
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { unnnicSelect },
-  data() {
-    return {
-      value: '1',
-      options: [
-        { value: '', text: 'None' },
-        { value: '1', text: 'option1' },
-        { value: '2', text: 'option2' },
-        { value: '3', text: 'option3' },
-        { value: '4', text: 'option4' },
-        { value: '5', text: 'option5' },
-      ],
-    };
-  },
-
-  methods: {
-    addDynamicOption() {
-      const value = Math.floor(Math.random() * 1e3);
-
-      this.options.push({
-        value: value.toString(),
-        text: `option ${value}`,
-      });
-    },
-  },
-
-  // eslint-disable-next-line no-multi-str
-  template: '<div><unnnicSelect v-model="value" v-bind="$props"> \
-    <div slot="header"> header </div>\
-    <option v-for="option in options" :value="option.value">{{ option.text }}</option> \
-  </unnnicSelect><button @click="addDynamicOption">Add dynamic option</button></div>',
-});
-
-export const Medium = Template.bind({});
-
-Medium.args = {
-  searchPlaceholder: 'Buscar por...',
-  optionsHeader: [
-    {
-      text: '+ Criar novo projeto',
-      click() { console.log('clicked'); },
-    },
-  ],
-};
+import unnnicSelect from '../components/Select/Select.vue';
+
+export default {
+  title: 'example/Select',
+  component: unnnicSelect,
+  argTypes: {
+    size: { control: { type: 'select', options: ['md', 'sm'] } },
+    type: { control: { type: 'select', options: ['normal', 'error'] } },
+    search: { control: { type: 'boolean' } },
+    searchIconLeft: { control: { type: 'text' } },
+    searchPlaceholder: { control: { type: 'text' } },
+    optionsHeader: { control: { type: 'array' } },
+    hasCloudyColor: { control: { type: 'select', options: [true, false] } },
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { unnnicSelect },
+  data() {
+    return {
+      value: '1',
+      options: [
+        { value: '', text: 'None' },
+        { value: '1', text: 'option1' },
+        { value: '2', text: 'option2' },
+        { value: '3', text: 'option3' },
+        { value: '4', text: 'option4' },
+        { value: '5', text: 'option5' },
+      ],
+    };
+  },
+
+  methods: {
+    addDynamicOption() {
+      const value = Math.floor(Math.random() * 1e3);
+
+      this.options.push({
+        value: value.toString(),
+        text: `option ${value}`,
+      });
+    },
+  },
+
+  // eslint-disable-next-line no-multi-str
+  template: '<div><unnnicSelect v-model="value" v-bind="$props"> \
+    <div slot="header"> header </div>\
+    <option v-for="option in options" :value="option.value">{{ option.text }}</option> \
+  </unnnicSelect><button @click="addDynamicOption">Add dynamic option</button></div>',
+});
+
+export const Medium = Template.bind({});
+
+Medium.args = {
+  searchPlaceholder: 'Buscar por...',
+  optionsHeader: [
+    {
+      text: '+ Criar novo projeto',
+      click() { console.log('clicked'); },
+    },
+  ],
+};

package/src/stories/SelectListItem.stories.js

@@ -1,63 +1,63 @@
-import UnnnicSelectListItem from '../components/SelectListItem/SelectListItem.vue';
-import UnnnicDropdownItem from '../components/Dropdown/DropdownItem.vue';
-
-export default {
-  title: 'select/SelectListItem',
-  component: UnnnicSelectListItem,
-  argTypes: {},
-};
-
-const Template = (args, { argTypes }) => ({
-  components: {
-    UnnnicSelectListItem,
-    UnnnicDropdownItem,
-  },
-
-  props: Object.keys(argTypes),
-
-  data() {
-    return {
-      v: false,
-      lItems: [],
-    };
-  },
-
-  created() {
-    this.lItems = this.items;
-  },
-
-  methods: {},
-
-  template: `<div><pre>v-model: {{ v }}</pre>
-
-<unnnic-select-list-item v-model="v" v-bind="$props">
-  <template slot="actions">
-    <unnnic-dropdown-item>
-      Option 1
-    </unnnic-dropdown-item>
-
-    <unnnic-dropdown-item>
-      Option 2
-    </unnnic-dropdown-item>
-  </template>
-</unnnic-select-list-item>
-
-</div>`,
-});
-
-export const Default = Template.bind({});
-
-Default.args = {
-  title: 'Captura de nome',
-  description: 'Editada há 5 minutos',
-  data: [
-    {
-      name: 'Runs:',
-      value: '13',
-    },
-    {
-      name: 'Completions',
-      value: '45%',
-    },
-  ],
-};
+import UnnnicSelectListItem from '../components/SelectListItem/SelectListItem.vue';
+import UnnnicDropdownItem from '../components/Dropdown/DropdownItem.vue';
+
+export default {
+  title: 'select/SelectListItem',
+  component: UnnnicSelectListItem,
+  argTypes: {},
+};
+
+const Template = (args, { argTypes }) => ({
+  components: {
+    UnnnicSelectListItem,
+    UnnnicDropdownItem,
+  },
+
+  props: Object.keys(argTypes),
+
+  data() {
+    return {
+      v: false,
+      lItems: [],
+    };
+  },
+
+  created() {
+    this.lItems = this.items;
+  },
+
+  methods: {},
+
+  template: `<div><pre>v-model: {{ v }}</pre>
+
+<unnnic-select-list-item v-model="v" v-bind="$props">
+  <template slot="actions">
+    <unnnic-dropdown-item>
+      Option 1
+    </unnnic-dropdown-item>
+
+    <unnnic-dropdown-item>
+      Option 2
+    </unnnic-dropdown-item>
+  </template>
+</unnnic-select-list-item>
+
+</div>`,
+});
+
+export const Default = Template.bind({});
+
+Default.args = {
+  title: 'Captura de nome',
+  description: 'Editada há 5 minutos',
+  data: [
+    {
+      name: 'Runs:',
+      value: '13',
+    },
+    {
+      name: 'Completions',
+      value: '45%',
+    },
+  ],
+};

package/src/stories/Sidebar.stories.js

@@ -1,37 +1,37 @@
-/* eslint-disable no-multi-str */
-
-import unnnicSidebar from '../components/Sidebar/Sidebar.vue';
-import unnnicSidebarItem from '../components/Sidebar/SidebarItem.vue';
-import unnnicSidebarMenu from '../components/Sidebar/SidebarMenu.vue';
-
-export default {
-  title: 'Example/Sidebar',
-  component: unnnicSidebar,
-  argTypes: {
-    expanded: { control: { type: 'select', options: [true, false] } },
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { unnnicSidebar, unnnicSidebarItem, unnnicSidebarMenu },
-  template: '<unnnic-sidebar v-bind="$props"> \
-                <p slot="header"> Title </p> \
-                <unnnic-sidebar-item icon="expand-8-1" text="footer" slot="footer" /> \
-                <unnnic-sidebar-menu text="Submenu"> \
-                  <unnnic-sidebar-item :enable-tooltip="!expanded" text="Item1" icon="developer-community-github-1-1" :active="true" /> \
-                  <unnnic-sidebar-item :enable-tooltip="!expanded" text="Item2" icon="alarm-bell-2" /> \
-                </unnnic-sidebar-menu> \
-                <unnnic-sidebar-menu text="Submenu 2"> \
-                  <unnnic-sidebar-item :enable-tooltip="!expanded" text="Item3" icon="alarm-bell-2" /> \
-                </unnnic-sidebar-menu> \
-              </unnnic-sidebar>',
-});
-
-export const Expanded = Template.bind({});
-Expanded.args = {};
-
-export const Contracted = Template.bind({});
-Contracted.args = {
-  expanded: false,
-};
+/* eslint-disable no-multi-str */
+
+import unnnicSidebar from '../components/Sidebar/Sidebar.vue';
+import unnnicSidebarItem from '../components/Sidebar/SidebarItem.vue';
+import unnnicSidebarMenu from '../components/Sidebar/SidebarMenu.vue';
+
+export default {
+  title: 'Example/Sidebar',
+  component: unnnicSidebar,
+  argTypes: {
+    expanded: { control: { type: 'select', options: [true, false] } },
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { unnnicSidebar, unnnicSidebarItem, unnnicSidebarMenu },
+  template: '<unnnic-sidebar v-bind="$props"> \
+                <p slot="header"> Title </p> \
+                <unnnic-sidebar-item icon="expand-8-1" text="footer" slot="footer" /> \
+                <unnnic-sidebar-menu text="Submenu"> \
+                  <unnnic-sidebar-item :enable-tooltip="!expanded" text="Item1" icon="developer-community-github-1-1" :active="true" /> \
+                  <unnnic-sidebar-item :enable-tooltip="!expanded" text="Item2" icon="alarm-bell-2" /> \
+                </unnnic-sidebar-menu> \
+                <unnnic-sidebar-menu text="Submenu 2"> \
+                  <unnnic-sidebar-item :enable-tooltip="!expanded" text="Item3" icon="alarm-bell-2" /> \
+                </unnnic-sidebar-menu> \
+              </unnnic-sidebar>',
+});
+
+export const Expanded = Template.bind({});
+Expanded.args = {};
+
+export const Contracted = Template.bind({});
+Contracted.args = {
+  expanded: false,
+};