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

package/src/stories/ModalNext.stories.js

@@ -1,171 +1,171 @@
-import unnnicModalNext from '../components/ModalNext/ModalNext.vue';
-import icons from '../utils/icons';
-
-const iconsOptions = Object.keys(icons);
-
-const schemesOptions = [
-  'feedback-red',
-  'feedback-green',
-  'feedback-yellow',
-  'feedback-blue',
-  'feedback-grey',
-  'aux-blue',
-  'aux-purple',
-  'aux-orange',
-  'aux-lemon',
-  'aux-pink',
-  'brand-weni',
-  'brand-weni-soft',
-  'neutral-clean',
-  'neutral-cleanest',
-  'neutral-dark',
-  'neutral-soft',
-  'neutral-darkest',
-];
-
-export default {
-  title: 'Example/ModalNext',
-  component: unnnicModalNext,
-  argTypes: {
-    type: { control: { type: 'select', options: ['default', 'video', 'alert'] } },
-    icon: { control: { type: 'select', options: iconsOptions } },
-    scheme: { control: { type: 'select', options: schemesOptions } },
-    text: { control: { type: 'text' } },
-    description: { control: { type: 'text' } },
-    actionPrimaryButtonType: { control: { type: 'select', options: ['primary', 'secondary'] } },
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { unnnicModalNext },
-  data() {
-    return {
-      open: false,
-    };
-  },
-  template: `<div>
-  <button @click="open = true">Open</button>
-  <unnnic-modal-next v-show="open" v-bind="$props" @close="open = false" />
-</div>`,
-});
-
-export const Video = Template.bind({});
-Video.args = {
-  type: 'video',
-  url: 'https://www.youtube.com/embed/J9QJBPrmoHs',
-  confirmButtonType: undefined,
-};
-
-const TemplateDefault = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { unnnicModalNext },
-  data() {
-    return {
-      open: false,
-    };
-  },
-  template: `<div>
-  <button @click="open = true">Open</button>
-  <unnnic-modal-next v-show="open" v-bind="$props" @close="open = false">
-    <template>
-      This is the info content<br>
-      This is the info content<br>
-      This is the info content<br>
-      This is the info content<br>
-      This is the info content<br>
-      This is the info content<br>
-      This is the info content<br>
-      This is the info content<br>
-      This is the info content<br>
-      This is the info content<br>
-      This is the info content<br>
-      This is the info content<br>
-      This is the info content<br>
-      This is the info content<br>
-      This is the info content<br>
-      This is the info content<br>
-      This is the info content<br>
-      This is the info content<br>
-      This is the info content<br>
-      This is the info content<br>
-      This is the info content<br>
-    </template>
-  </unnnic-modal-next>
-</div>`,
-});
-
-export const Default = TemplateDefault.bind({});
-Default.args = {
-  type: undefined,
-  confirmButtonType: undefined,
-};
-
-export const Alert = TemplateDefault.bind({});
-Alert.args = {
-  type: 'alert',
-  icon: 'add-1',
-  scheme: 'feedback-green',
-  title: 'Title',
-  description: 'Description',
-  confirmButtonType: undefined,
-};
-
-const TemplateAlertWithSlots = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { unnnicModalNext },
-  data() {
-    return {
-      open: false,
-    };
-  },
-  template: `<div>
-  <button @click="open = true">Open</button>
-  <unnnic-modal-next v-show="open" v-bind="$props" @close="open = false">
-    <template slot="title">
-      Title Slot
-    </template>
-
-    <template slot="description">
-      Description Slot
-    </template>
-  </unnnic-modal-next>
-</div>`,
-});
-
-export const AlertWithSlots = TemplateAlertWithSlots.bind({});
-AlertWithSlots.args = {
-  type: 'alert',
-  icon: 'add-1',
-  scheme: 'feedback-green',
-  confirmButtonType: undefined,
-};
-
-export const AlertWithValidate = TemplateDefault.bind({});
-AlertWithValidate.args = {
-  type: 'alert',
-  icon: 'add-1',
-  scheme: 'feedback-red',
-  title: 'Title',
-  description: 'Description',
-  confirmButtonType: undefined,
-  validate: 'Hello World!',
-  validatePlaceholder: 'Validate Placeholder',
-  validateLabel: 'Validate <b>Label</b>',
-  actionPrimaryLabel: 'Confirm',
-  actionSecondaryLabel: 'Cancel',
-};
-
-export const AlertWithActionButtons = TemplateDefault.bind({});
-AlertWithActionButtons.args = {
-  type: 'alert',
-  icon: 'add-1',
-  scheme: 'feedback-red',
-  title: 'Title',
-  description: 'Description',
-  confirmButtonType: undefined,
-  actionPrimaryLabel: 'Confirm',
-  actionSecondaryLabel: 'Cancel',
-  actionPrimaryButtonType: undefined,
-  showCloseButton: true,
-};
+import unnnicModalNext from '../components/ModalNext/ModalNext.vue';
+import icons from '../utils/icons';
+
+const iconsOptions = Object.keys(icons);
+
+const schemesOptions = [
+  'feedback-red',
+  'feedback-green',
+  'feedback-yellow',
+  'feedback-blue',
+  'feedback-grey',
+  'aux-blue',
+  'aux-purple',
+  'aux-orange',
+  'aux-lemon',
+  'aux-pink',
+  'brand-weni',
+  'brand-weni-soft',
+  'neutral-clean',
+  'neutral-cleanest',
+  'neutral-dark',
+  'neutral-soft',
+  'neutral-darkest',
+];
+
+export default {
+  title: 'Example/ModalNext',
+  component: unnnicModalNext,
+  argTypes: {
+    type: { control: { type: 'select', options: ['default', 'video', 'alert'] } },
+    icon: { control: { type: 'select', options: iconsOptions } },
+    scheme: { control: { type: 'select', options: schemesOptions } },
+    text: { control: { type: 'text' } },
+    description: { control: { type: 'text' } },
+    actionPrimaryButtonType: { control: { type: 'select', options: ['primary', 'secondary'] } },
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { unnnicModalNext },
+  data() {
+    return {
+      open: false,
+    };
+  },
+  template: `<div>
+  <button @click="open = true">Open</button>
+  <unnnic-modal-next v-show="open" v-bind="$props" @close="open = false" />
+</div>`,
+});
+
+export const Video = Template.bind({});
+Video.args = {
+  type: 'video',
+  url: 'https://www.youtube.com/embed/J9QJBPrmoHs',
+  confirmButtonType: undefined,
+};
+
+const TemplateDefault = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { unnnicModalNext },
+  data() {
+    return {
+      open: false,
+    };
+  },
+  template: `<div>
+  <button @click="open = true">Open</button>
+  <unnnic-modal-next v-show="open" v-bind="$props" @close="open = false">
+    <template>
+      This is the info content<br>
+      This is the info content<br>
+      This is the info content<br>
+      This is the info content<br>
+      This is the info content<br>
+      This is the info content<br>
+      This is the info content<br>
+      This is the info content<br>
+      This is the info content<br>
+      This is the info content<br>
+      This is the info content<br>
+      This is the info content<br>
+      This is the info content<br>
+      This is the info content<br>
+      This is the info content<br>
+      This is the info content<br>
+      This is the info content<br>
+      This is the info content<br>
+      This is the info content<br>
+      This is the info content<br>
+      This is the info content<br>
+    </template>
+  </unnnic-modal-next>
+</div>`,
+});
+
+export const Default = TemplateDefault.bind({});
+Default.args = {
+  type: undefined,
+  confirmButtonType: undefined,
+};
+
+export const Alert = TemplateDefault.bind({});
+Alert.args = {
+  type: 'alert',
+  icon: 'add-1',
+  scheme: 'feedback-green',
+  title: 'Title',
+  description: 'Description',
+  confirmButtonType: undefined,
+};
+
+const TemplateAlertWithSlots = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { unnnicModalNext },
+  data() {
+    return {
+      open: false,
+    };
+  },
+  template: `<div>
+  <button @click="open = true">Open</button>
+  <unnnic-modal-next v-show="open" v-bind="$props" @close="open = false">
+    <template slot="title">
+      Title Slot
+    </template>
+
+    <template slot="description">
+      Description Slot
+    </template>
+  </unnnic-modal-next>
+</div>`,
+});
+
+export const AlertWithSlots = TemplateAlertWithSlots.bind({});
+AlertWithSlots.args = {
+  type: 'alert',
+  icon: 'add-1',
+  scheme: 'feedback-green',
+  confirmButtonType: undefined,
+};
+
+export const AlertWithValidate = TemplateDefault.bind({});
+AlertWithValidate.args = {
+  type: 'alert',
+  icon: 'add-1',
+  scheme: 'feedback-red',
+  title: 'Title',
+  description: 'Description',
+  confirmButtonType: undefined,
+  validate: 'Hello World!',
+  validatePlaceholder: 'Validate Placeholder',
+  validateLabel: 'Validate <b>Label</b>',
+  actionPrimaryLabel: 'Confirm',
+  actionSecondaryLabel: 'Cancel',
+};
+
+export const AlertWithActionButtons = TemplateDefault.bind({});
+AlertWithActionButtons.args = {
+  type: 'alert',
+  icon: 'add-1',
+  scheme: 'feedback-red',
+  title: 'Title',
+  description: 'Description',
+  confirmButtonType: undefined,
+  actionPrimaryLabel: 'Confirm',
+  actionSecondaryLabel: 'Cancel',
+  actionPrimaryButtonType: undefined,
+  showCloseButton: true,
+};

