sprintify-ui 0.10.63 → 0.10.65

package/src/stories/List.stories.js

@@ -1,136 +1,136 @@
-import BaseHeader from "../components/BaseHeader.vue";
-import BaseTabs from "../components/BaseTabs.vue";
-import BaseTabItem from "../components/BaseTabItem.vue";
-import BaseDataTable from "../components/BaseDataTable.vue";
-import BaseTableColumn from "../components/BaseTableColumn.vue";
-import BaseBoolean from "../components/BaseBoolean.vue";
-import BaseSelect from "../components/BaseSelect.vue";
-import BaseBadge from "../components/BaseBadge.vue";
-import BaseCounter from "../components/BaseCounter.vue";
-import BaseAppSnackbars from "../components/BaseAppSnackbars.vue";
-import BaseAppDialogs from "../components/BaseAppDialogs.vue";
-import BaseContainer from "../components/BaseContainer.vue";
-import { DateTime } from "luxon";
-import { templateDataTable } from "../../.storybook/utils";
-
-export default {
-  title: "Pages/List",
-  component: BaseDataTable,
-  parameters: {
-    layout: "fullscreen",
-  },
-  argTypes: {
-    layout: {
-      control: { type: "select" },
-      options: ["default", "compact"],
-    },
-    size: {
-      control: { type: "select" },
-      options: ["sm", "md"],
-    },
-  },
-  args: {
-    url: "https://effettandem.com/api/content/articles",
-    urlQuery: {
-      per_page: 10,
-    },
-    historyMode: false,
-    detailed: true,
-    searchable: true,
-    checkable: true,
-    layout: "compact",
-    size: "sm",
-    showUrl() {
-      return "/";
-    },
-    editUrl() {
-      return "/";
-    },
-    deleteUrl() {
-      return "/";
-    },
-    actions: [
-      {
-        label: "Export",
-        icon: "heroicons:arrow-down-tray",
-        action: () => alert("export!"),
-      },
-      { meta: { line: true } },
-      {
-        label: "Delete all",
-        icon: "heroicons:trash",
-        action: () => alert("Delete All!"),
-        color: "danger",
-      },
-    ],
-    checkableActions: [
-      {
-        label: "Delete all",
-        action: () => {
-          alert("delete!");
-        },
-      },
-    ],
-  },
-};
-
-const templateComponents = {
-  BaseHeader,
-  BaseTabs,
-  BaseTabItem,
-  BaseDataTable,
-  BaseTableColumn,
-  BaseBoolean,
-  BaseSelect,
-  BaseBadge,
-  BaseAppSnackbars,
-  BaseAppDialogs,
-  BaseCounter,
-  BaseContainer,
-};
-
-const template = `
-<div class="bg-slate-100 py-6">
-<BaseContainer>
-    <BaseHeader
-        title="Articles"
-        :actions="[
-            {label: 'New article', icon: 'heroicons:plus', action: () => alert('new article!'), color: 'primary'},
-            {label: 'Export', icon: 'heroicons:arrow-down-tray', action: () => alert('export!')},
-            {label: 'Import', icon: 'heroicons:arrow-up-tray', action: () => alert('import!')},
-        ]"
-        :breadcrumbs="[{label: 'Home', to: '/'}, {label: 'Articles', to: '/articles'}]"
-        class="mb-1"
-    ></BaseHeader>
-
-    <BaseTabs class="mb-4" size="sm">
-        <BaseTabItem to="/">All</BaseTabItem>
-        <BaseTabItem to="/settings">Videos <BaseCounter :count="4"></BaseCounter></BaseTabItem>
-        <BaseTabItem to="/setup">Articles</BaseTabItem>
-    </BaseTabs>
-
-    ${templateDataTable}
-
-    <BaseAppSnackbars></BaseAppSnackbars>
-    <BaseAppDialogs></BaseAppDialogs>
-</BaseContainer>
-</div>
-`;
-
-const Template = (args) => ({
-  components: templateComponents,
-  template: template,
-  setup() {
-    function onCellClick(row) {
-      alert("Cell click: " + row.id);
-    }
-
-    function onRowClick(row) {
-      alert("Row click: " + row.id);
-    }
-
-    return { args, onCellClick, onRowClick, DateTime };
-  },
-});
-
-export const Demo = Template.bind({});
+import BaseHeader from "../components/BaseHeader.vue";
+import BaseTabs from "../components/BaseTabs.vue";
+import BaseTabItem from "../components/BaseTabItem.vue";
+import BaseDataTable from "../components/BaseDataTable.vue";
+import BaseTableColumn from "../components/BaseTableColumn.vue";
+import BaseBoolean from "../components/BaseBoolean.vue";
+import BaseSelect from "../components/BaseSelect.vue";
+import BaseBadge from "../components/BaseBadge.vue";
+import BaseCounter from "../components/BaseCounter.vue";
+import BaseAppSnackbars from "../components/BaseAppSnackbars.vue";
+import BaseAppDialogs from "../components/BaseAppDialogs.vue";
+import BaseContainer from "../components/BaseContainer.vue";
+import { DateTime } from "luxon";
+import { templateDataTable } from "../../.storybook/utils";
+
+export default {
+  title: "Pages/List",
+  component: BaseDataTable,
+  parameters: {
+    layout: "fullscreen",
+  },
+  argTypes: {
+    layout: {
+      control: { type: "select" },
+      options: ["default", "compact"],
+    },
+    size: {
+      control: { type: "select" },
+      options: ["sm", "md"],
+    },
+  },
+  args: {
+    url: "https://effettandem.com/api/content/articles",
+    urlQuery: {
+      per_page: 10,
+    },
+    historyMode: false,
+    detailed: true,
+    searchable: true,
+    checkable: true,
+    layout: "compact",
+    size: "sm",
+    showUrl() {
+      return "/";
+    },
+    editUrl() {
+      return "/";
+    },
+    deleteUrl() {
+      return "/";
+    },
+    actions: [
+      {
+        label: "Export",
+        icon: "heroicons:arrow-down-tray",
+        action: () => alert("export!"),
+      },
+      { meta: { line: true } },
+      {
+        label: "Delete all",
+        icon: "heroicons:trash",
+        action: () => alert("Delete All!"),
+        color: "danger",
+      },
+    ],
+    checkableActions: [
+      {
+        label: "Delete all",
+        action: () => {
+          alert("delete!");
+        },
+      },
+    ],
+  },
+};
+
+const templateComponents = {
+  BaseHeader,
+  BaseTabs,
+  BaseTabItem,
+  BaseDataTable,
+  BaseTableColumn,
+  BaseBoolean,
+  BaseSelect,
+  BaseBadge,
+  BaseAppSnackbars,
+  BaseAppDialogs,
+  BaseCounter,
+  BaseContainer,
+};
+
+const template = `
+<div class="bg-slate-100 py-6">
+<BaseContainer>
+    <BaseHeader
+        title="Articles"
+        :actions="[
+            {label: 'New article', icon: 'heroicons:plus', action: () => alert('new article!'), color: 'primary'},
+            {label: 'Export', icon: 'heroicons:arrow-down-tray', action: () => alert('export!')},
+            {label: 'Import', icon: 'heroicons:arrow-up-tray', action: () => alert('import!')},
+        ]"
+        :breadcrumbs="[{label: 'Home', to: '/'}, {label: 'Articles', to: '/articles'}]"
+        class="mb-1"
+    ></BaseHeader>
+
+    <BaseTabs class="mb-4" size="sm">
+        <BaseTabItem to="/">All</BaseTabItem>
+        <BaseTabItem to="/settings">Videos <BaseCounter :count="4"></BaseCounter></BaseTabItem>
+        <BaseTabItem to="/setup">Articles</BaseTabItem>
+    </BaseTabs>
+
+    ${templateDataTable}
+
+    <BaseAppSnackbars></BaseAppSnackbars>
+    <BaseAppDialogs></BaseAppDialogs>
+</BaseContainer>
+</div>
+`;
+
+const Template = (args) => ({
+  components: templateComponents,
+  template: template,
+  setup() {
+    function onCellClick(row) {
+      alert("Cell click: " + row.id);
+    }
+
+    function onRowClick(row) {
+      alert("Row click: " + row.id);
+    }
+
+    return { args, onCellClick, onRowClick, DateTime };
+  },
+});
+
+export const Demo = Template.bind({});