classcard-ui 0.2.705 → 0.2.708

package/src/main.js

@@ -1,22 +1,22 @@
-import * as components from "./components";
-import VScrollLock from "v-scroll-lock";
-import { FocusTrap } from "focus-trap-vue";
-
-const ClasscardUI = {
-  install(Vue) {
-    // components
-    for (const componentName in components) {
-      const component = components[componentName];
-
-      Vue.component(component.name, component);
-    }
-    Vue.component("FocusTrap", FocusTrap);
-    Vue.use(VScrollLock);
-  },
-};
-
-export default ClasscardUI;
-
-if (typeof window !== "undefined" && window.Vue) {
-  window.Vue.use(ClasscardUI);
-}
+import * as components from "./components";
+import VScrollLock from "v-scroll-lock";
+import { FocusTrap } from "focus-trap-vue";
+
+const ClasscardUI = {
+  install(Vue) {
+    // components
+    for (const componentName in components) {
+      const component = components[componentName];
+
+      Vue.component(component.name, component);
+    }
+    Vue.component("FocusTrap", FocusTrap);
+    Vue.use(VScrollLock);
+  },
+};
+
+export default ClasscardUI;
+
+if (typeof window !== "undefined" && window.Vue) {
+  window.Vue.use(ClasscardUI);
+}

package/src/stories/CAlerts.stories.js

@@ -1,37 +1,37 @@
-import CAlerts from "../components/CAlerts/CAlerts.vue";
-import "./utils.css";
-
-export default {
-  title: "CAlerts",
-  component: CAlerts,
-  argTypes: {
-    label: String,
-    color: { control: { type: 'select', options: ['gray', 'red', 'yellow', 'green', 'indigo', 'purple', 'pink'] } },
-    description:String,
-    linkLabel: String,
-    icon: { control: { type: "object" } },
-    actions: { control: { type: "object" } },
-    type: {control: { type: 'select', options: ['withActions', 'withAccentBorder']}}
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { CAlerts },
-  template: '<c-alerts v-bind="$props" />',
-});
-
-export const Default = Template.bind({});
-Default.args = {
-  label: "Private note for Alkama RTC",
-  icon: {
-    name: "exclamation-circle",
-    type: "solid"
-  },
-    color:'yellow',
-    description: 'Nut allergy',
-    type: 'withActions',
-    actions:{
-      label: 'Update'
-    },
-};
+import CAlerts from "../components/CAlerts/CAlerts.vue";
+import "./utils.css";
+
+export default {
+  title: "CAlerts",
+  component: CAlerts,
+  argTypes: {
+    label: String,
+    color: { control: { type: 'select', options: ['gray', 'red', 'yellow', 'green', 'indigo', 'purple', 'pink'] } },
+    description:String,
+    linkLabel: String,
+    icon: { control: { type: "object" } },
+    actions: { control: { type: "object" } },
+    type: {control: { type: 'select', options: ['withActions', 'withAccentBorder']}}
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { CAlerts },
+  template: '<c-alerts v-bind="$props" />',
+});
+
+export const Default = Template.bind({});
+Default.args = {
+  label: "Private note for Alkama RTC",
+  icon: {
+    name: "exclamation-circle",
+    type: "solid"
+  },
+    color:'yellow',
+    description: 'Nut allergy',
+    type: 'withActions',
+    actions:{
+      label: 'Update'
+    },
+};

package/src/stories/CAnchorTabs.stories.js

@@ -1,29 +1,29 @@
-import CAnchorTabs from "../components/CAnchorTabs/CAnchorTabs.vue";
-import CIcon from "../components/CIcon/CIcon.vue";
-import "./utils.css";
-
-export default {
-  title: "CAnchorTabs",
-  component: CAnchorTabs,
-  subcomponents: { CIcon },
-  argTypes: {
-    tabs: { control: { type: "object" } },
-    initialTab: String,
-    classes: String,
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { CAnchorTabs },
-  template: '<c-anchor-tabs v-bind="$props" />',
-});
-
-export const Default = Template.bind({});
-Default.args = {
-  tabs: [
-    { icon: "bookmark", text: "Accounts", name:"accounts" },
-    { icon: "bell", text: "Team Members", name:"members" },
-  ],
-  initialTab: "accounts",
-};
+import CAnchorTabs from "../components/CAnchorTabs/CAnchorTabs.vue";
+import CIcon from "../components/CIcon/CIcon.vue";
+import "./utils.css";
+
+export default {
+  title: "CAnchorTabs",
+  component: CAnchorTabs,
+  subcomponents: { CIcon },
+  argTypes: {
+    tabs: { control: { type: "object" } },
+    initialTab: String,
+    classes: String,
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { CAnchorTabs },
+  template: '<c-anchor-tabs v-bind="$props" />',
+});
+
+export const Default = Template.bind({});
+Default.args = {
+  tabs: [
+    { icon: "bookmark", text: "Accounts", name:"accounts" },
+    { icon: "bell", text: "Team Members", name:"members" },
+  ],
+  initialTab: "accounts",
+};

