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

package/src/stories/Accordion.stories.js

@@ -1,46 +1,46 @@
-import unnnicAccordion from '../components/Accordion/Accordion.vue';
-import unnnicButton from '../components/Button/Button.vue';
-
-export default {
-  title: 'example/Accordion',
-  component: unnnicAccordion,
-  argTypes: {
-    open: { control: { type: 'boolean' } },
-    title: { control: { type: 'text' } },
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-
-  components: {
-    unnnicAccordion,
-    unnnicButton,
-  },
-
-  data() {
-    return {};
-  },
-
-  template: `
-    <div>
-      <unnnic-accordion v-model="open" v-bind="$props">
-        <unnnic-button @click.stop="click" slot="actions" type="secondary" size="small" icon-left="button-play-1">Assista ao vídeo</unnnic-button>
-
-        Quae assumenda aut non nulla quod ratione odio. Suscipit voluptatem natus a. Cumque et delectus ut. Nostrum ratione eos voluptatem voluptatu quia quod qui. Velit in consequatur corrupti similique. Quae assumenda aut non nulla quod ratione odio. Suscipit voluptatem natus a.
-      </unnnic-accordion>
-    </div>
-  `,
-
-  methods: {
-    click() {
-      console.log('clicked test 2');
-    },
-  },
-});
-
-export const Default = Template.bind({});
-
-Default.args = {
-  title: 'Os valores permanecem os mesmos? O que muda no meu plano contratado?',
-};
+import unnnicAccordion from '../components/Accordion/Accordion.vue';
+import unnnicButton from '../components/Button/Button.vue';
+
+export default {
+  title: 'example/Accordion',
+  component: unnnicAccordion,
+  argTypes: {
+    open: { control: { type: 'boolean' } },
+    title: { control: { type: 'text' } },
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+
+  components: {
+    unnnicAccordion,
+    unnnicButton,
+  },
+
+  data() {
+    return {};
+  },
+
+  template: `
+    <div>
+      <unnnic-accordion v-model="open" v-bind="$props">
+        <unnnic-button @click.stop="click" slot="actions" type="secondary" size="small" icon-left="button-play-1">Assista ao vídeo</unnnic-button>
+
+        Quae assumenda aut non nulla quod ratione odio. Suscipit voluptatem natus a. Cumque et delectus ut. Nostrum ratione eos voluptatem voluptatu quia quod qui. Velit in consequatur corrupti similique. Quae assumenda aut non nulla quod ratione odio. Suscipit voluptatem natus a.
+      </unnnic-accordion>
+    </div>
+  `,
+
+  methods: {
+    click() {
+      console.log('clicked test 2');
+    },
+  },
+});
+
+export const Default = Template.bind({});
+
+Default.args = {
+  title: 'Os valores permanecem os mesmos? O que muda no meu plano contratado?',
+};

package/src/stories/Alert.stories.js

@@ -1,58 +1,58 @@
-import alertCaller from '../components/Alert/AlertCaller.vue';
-import alert from '../utils/call';
-import unnnicAlert from '../components/Alert/Alert.vue';
-
-export default {
-  title: 'example/Alert',
-  component: unnnicAlert,
-  argTypes: {
-    text: { control: { type: 'text' } },
-    title: { control: { type: 'text' } },
-    closeText: { control: { type: 'text' } },
-    scheme: {
-      control: {
-        type: 'select',
-        options: ['feedback-red', 'feedback-green', 'feedback-yellow', 'feedback-blue', 'feedback-grey',
-          'aux-blue', 'aux-purple', 'aux-orange', 'aux-lemon', 'aux-pink'],
-      },
-    },
-    position: {
-      control: {
-        type: 'select',
-        options: ['top-left', 'top-right', 'bottom-left', 'bottom-right', 'bottom-center'],
-      },
-    },
-    icon: {
-      control: {
-        type: 'select',
-        options: ['check-circle-1-1', 'check-circle-1-1-1', 'alert-circle-1-1'],
-      },
-    },
-    seconds: { control: { type: 'number' } },
-    version: {
-      control: {
-        type: 'select',
-        options: ['1.0', '1.1'],
-      },
-    },
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { alertCaller, unnnicAlert },
-  template: '<div><button @click="unnnicCallAlert"> Click for alert </button> <unnnic-alert v-bind="$props"></unnnic-alert> </div>',
-  methods: {
-    unnnicCallAlert() {
-      alert.callAlert({ props: this.$props, seconds: this.$props.seconds });
-    },
-  },
-});
-
-export const Normal = Template.bind({});
-Normal.args = {
-  title: 'Title',
-  text: 'Text',
-  icon: 'check-circle-1-1',
-  scheme: 'feedback-green',
-};
+import alertCaller from '../components/Alert/AlertCaller.vue';
+import alert from '../utils/call';
+import unnnicAlert from '../components/Alert/Alert.vue';
+
+export default {
+  title: 'example/Alert',
+  component: unnnicAlert,
+  argTypes: {
+    text: { control: { type: 'text' } },
+    title: { control: { type: 'text' } },
+    closeText: { control: { type: 'text' } },
+    scheme: {
+      control: {
+        type: 'select',
+        options: ['feedback-red', 'feedback-green', 'feedback-yellow', 'feedback-blue', 'feedback-grey',
+          'aux-blue', 'aux-purple', 'aux-orange', 'aux-lemon', 'aux-pink'],
+      },
+    },
+    position: {
+      control: {
+        type: 'select',
+        options: ['top-left', 'top-right', 'bottom-left', 'bottom-right', 'bottom-center'],
+      },
+    },
+    icon: {
+      control: {
+        type: 'select',
+        options: ['check-circle-1-1', 'check-circle-1-1-1', 'alert-circle-1-1'],
+      },
+    },
+    seconds: { control: { type: 'number' } },
+    version: {
+      control: {
+        type: 'select',
+        options: ['1.0', '1.1'],
+      },
+    },
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { alertCaller, unnnicAlert },
+  template: '<div><button @click="unnnicCallAlert"> Click for alert </button> <unnnic-alert v-bind="$props"></unnnic-alert> </div>',
+  methods: {
+    unnnicCallAlert() {
+      alert.callAlert({ props: this.$props, seconds: this.$props.seconds });
+    },
+  },
+});
+
+export const Normal = Template.bind({});
+Normal.args = {
+  title: 'Title',
+  text: 'Text',
+  icon: 'check-circle-1-1',
+  scheme: 'feedback-green',
+};

