classcard-ui 0.2.1475 → 0.2.1476

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/CAlertModal.stories.js

@@ -1,30 +1,30 @@
-import CAlertModal from "../components/CAlertModal/CAlertModal.vue";
-import "./utils.css";
-
-export default {
-  title: "CAlertModal",
-  component: CAlertModal,
-  argTypes: {
-    proceedAddingEvent: Function,
-    title: String,
-    iconColor: String,
-    msg: String,
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { CAlertModal },
-  template: '<c-alert-modal v-bind="$props" />',
-});
-
-function test() {
-  console.log("test");
-}
-export const Default = Template.bind({});
-Default.args = {
-  proceedAddingEvent: test,
-  primaryButtonLoader: false,
-  primaryButtonText: "Yes",
-  secondaryButtonText: "No",
-};
+import CAlertModal from "../components/CAlertModal/CAlertModal.vue";
+import "./utils.css";
+
+export default {
+  title: "CAlertModal",
+  component: CAlertModal,
+  argTypes: {
+    proceedAddingEvent: Function,
+    title: String,
+    iconColor: String,
+    msg: String,
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { CAlertModal },
+  template: '<c-alert-modal v-bind="$props" />',
+});
+
+function test() {
+  console.log("test");
+}
+export const Default = Template.bind({});
+Default.args = {
+  proceedAddingEvent: test,
+  primaryButtonLoader: false,
+  primaryButtonText: "Yes",
+  secondaryButtonText: "No",
+};

package/src/stories/CAlerts.stories.js

@@ -1,39 +1,39 @@
-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']}},
-    id: String,
-  },
-};
-
-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'
-    },
-    id: 'c-alert',
-};
+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']}},
+    id: String,
+  },
+};
+
+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'
+    },
+    id: 'c-alert',
+};

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,38 +1,38 @@
-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,
-    disabled: { control: { type: "boolean" } },
-  },
-};
-
-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,
-  disabled: false,
-};
+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,
+    disabled: { control: { type: "boolean" } },
+  },
+};
+
+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,
+  disabled: false,
+};

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: ["extraextraextrasmall", "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: ["extraextraextrasmall", "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,136 +1,136 @@
-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",
-      firstName: "Ava",
-      surname: "Smith",
-      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'
-    },
-    {
-      batch_id: 56,
-      initials: "E",
-      firstName: "Eva",
-      surname: null,
-      image: null
-    },
-    {
-      batch_id: 88,
-      initials: "I",
-      firstName: "Ivan",
-      surname: null,
-      image_240: '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'
-    },
-    {
-      batch_id: 77,
-      initials: "PL",
-      firstName: "Paul",
-      surname: "Lopez",
-      image_240: null
-    },
-    {
-      batch_id: 22,
-      initials: "AS",
-      firstName: "Ava",
-      surname: "Smith",
-      image: null
-    },
-    {
-      batch_id: 56,
-      initials: "ER",
-      firstName: "Eva",
-      surname: "Ramos",
-      image: null
-    },
-    {
-      batch_id: 88,
-      initials: "IO",
-      firstName: "Ivan",
-      surname: "Oliveira",
-      image_240: null
-    },
-    {
-      batch_id: 77,
-      initials: "PL",
-      firstName: "Paul",
-      surname: "Lopez",
-      image: null
-    },
-    {
-      batch_id: 22,
-      initials: "AS",
-      firstName: "Ava",
-      surname: "Smith",
-      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'
-    },
-    {
-      batch_id: 56,
-      initials: "E",
-      firstName: "Eva",
-      surname: null,
-      image_240: null
-    },
-    {
-      batch_id: 88,
-      initials: "I",
-      firstName: "Ivan",
-      surname: null,
-      image: null
-    },
-    {
-      batch_id: 77,
-      initials: "PL",
-      firstName: "Paul",
-      surname: "Lopez",
-      image_240: null
-    },
-  ],
-};
+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",
+      firstName: "Ava",
+      surname: "Smith",
+      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'
+    },
+    {
+      batch_id: 56,
+      initials: "E",
+      firstName: "Eva",
+      surname: null,
+      image: null
+    },
+    {
+      batch_id: 88,
+      initials: "I",
+      firstName: "Ivan",
+      surname: null,
+      image_240: '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'
+    },
+    {
+      batch_id: 77,
+      initials: "PL",
+      firstName: "Paul",
+      surname: "Lopez",
+      image_240: null
+    },
+    {
+      batch_id: 22,
+      initials: "AS",
+      firstName: "Ava",
+      surname: "Smith",
+      image: null
+    },
+    {
+      batch_id: 56,
+      initials: "ER",
+      firstName: "Eva",
+      surname: "Ramos",
+      image: null
+    },
+    {
+      batch_id: 88,
+      initials: "IO",
+      firstName: "Ivan",
+      surname: "Oliveira",
+      image_240: null
+    },
+    {
+      batch_id: 77,
+      initials: "PL",
+      firstName: "Paul",
+      surname: "Lopez",
+      image: null
+    },
+    {
+      batch_id: 22,
+      initials: "AS",
+      firstName: "Ava",
+      surname: "Smith",
+      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'
+    },
+    {
+      batch_id: 56,
+      initials: "E",
+      firstName: "Eva",
+      surname: null,
+      image_240: null
+    },
+    {
+      batch_id: 88,
+      initials: "I",
+      firstName: "Ivan",
+      surname: null,
+      image: null
+    },
+    {
+      batch_id: 77,
+      initials: "PL",
+      firstName: "Paul",
+      surname: "Lopez",
+      image_240: null
+    },
+  ],
+};