package/src/stories/CAnchorTag.stories.js

@@ -1,36 +1,36 @@
-import CAnchorTag from "../components/CAnchorTag/CAnchorTag.vue";
-import "./utils.css";
-
-export default {
-  title: "CAnchorTag",
-  component: CAnchorTag,
-  argTypes: {
-    label: String,
-    href: String,
-    icon: { control: { type: "object" } },
-    color: { control: { type: "select", options: ["blue", "red"] } },
-    action: Function
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { CAnchorTag },
-  template: '<c-anchor-tag v-bind="$props" />',
-});
-
-const clickAction = () => {
-  console.log("link clicked")
-}
-
-export const Default = Template.bind({});
-Default.args = {
-  href: "#",
-  label: "Add item",
-  icon: {
-    name: "download",
-    type: "outline",
-  },
-  color: "blue",
-  action: clickAction
-};
+import CAnchorTag from "../components/CAnchorTag/CAnchorTag.vue";
+import "./utils.css";
+
+export default {
+  title: "CAnchorTag",
+  component: CAnchorTag,
+  argTypes: {
+    label: String,
+    href: String,
+    icon: { control: { type: "object" } },
+    color: { control: { type: "select", options: ["blue", "red"] } },
+    action: Function
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { CAnchorTag },
+  template: '<c-anchor-tag v-bind="$props" />',
+});
+
+const clickAction = () => {
+  console.log("link clicked")
+}
+
+export const Default = Template.bind({});
+Default.args = {
+  href: "#",
+  label: "Add item",
+  icon: {
+    name: "download",
+    type: "outline",
+  },
+  color: "blue",
+  action: clickAction
+};

package/src/stories/CAvatar.stories.js

@@ -1,38 +1,38 @@
-import CAvatar from "../components/CAvatar/CAvatar.vue";
-import "./utils.css";
-
-export default {
-  title: "CAvatar",
-  component: CAvatar,
-  argTypes: {
-    size: {
-      control: {
-        type: "select",
-        options: ["extraextrasmall", "extrasmall", "small", "medium", "large", "very large"],
-      },
-    },
-    image: String,
-    rounded: Boolean,
-    name: String,
-    description: String,
-    nameInitials: String,
-    imageClasses: String,
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { CAvatar },
-  template: '<c-avatar v-bind="$props" />',
-});
-
-export const Default = Template.bind({});
-Default.args = {
-  size: "medium",
-  rounded: true,
-  image:
-    "https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80",
-  name: "Alkama",
-  // nameInitials: "SA",
-  imageClasses: "object-contain",
-};
+import CAvatar from "../components/CAvatar/CAvatar.vue";
+import "./utils.css";
+
+export default {
+  title: "CAvatar",
+  component: CAvatar,
+  argTypes: {
+    size: {
+      control: {
+        type: "select",
+        options: ["extraextrasmall", "extrasmall", "small", "medium", "large", "very large"],
+      },
+    },
+    image: String,
+    rounded: Boolean,
+    name: String,
+    description: String,
+    nameInitials: String,
+    imageClasses: String,
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { CAvatar },
+  template: '<c-avatar v-bind="$props" />',
+});
+
+export const Default = Template.bind({});
+Default.args = {
+  size: "medium",
+  rounded: true,
+  image:
+    "https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80",
+  name: "Alkama",
+  // nameInitials: "SA",
+  imageClasses: "object-contain",
+};

package/src/stories/CAvatarGroup.stories.js

