sprintify-ui 0.8.35 → 0.8.37

package/src/components/BaseHeader.stories.js

@@ -1,12 +1,12 @@
-import BaseHeader from './BaseHeader.vue';
+import BaseHeader from "./BaseHeader.vue";
 
 export default {
-  title: 'Layout/BaseHeader',
+  title: "Layout/BaseHeader",
   component: BaseHeader,
   argTypes: {
     layout: {
-      control: { type: 'select' },
-      options: ['default', 'compact'],
+      control: { type: "select" },
+      options: ["default", "compact"],
     },
   },
 };
@@ -24,75 +24,75 @@ const Template = (args) => ({
 });
 
 const badge = {
-  label: 'Draft',
-  color: 'yellow',
-  icon: 'heroicons:document-text-solid',
+  label: "Draft",
+  color: "yellow",
+  icon: "heroicons:document-text-solid",
 };
 
 const attributes = [
   {
-    label: 'Full Time',
-    icon: 'heroicons:briefcase-solid',
-    tooltip: '40h a week',
+    label: "Full Time",
+    icon: "heroicons:briefcase-solid",
+    tooltip: "40h a week",
   },
   {
-    label: 'Remote',
-    icon: 'heroicons:map-pin-solid',
+    label: "Remote",
+    icon: "heroicons:map-pin-solid",
   },
 ];
 
 const actions = [
   {
-    label: 'View',
-    icon: 'heroicons:link-solid',
+    label: "View",
+    icon: "heroicons:link-solid",
     action() {
-      alert('View');
+      alert("View");
     },
   },
   {
-    label: 'Edit',
-    to: '/articles',
-    icon: 'heroicons:pencil-solid',
+    label: "Edit",
+    to: "/articles",
+    icon: "heroicons:pencil-solid",
   },
   {
-    label: 'Publish 2',
-    to: '/articles',
-    color: 'secondary',
-    icon: 'heroicons:check-solid',
+    label: "Publish 2",
+    to: "/articles",
+    color: "secondary",
+    icon: "heroicons:check-solid",
   },
 
   {
-    label: 'Publish',
-    to: '/articles',
-    color: 'primary',
-    icon: 'heroicons:check-solid',
+    label: "Publish",
+    to: "/articles",
+    color: "primary",
+    icon: "heroicons:check-solid",
   },
 ];
 
 const breadcrumbs = [
   {
-    label: 'Home',
-    icon: 'heroicons:home-20-solid',
-    to: '/',
+    label: "Home",
+    icon: "heroicons:home-20-solid",
+    to: "/",
   },
   {
-    label: 'Users',
-    to: '/users',
+    label: "Users",
+    to: "/users",
   },
   {
-    label: 'John Doe',
-    to: '/users/1',
+    label: "John Doe",
+    to: "/users/1",
   },
   {
-    label: 'Very long title this is a very long title that will be truncated',
-    to: '/users/1/settings',
+    label: "Very long title this is a very long title that will be truncated",
+    to: "/users/1/settings",
   },
 ];
 
 export const Demo = Template.bind({});
 Demo.args = {
-  title: 'Create Article',
-  subtitle: 'Create a new article, and publish it to the world. ',
+  title: "Create Article",
+  subtitle: "Create a new article, and publish it to the world. ",
   actions: actions,
   attributes: attributes,
   badge: badge,
@@ -101,34 +101,34 @@ Demo.args = {
 
 export const Simple = Template.bind({});
 Simple.args = {
-  title: 'Create Article',
+  title: "Create Article",
   actions: actions,
 };
 
 export const Subtitle = Template.bind({});
 Subtitle.args = {
-  title: 'Create Article',
-  subtitle: 'Create a new article, and publish it to the world. ',
+  title: "Create Article",
+  subtitle: "Create a new article, and publish it to the world. ",
   actions: actions,
 };
 
 export const Attributes = Template.bind({});
 Attributes.args = {
-  title: 'Create Article',
+  title: "Create Article",
   attributes: attributes,
   actions: actions,
 };
 
 export const Badge = Template.bind({});
 Badge.args = {
-  title: 'Create Article',
+  title: "Create Article",
   actions: actions,
   badge: badge,
 };
 
 export const Breadcrumbs = Template.bind({});
 Breadcrumbs.args = {
-  title: 'Create Article',
+  title: "Create Article",
   actions: actions,
   breadcrumbs: breadcrumbs,
 };

package/src/components/BaseIconPicker.stories.js

@@ -1,15 +1,15 @@
-import BaseIconPicker from './BaseIconPicker.vue';
-import ShowValue from '../../.storybook/components/ShowValue.vue';
+import BaseIconPicker from "./BaseIconPicker.vue";
+import ShowValue from "../../.storybook/components/ShowValue.vue";
 
 export default {
-  title: 'Components/BaseIconPicker',
+  title: "Components/BaseIconPicker",
   component: BaseIconPicker,
 };
 
 const Template = (args) => ({
   components: { BaseIconPicker, ShowValue },
   setup() {
-    const value = ref('heroicons:user-group-solid');
+    const value = ref("heroicons:user-group-solid");
     return { args, value };
   },
   template: `

package/src/components/BaseInput.stories.js

@@ -1,10 +1,10 @@
-import BaseInput from './BaseInput.vue';
-import ShowValue from '@/../.storybook/components/ShowValue.vue';
-import { createFieldStory } from '@/../.storybook/utils';
-import { sizes } from '../../.storybook/utils';
+import BaseInput from "./BaseInput.vue";
+import ShowValue from "@/../.storybook/components/ShowValue.vue";
+import { createFieldStory } from "@/../.storybook/utils";
+import { sizes } from "../../.storybook/utils";
 
 export default {
-  title: 'Form/BaseInput',
+  title: "Form/BaseInput",
   component: BaseInput,
   decorators: [
     (story) => ({
@@ -16,24 +16,24 @@ export default {
     }),
   ],
   args: {
-    type: 'text',
-    placeholder: 'Enter your name',
+    type: "text",
+    placeholder: "Enter your name",
   },
   argTypes: {
     size: {
-      control: { type: 'select' },
-      options: ['xs', 'sm', 'md'],
+      control: { type: "select" },
+      options: ["xs", "sm", "md"],
     },
     mask: {
-      control: { type: 'select' },
+      control: { type: "select" },
       options: [
-        'phone',
-        'date',
-        'time',
-        'credit-card',
-        'zip-code-canada',
-        'dynamicMask',
-        'customMask',
+        "phone",
+        "date",
+        "time",
+        "credit-card",
+        "zip-code-canada",
+        "dynamicMask",
+        "customMask",
       ],
     },
   },
@@ -55,47 +55,47 @@ export const Demo = Template.bind({});
 
 export const IconLeft = Template.bind({});
 IconLeft.args = {
-  iconLeft: 'heroicons:calendar',
-  placeholder: 'Enter your phone',
+  iconLeft: "heroicons:calendar",
+  placeholder: "Enter your phone",
 };
 
 export const IconRight = Template.bind({});
 IconRight.args = {
-  iconRight: 'mdi:email',
-  placeholder: 'Enter your email',
+  iconRight: "mdi:email",
+  placeholder: "Enter your email",
 };
 
 export const Prefix = Template.bind({});
 Prefix.args = {
-  prefix: 'https://',
-  placeholder: 'website URL',
+  prefix: "https://",
+  placeholder: "website URL",
 };
 
 export const Suffix = Template.bind({});
 Suffix.args = {
-  suffix: '%',
-  placeholder: 'Percentage',
+  suffix: "%",
+  placeholder: "Percentage",
 };
 
 export const All = Template.bind({});
 All.args = {
-  iconLeft: 'heroicons:currency-dollar-20-solid',
-  prefix: 'Price',
-  iconRight: 'heroicons:document-magnifying-glass',
-  suffix: '$',
-  placeholder: 'Item price',
+  iconLeft: "heroicons:currency-dollar-20-solid",
+  prefix: "Price",
+  iconRight: "heroicons:document-magnifying-glass",
+  suffix: "$",
+  placeholder: "Item price",
 };
 
 export const Number = Template.bind({});
 Number.args = {
-  type: 'number',
+  type: "number",
   step: 0.1,
-  placeholder: 'Enter a number',
+  placeholder: "Enter a number",
 };
 
 export const Disabled = Template.bind({});
 Disabled.args = {
-  modelValue: 'Disabled input!',
+  modelValue: "Disabled input!",
   disabled: true,
 };
 
@@ -107,46 +107,46 @@ Required.args = {
 export const Error = Template.bind({});
 Error.args = {
   hasError: true,
-  prefix: 'Price',
-  iconRight: 'heroicons:currency-dollar',
+  prefix: "Price",
+  iconRight: "heroicons:currency-dollar",
 };
 
 export const PhoneMask = Template.bind({});
 PhoneMask.args = {
-  mask: 'phone',
-  placeholder: '(250) 555-0199',
+  mask: "phone",
+  placeholder: "(250) 555-0199",
 };
 
 export const DateMask = Template.bind({});
 DateMask.args = {
-  mask: 'date',
-  placeholder: 'yyyy-mm-dd',
+  mask: "date",
+  placeholder: "yyyy-mm-dd",
 };
 
 export const TimeMask = Template.bind({});
 TimeMask.args = {
-  mask: 'time',
-  placeholder: 'hh:mm:ss',
+  mask: "time",
+  placeholder: "hh:mm:ss",
 };
 
 export const CreditCard = Template.bind({});
 CreditCard.args = {
-  mask: 'credit-card', //4555 5666 6666 6634
+  mask: "credit-card", //4555 5666 6666 6634
 };
 
 export const CanadianZipCodeMask = Template.bind({});
 CanadianZipCodeMask.args = {
-  mask: 'zip-code-canada', // M5M 4M4
+  mask: "zip-code-canada", // M5M 4M4
 };
 
 export const DynamicMask = Template.bind({});
 DynamicMask.args = {
-  mask: ['###.###.###-##', '##.###.###/####-##'],
+  mask: ["###.###.###-##", "##.###.###/####-##"],
 };
 
 export const CustomMask = Template.bind({});
 CustomMask.args = {
-  mask: (value) => (value.startsWith('1') ? '#-#' : '##-##'),
+  mask: (value) => (value.startsWith("1") ? "#-#" : "##-##"),
 };
 
 const CustomClassesT = (args) => ({
@@ -165,8 +165,8 @@ export const CustomClasses = CustomClassesT.bind({});
 
 export const Field = createFieldStory({
   component: BaseInput,
-  componentName: 'BaseInput',
-  label: 'Name',
+  componentName: "BaseInput",
+  label: "Name",
 });
 
 const TemplateSizes = (args) => ({
@@ -199,4 +199,4 @@ const FocusTemplate = (args) => ({
   `,
 });
 
-export const Focus = FocusTemplate.bind({});
+export const Focus = FocusTemplate.bind({});

package/src/components/BaseInputLabel.stories.js

@@ -1,13 +1,13 @@
-import BaseInputLabel from './BaseInputLabel.vue';
-import BaseInput from './BaseInput.vue';
+import BaseInputLabel from "./BaseInputLabel.vue";
+import BaseInput from "./BaseInput.vue";
 
 export default {
-  title: 'Form/BaseInputLabel',
+  title: "Form/BaseInputLabel",
   component: BaseInputLabel,
   args: {
     required: true,
-    label: 'First Name',
-    class: 'text-slate-600 block text-sm',
+    label: "First Name",
+    class: "text-slate-600 block text-sm",
   },
 };
 
@@ -32,5 +32,5 @@ Demo.args = {};
 
 export const Help = Template.bind({});
 Help.args = {
-  help: 'Enter your first name here',
+  help: "Enter your first name here",
 };

package/src/components/BaseInputPercent.stories.js

@@ -1,12 +1,12 @@
-import BaseInputPercent from './BaseInputPercent.vue';
-import ShowValue from '../../.storybook/components/ShowValue.vue';
-import { createFieldStory } from '@/../.storybook/utils';
+import BaseInputPercent from "./BaseInputPercent.vue";
+import ShowValue from "../../.storybook/components/ShowValue.vue";
+import { createFieldStory } from "@/../.storybook/utils";
 
 export default {
-  title: 'Form/BaseInputPercent',
+  title: "Form/BaseInputPercent",
   component: BaseInputPercent,
   args: {
-    placeholder: 'Enter rebate, eg: 50%',
+    placeholder: "Enter rebate, eg: 50%",
     step: null,
     min: 0,
     max: 100,
@@ -45,8 +45,8 @@ Error.args = {
 
 export const Field = createFieldStory({
   component: BaseInputPercent,
-  componentName: 'BaseInputPercent',
-  label: 'Rebate',
+  componentName: "BaseInputPercent",
+  label: "Rebate",
 });
 
 const FocusTemplate = (args) => ({
@@ -63,4 +63,4 @@ const FocusTemplate = (args) => ({
   `,
 });
 
-export const Focus = FocusTemplate.bind({});
+export const Focus = FocusTemplate.bind({});

package/src/components/BaseJsonReader.stories.js

@@ -1,15 +1,15 @@
-import { sizes } from '../../.storybook/utils';
-import BaseJsonReader from './BaseJsonReader.vue';
-import ShowValue from '@/../.storybook/components/ShowValue.vue';
+import { sizes } from "../../.storybook/utils";
+import BaseJsonReader from "./BaseJsonReader.vue";
+import ShowValue from "@/../.storybook/components/ShowValue.vue";
 
 export default {
-  title: 'Components/BaseJsonReader',
+  title: "Components/BaseJsonReader",
   component: BaseJsonReader,
   argTypes: {
     size: {
-      control: { type: 'select' },
+      control: { type: "select" },
       options: sizes,
-    }
+    },
   },
 };
 
@@ -17,14 +17,10 @@ const Template = (args) => ({
   components: { BaseJsonReader, ShowValue },
   setup() {
     const object = {
-      "user": {
-        "name": "John Doe",
-        "email": "john@witify.io",
-        "permissions": [
-          "read",
-          "create",
-          "delete"
-        ],
+      user: {
+        name: "John Doe",
+        email: "john@witify.io",
+        permissions: ["read", "create", "delete"],
         comments: [
           {
             comment: "First comment",
@@ -41,14 +37,14 @@ const Template = (args) => ({
                       {
                         comment: {
                           name: "sub-sub-sub-comment 2",
-                          desc: "test desc"
-                        }
+                          desc: "test desc",
+                        },
                       },
                       {
                         comment: {
                           name: "sub-sub-sub-comment 3",
-                          desc: "test desc2"
-                        }
+                          desc: "test desc2",
+                        },
                       },
                     ],
                   },
@@ -73,40 +69,37 @@ const Template = (args) => ({
             ],
           },
         ],
-        "category": {
-          "id": 1,
-          "name": "Other"
+        category: {
+          id: 1,
+          name: "Other",
         },
-        "tags": {
-          "id": [
-            "create",
-            "delete"
-          ],
-          "name": {
-            "id": {
-              "read": {
-                "id": {
-                  "create": {
-                    "id": {
-                      "delete": {
-                        "id": {
-                          "update": {
-                            "id": {
-                              "name": "Read"
-                            }
-                          }
-                        }
-                      }
-                    }
-                  }
-                }
-              }
+        tags: {
+          id: ["create", "delete"],
+          name: {
+            id: {
+              read: {
+                id: {
+                  create: {
+                    id: {
+                      delete: {
+                        id: {
+                          update: {
+                            id: {
+                              name: "Read",
+                            },
+                          },
+                        },
+                      },
+                    },
+                  },
+                },
+              },
             },
-            "name": "Read"
+            name: "Read",
           },
-        }
+        },
       },
-      "foo": "bar",
+      foo: "bar",
     };
 
     const value = ref(object);
@@ -123,5 +116,5 @@ export const Demo = Template.bind({});
 
 export const VariantCollapse = Template.bind({});
 VariantCollapse.args = {
-  variant: 'collapse',
+  variant: "collapse",
 };

package/src/components/BaseJsonReader.vue

@@ -18,7 +18,6 @@
 <script lang="ts" setup>
 import { Size, sizes } from '@/utils/sizes';
 import { twMerge } from 'tailwind-merge';
-import { defineProps } from 'vue';
 import BaseJsonReaderItem from './BaseJsonReaderItem.vue';
 import { JsonData } from '@/types';
 

package/src/components/BaseLayoutSidebar.vue

@@ -216,7 +216,7 @@ const props = defineProps({
     type: String,
   },
   logoUrl: {
-    default: 'https://sprintify.witify.io/img/logo/logo-side-dark.svg',
+    default: 'https://demo.sprintify.app/img/logo/logo-side-dark.svg',
     type: String,
   },
   logoTo: {