package/src/stories/AudioRecorder.stories.js

@@ -1,48 +1,48 @@
-import unnnicAudioRecorder from '../components/AudioRecorder/AudioRecorder.vue';
-import AudioSample from './assets/audios/audio-recorder-sample.mp3';
-
-export default {
-  title: 'Form/AudioRecorder',
-  component: unnnicAudioRecorder,
-  argTypes: {},
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-
-  components: {
-    unnnicAudioRecorder,
-  },
-
-  data() {
-    return {
-      audio: null,
-      status: '',
-    };
-  },
-
-  template: `
-    <div>
-      <button @click="$refs['audio-recorder'].record()">Gravar</button>
-
-      <pre>v-model: {{ audio }}</pre>
-      <pre>status: {{ status }}</pre>
-
-      <unnnic-audio-recorder v-bind="$props" ref="audio-recorder" v-model="audio" @status="(value) => this.status = value" />
-    </div>
-  `,
-
-  methods: {},
-});
-
-export const Default = Template.bind({});
-
-Default.args = {
-  canDiscard: true,
-};
-
-export const Player = Template.bind({});
-
-Player.args = {
-  src: AudioSample,
-};
+import unnnicAudioRecorder from '../components/AudioRecorder/AudioRecorder.vue';
+import AudioSample from './assets/audios/audio-recorder-sample.mp3';
+
+export default {
+  title: 'Form/AudioRecorder',
+  component: unnnicAudioRecorder,
+  argTypes: {},
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+
+  components: {
+    unnnicAudioRecorder,
+  },
+
+  data() {
+    return {
+      audio: null,
+      status: '',
+    };
+  },
+
+  template: `
+    <div>
+      <button @click="$refs['audio-recorder'].record()">Gravar</button>
+
+      <pre>v-model: {{ audio }}</pre>
+      <pre>status: {{ status }}</pre>
+
+      <unnnic-audio-recorder v-bind="$props" ref="audio-recorder" v-model="audio" @status="(value) => this.status = value" />
+    </div>
+  `,
+
+  methods: {},
+});
+
+export const Default = Template.bind({});
+
+Default.args = {
+  canDiscard: true,
+};
+
+export const Player = Template.bind({});
+
+Player.args = {
+  src: AudioSample,
+};

package/src/stories/Autocomplete.stories.js