@@ -1,100 +1,100 @@
-import CAvatarGroup from "../components/CAvatarGroup/CAvatarGroup.vue";
-import "./utils.css";
-
-export default {
-  title: "CAvatarGroup",
-  component: CAvatarGroup,
-  argTypes: {
-    size: {
-      control: {
-        type: "select",
-        options: ["extrasmall", "small", "medium", "large", "very large"],
-      },
-    },
-    images: String,
-    rounded: Boolean,
-    name: String,
-    description: String,
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { CAvatarGroup },
-  template: '<c-avatar-group v-bind="$props" />',
-});
-
-export const Default = Template.bind({});
-Default.args = {
-  size: "medium",
-  rounded: true,
-  name: "+10",
-  // images: [
-  //   {
-  //     image:
-  //       "https://images.unsplash.com/photo-1491528323818-fdd1faba62cc?ixlib=rb-1.2.1&ixqx=ukDMP4XEnx&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80",
-  //   },
-  //   {
-  //     image:
-  //       "https://images.unsplash.com/photo-1550525811-e5869dd03032?ixlib=rb-1.2.1&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80",
-  //   },
-  //   {
-  //     image:
-  //       "https://images.unsplash.com/photo-1500648767791-00dcc994a43e?ixlib=rb-1.2.1&ixqx=ukDMP4XEnx&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2.25&w=256&h=256&q=80",
-  //   },
-  //   {
-  //     image:
-  //       "https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?ixlib=rb-1.2.1&ixqx=ukDMP4XEnx&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80",
-  //   },
-  // ],
-  nameInitials: [
-    {
-      batch_id: 22,
-      initials: "AS",
-    },
-    {
-      batch_id: 56,
-      initials: "ER",
-    },
-    {
-      batch_id: 88,
-      initials: "IO",
-    },
-    {
-      batch_id: 77,
-      initials: "PL",
-    },
-    {
-      batch_id: 22,
-      initials: "AS",
-    },
-    {
-      batch_id: 56,
-      initials: "ER",
-    },
-    {
-      batch_id: 88,
-      initials: "IO",
-    },
-    {
-      batch_id: 77,
-      initials: "PL",
-    },
-    {
-      batch_id: 22,
-      initials: "AS",
-    },
-    {
-      batch_id: 56,
-      initials: "ER",
-    },
-    {
-      batch_id: 88,
-      initials: "IO",
-    },
-    {
-      batch_id: 77,
-      initials: "PL",
-    },
-  ],
-};
+import CAvatarGroup from "../components/CAvatarGroup/CAvatarGroup.vue";
+import "./utils.css";
+
+export default {
+  title: "CAvatarGroup",
+  component: CAvatarGroup,
+  argTypes: {
+    size: {
+      control: {
+        type: "select",
+        options: ["extrasmall", "small", "medium", "large", "very large"],
+      },
+    },
+    images: String,
+    rounded: Boolean,
+    name: String,
+    description: String,
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { CAvatarGroup },
+  template: '<c-avatar-group v-bind="$props" />',
+});
+
+export const Default = Template.bind({});
+Default.args = {
+  size: "medium",
+  rounded: true,
+  name: "+10",
+  // images: [
+  //   {
+  //     image:
+  //       "https://images.unsplash.com/photo-1491528323818-fdd1faba62cc?ixlib=rb-1.2.1&ixqx=ukDMP4XEnx&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80",
+  //   },
+  //   {
+  //     image:
+  //       "https://images.unsplash.com/photo-1550525811-e5869dd03032?ixlib=rb-1.2.1&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80",
+  //   },
+  //   {
+  //     image:
+  //       "https://images.unsplash.com/photo-1500648767791-00dcc994a43e?ixlib=rb-1.2.1&ixqx=ukDMP4XEnx&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2.25&w=256&h=256&q=80",
+  //   },
+  //   {
+  //     image:
+  //       "https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?ixlib=rb-1.2.1&ixqx=ukDMP4XEnx&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80",
+  //   },
+  // ],
+  nameInitials: [
+    {
+      batch_id: 22,
+      initials: "AS",
+    },
+    {
+      batch_id: 56,
+      initials: "ER",
+    },
+    {
+      batch_id: 88,
+      initials: "IO",
+    },
+    {
+      batch_id: 77,
+      initials: "PL",
+    },
+    {
+      batch_id: 22,
+      initials: "AS",
+    },
+    {
+      batch_id: 56,
+      initials: "ER",
+    },
+    {
+      batch_id: 88,
+      initials: "IO",
+    },
+    {
+      batch_id: 77,
+      initials: "PL",
+    },
+    {
+      batch_id: 22,
+      initials: "AS",
+    },
+    {
+      batch_id: 56,
+      initials: "ER",
+    },
+    {
+      batch_id: 88,
+      initials: "IO",
+    },
+    {
+      batch_id: 77,
+      initials: "PL",
+    },
+  ],
+};