package/src/stories/ModalUpload.stories.js

@@ -1,29 +1,29 @@
-import unnnicModalUpload from '../components/ModalUpload/ModalUpload.vue';
-
-export default {
-  title: 'example/ModalUpload',
-  component: unnnicModalUpload,
-  argTypes: {},
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-
-  components: {
-    unnnicModalUpload,
-  },
-
-  data() {
-    return {};
-  },
-
-  template: `
-    <div>
-      <unnnic-modal-upload v-bind="$props" />
-    </div>
-  `,
-});
-
-export const Default = Template.bind({});
-
-Default.args = {};
+import unnnicModalUpload from '../components/ModalUpload/ModalUpload.vue';
+
+export default {
+  title: 'example/ModalUpload',
+  component: unnnicModalUpload,
+  argTypes: {},
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+
+  components: {
+    unnnicModalUpload,
+  },
+
+  data() {
+    return {};
+  },
+
+  template: `
+    <div>
+      <unnnic-modal-upload v-bind="$props" />
+    </div>
+  `,
+});
+
+export const Default = Template.bind({});
+
+Default.args = {};

package/src/stories/MoodRating.stories.js

@@ -1,37 +1,37 @@
-import unnnicMoodRating from '../components/MoodRating/MoodRating.vue';
-
-export default {
-  title: 'Rating/MoodRating',
-  component: unnnicMoodRating,
-  argTypes: {},
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-
-  components: {
-    unnnicMoodRating,
-  },
-
-  data() {
-    return {
-      mood: null,
-    };
-  },
-
-  template: `
-    <div>
-      <!--<pre>v-model: {{ mood }}</pre>-->
-      <unnnic-mood-rating v-bind="$props" v-model="mood">
-      </unnnic-mood-rating>
-    </div>
-  `,
-
-  methods: {},
-});
-
-export const Default = Template.bind({});
-
-Default.args = {
-  title: 'Avalie seu aprendizado nesta aula',
-};
+import unnnicMoodRating from '../components/MoodRating/MoodRating.vue';
+
+export default {
+  title: 'Rating/MoodRating',
+  component: unnnicMoodRating,
+  argTypes: {},
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+
+  components: {
+    unnnicMoodRating,
+  },
+
+  data() {
+    return {
+      mood: null,
+    };
+  },
+
+  template: `
+    <div>
+      <!--<pre>v-model: {{ mood }}</pre>-->
+      <unnnic-mood-rating v-bind="$props" v-model="mood">
+      </unnnic-mood-rating>
+    </div>
+  `,
+
+  methods: {},
+});
+
+export const Default = Template.bind({});
+
+Default.args = {
+  title: 'Avalie seu aprendizado nesta aula',
+};