@@ -1,55 +1,55 @@
-import unnnicAutocomplete from '../components/Input/Autocomplete.vue';
-import iconList from '../utils/iconList';
-
-export default {
-  title: 'Example/Autocomplete',
-  component: unnnicAutocomplete,
-  argTypes: {
-    type: { control: { type: 'select', options: ['normal', 'error'] } },
-    size: { control: { type: 'select', options: ['md', 'sm'] } },
-    placeholder: { control: { type: 'text' } },
-    iconLeft: { control: { type: 'select', options: iconList } },
-    iconRight: { control: { type: 'select', options: iconList } },
-    tooltipIconRight: { control: { type: 'text' } },
-    tooltipSideIconRight: { control: { type: 'select', options: ['top', 'right', 'bottom', 'left'] } },
-    tooltipForceOpenIconRight: { control: { type: 'boolean' } },
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { unnnicAutocomplete },
-  data() {
-    return {
-      v: '',
-      d: [
-        'option 1',
-        { type: 'category', text: 'Artificial Intelligence' },
-        'option 2',
-        'option 3',
-        { type: 'category', text: 'Flows' },
-        'option 4',
-        'option 5',
-      ],
-    };
-  },
-  template: '<unnnic-autocomplete v-model="v" v-bind="$props" :data="d.filter(e => e.includes?.(v))" />',
-});
-
-export const Normal = Template.bind({});
-Normal.args = {
-  type: 'normal',
-  placeholder: 'Placeholder',
-};
-
-export const Error = Template.bind({});
-Error.args = {
-  type: 'error',
-  placeholder: 'Placeholder',
-};
-
-export const Disabled = Template.bind({});
-Disabled.args = {
-  disabled: true,
-  placeholder: 'Placeholder',
-};
+import unnnicAutocomplete from '../components/Input/Autocomplete.vue';
+import iconList from '../utils/iconList';
+
+export default {
+  title: 'Example/Autocomplete',
+  component: unnnicAutocomplete,
+  argTypes: {
+    type: { control: { type: 'select', options: ['normal', 'error'] } },
+    size: { control: { type: 'select', options: ['md', 'sm'] } },
+    placeholder: { control: { type: 'text' } },
+    iconLeft: { control: { type: 'select', options: iconList } },
+    iconRight: { control: { type: 'select', options: iconList } },
+    tooltipIconRight: { control: { type: 'text' } },
+    tooltipSideIconRight: { control: { type: 'select', options: ['top', 'right', 'bottom', 'left'] } },
+    tooltipForceOpenIconRight: { control: { type: 'boolean' } },
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { unnnicAutocomplete },
+  data() {
+    return {
+      v: '',
+      d: [
+        'option 1',
+        { type: 'category', text: 'Artificial Intelligence' },
+        'option 2',
+        'option 3',
+        { type: 'category', text: 'Flows' },
+        'option 4',
+        'option 5',
+      ],
+    };
+  },
+  template: '<unnnic-autocomplete v-model="v" v-bind="$props" :data="d.filter(e => e.includes?.(v))" />',
+});
+
+export const Normal = Template.bind({});
+Normal.args = {
+  type: 'normal',
+  placeholder: 'Placeholder',
+};
+
+export const Error = Template.bind({});
+Error.args = {
+  type: 'error',
+  placeholder: 'Placeholder',
+};
+
+export const Disabled = Template.bind({});
+Disabled.args = {
+  disabled: true,
+  placeholder: 'Placeholder',
+};

package/src/stories/AutocompleteSelect.stories.js

@@ -1,45 +1,45 @@
-import unnnicAutocompleteSelect from '../components/AutocompleteSelect/AutocompleteSelect.vue';
-
-export default {
-  title: 'Form/AutocompleteSelect',
-  component: unnnicAutocompleteSelect,
-  argTypes: {},
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-
-  components: {
-    unnnicAutocompleteSelect,
-  },
-
-  data() {
-    return {
-      selecteds: [],
-    };
-  },
-
-  template: `
-    <div>
-      <pre>v-model: {{ selecteds }}</pre>
-      <unnnic-autocomplete-select v-bind="$props" v-model="selecteds">
-      </unnnic-autocomplete-select>
-    </div>
-  `,
-
-  methods: {},
-});
-
-export const Default = Template.bind({});
-
-Default.args = {
-  items: [
-    { value: 'Item 1', text: 'Item 1', description: 'Description 1' },
-    { value: 'Item 2', text: 'Item 2', description: 'Description 2' },
-    { value: 'Item 3', text: 'Item 3', description: 'Description 3' },
-    { value: 'Item 4', text: 'Item 4', description: 'Description 4' },
-    { value: 'Item 5', text: 'Item 5', description: 'Description 5' },
-    { value: 'Item 6', text: 'Item 6', description: 'Description 6' },
-    { value: 'Item 7', text: 'Item 7', description: 'Description 7' },
-  ],
-};
+import unnnicAutocompleteSelect from '../components/AutocompleteSelect/AutocompleteSelect.vue';
+
+export default {
+  title: 'Form/AutocompleteSelect',
+  component: unnnicAutocompleteSelect,
+  argTypes: {},
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+
+  components: {
+    unnnicAutocompleteSelect,
+  },
+
+  data() {
+    return {
+      selecteds: [],
+    };
+  },
+
+  template: `
+    <div>
+      <pre>v-model: {{ selecteds }}</pre>
+      <unnnic-autocomplete-select v-bind="$props" v-model="selecteds">
+      </unnnic-autocomplete-select>
+    </div>
+  `,
+
+  methods: {},
+});
+
+export const Default = Template.bind({});
+
+Default.args = {
+  items: [
+    { value: 'Item 1', text: 'Item 1', description: 'Description 1' },
+    { value: 'Item 2', text: 'Item 2', description: 'Description 2' },
+    { value: 'Item 3', text: 'Item 3', description: 'Description 3' },
+    { value: 'Item 4', text: 'Item 4', description: 'Description 4' },
+    { value: 'Item 5', text: 'Item 5', description: 'Description 5' },
+    { value: 'Item 6', text: 'Item 6', description: 'Description 6' },
+    { value: 'Item 7', text: 'Item 7', description: 'Description 7' },
+  ],
+};