package/src/stories/MultiSelect.stories.js

@@ -1,55 +1,55 @@
-import unnnicMultiSelect from '../components/MultiSelect/MultiSelect.vue';
-
-export default {
-  title: 'Form/MultiSelect',
-  component: unnnicMultiSelect,
-  argTypes: {},
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { unnnicMultiSelect },
-  data() {
-    return {
-      groups: [
-        {
-          title: 'Permissões Gerais',
-          selected: 0,
-          items: [
-            {
-              title: 'Moderador',
-              description: 'Gerencia membros do projeto e administra o rocket',
-            },
-            { title: 'Contribuidor', description: 'Consegue editar o projeto' },
-            {
-              title: 'Vizualizador',
-              description: 'Apenas vizualiza o projeto',
-            },
-          ],
-        },
-        {
-          title: 'Permissões do módulo chat',
-          selected: 0,
-          items: [
-            {
-              title: 'Gerente de Atendimento',
-              description:
-                'Consegue responder mensagens e criar grupos no Rocket',
-            },
-            {
-              title: 'Agente',
-              description: 'Consegue responder mensagens no Rocket',
-            },
-          ],
-        },
-      ],
-    };
-  },
-
-  // eslint-disable-next-line no-multi-str
-  template: '<div><unnnicMultiSelect v-bind="$props" v-model="groups"></unnnicMultiSelect></div>',
-});
-
-export const Medium = Template.bind({});
-
-Medium.args = {};
+import unnnicMultiSelect from '../components/MultiSelect/MultiSelect.vue';
+
+export default {
+  title: 'Form/MultiSelect',
+  component: unnnicMultiSelect,
+  argTypes: {},
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { unnnicMultiSelect },
+  data() {
+    return {
+      groups: [
+        {
+          title: 'Permissões Gerais',
+          selected: 0,
+          items: [
+            {
+              title: 'Moderador',
+              description: 'Gerencia membros do projeto e administra o rocket',
+            },
+            { title: 'Contribuidor', description: 'Consegue editar o projeto' },
+            {
+              title: 'Vizualizador',
+              description: 'Apenas vizualiza o projeto',
+            },
+          ],
+        },
+        {
+          title: 'Permissões do módulo chat',
+          selected: 0,
+          items: [
+            {
+              title: 'Gerente de Atendimento',
+              description:
+                'Consegue responder mensagens e criar grupos no Rocket',
+            },
+            {
+              title: 'Agente',
+              description: 'Consegue responder mensagens no Rocket',
+            },
+          ],
+        },
+      ],
+    };
+  },
+
+  // eslint-disable-next-line no-multi-str
+  template: '<div><unnnicMultiSelect v-bind="$props" v-model="groups"></unnnicMultiSelect></div>',
+});
+
+export const Medium = Template.bind({});
+
+Medium.args = {};

package/src/stories/Pagination.stories.js

@@ -1,31 +1,31 @@
-import unnnicPagination from '../components/Pagination/Pagination.vue';
-
-export default {
-  title: 'example/Pagination',
-  component: unnnicPagination,
-  argTypes: {},
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-
-  components: {
-    unnnicPagination,
-  },
-
-  data() {
-    return {
-      page: 1,
-    };
-  },
-
-  template: `
-    <div>
-      <unnnic-pagination v-bind="$props" v-model="page" :max="10" :show="5"/>
-    </div>
-  `,
-});
-
-export const Default = Template.bind({});
-
-Default.args = {};
+import unnnicPagination from '../components/Pagination/Pagination.vue';
+
+export default {
+  title: 'example/Pagination',
+  component: unnnicPagination,
+  argTypes: {},
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+
+  components: {
+    unnnicPagination,
+  },
+
+  data() {
+    return {
+      page: 1,
+    };
+  },
+
+  template: `
+    <div>
+      <unnnic-pagination v-bind="$props" v-model="page" :max="10" :show="5"/>
+    </div>
+  `,
+});
+
+export const Default = Template.bind({});
+
+Default.args = {};