package/src/stories/AvatarIcon.stories.js

@@ -1,24 +1,24 @@
-import AvatarIcon from '../components/AvatarIcon/AvatarIcon.vue';
-
-export default {
-  title: 'Example/AvatarIcon',
-  component: AvatarIcon,
-  argTypes: {
-    size: {
-      control: {
-        type: 'select',
-        options: ['nano', 'xs', 'sm', 'lg', 'xl'],
-      },
-    },
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { AvatarIcon },
-  template: '<avatar-icon v-bind="$props"/>',
-});
-
-export const Normal = Template.bind({});
-Normal.args = {
-};
+import AvatarIcon from '../components/AvatarIcon/AvatarIcon.vue';
+
+export default {
+  title: 'Example/AvatarIcon',
+  component: AvatarIcon,
+  argTypes: {
+    size: {
+      control: {
+        type: 'select',
+        options: ['nano', 'xs', 'sm', 'lg', 'xl'],
+      },
+    },
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { AvatarIcon },
+  template: '<avatar-icon v-bind="$props"/>',
+});
+
+export const Normal = Template.bind({});
+Normal.args = {
+};

package/src/stories/Banner.stories.js

@@ -1,46 +1,46 @@
-import unnnicBanner from '../components/Banner/Banner.vue';
-
-export default {
-  title: 'example/Banner',
-  component: unnnicBanner,
-  argTypes: {
-    type: {
-      control: {
-        type: 'select',
-        options: ['info'],
-      },
-    },
-    firstTitle: { control: { type: 'text' } },
-    firstDescription: { control: { type: 'text' } },
-    secondTitle: { control: { type: 'text' } },
-    secondDescription: { control: { type: 'text' } },
-    thirdTitle: { control: { type: 'text' } },
-    thirdDescription: { control: { type: 'text' } },
-    subtitle: { control: { type: 'text' } },
-    rating: { control: { type: 'number' } },
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { unnnicBanner },
-  template: '<unnnicBanner v-bind="$props" @ratingAction="emitRatingAction" />',
-  methods: {
-    emitRatingAction(star) {
-      window.alert(`star: ${star}`);
-    },
-  },
-});
-
-export const Info = Template.bind({});
-Info.args = {
-  type: 'info',
-  firstTitle: 'Title 1',
-  firstDescription: 'Description 1',
-  secondTitle: 'Title 2',
-  secondDescription: 'Description 2',
-  thirdTitle: 'Title 3',
-  thirdDescription: 'Description 3',
-  subtitle: 'Subtitle',
-  rating: 3,
-};
+import unnnicBanner from '../components/Banner/Banner.vue';
+
+export default {
+  title: 'example/Banner',
+  component: unnnicBanner,
+  argTypes: {
+    type: {
+      control: {
+        type: 'select',
+        options: ['info'],
+      },
+    },
+    firstTitle: { control: { type: 'text' } },
+    firstDescription: { control: { type: 'text' } },
+    secondTitle: { control: { type: 'text' } },
+    secondDescription: { control: { type: 'text' } },
+    thirdTitle: { control: { type: 'text' } },
+    thirdDescription: { control: { type: 'text' } },
+    subtitle: { control: { type: 'text' } },
+    rating: { control: { type: 'number' } },
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { unnnicBanner },
+  template: '<unnnicBanner v-bind="$props" @ratingAction="emitRatingAction" />',
+  methods: {
+    emitRatingAction(star) {
+      window.alert(`star: ${star}`);
+    },
+  },
+});
+
+export const Info = Template.bind({});
+Info.args = {
+  type: 'info',
+  firstTitle: 'Title 1',
+  firstDescription: 'Description 1',
+  secondTitle: 'Title 2',
+  secondDescription: 'Description 2',
+  thirdTitle: 'Title 3',
+  thirdDescription: 'Description 3',
+  subtitle: 'Subtitle',
+  rating: 3,
+};