classcard-ui 0.2.989 → 0.2.991

package/src/stories/CCheckbox.stories.js

@@ -1,29 +1,29 @@
-import CCheckbox from "../components/CCheckbox/CCheckbox.vue";
-import "./utils.css";
-
-export default {
-  title: "CCheckbox",
-  component: CCheckbox,
-  argTypes: {
-    label: String,
-    description: String,
-    value: Number,
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { CCheckbox },
-  template: '<c-checkbox @onChange="onChange" v-bind="$props" />',
-});
-
-export const Default = Template.bind({});
-Default.args = {
-  label: "Includes",
-  description: "Add subjects to include them in the package",
-  value: 1,
-  isDisabled: false,
-  onChange() {
-    return;
-  },
-};
+import CCheckbox from "../components/CCheckbox/CCheckbox.vue";
+import "./utils.css";
+
+export default {
+  title: "CCheckbox",
+  component: CCheckbox,
+  argTypes: {
+    label: String,
+    description: String,
+    value: Number,
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { CCheckbox },
+  template: '<c-checkbox @onChange="onChange" v-bind="$props" />',
+});
+
+export const Default = Template.bind({});
+Default.args = {
+  label: "Includes",
+  description: "Add subjects to include them in the package",
+  value: 1,
+  isDisabled: false,
+  onChange() {
+    return;
+  },
+};

package/src/stories/CCircularButton.stories.js

@@ -1,29 +1,29 @@
-import CCircularButton from "../components/CCircularButton/CCircularButton.vue";
-import "./utils.css";
-
-export default {
-  title: "CCircularButton",
-  component: CCircularButton,
-  argTypes: {
-    type: String,
-    icon: Object,
-    disabled: Boolean,
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { CCircularButton },
-  template: '<c-circular-button v-bind="$props" />',
-});
-
-export const Default = Template.bind({});
-Default.args = {
-  type: "black",
-  icon: {
-    name: "minus-solid",
-    type: "solid",
-    viewBox: "0 0 24 24",
-    class: "h-5 w-5",
-  },
-};
+import CCircularButton from "../components/CCircularButton/CCircularButton.vue";
+import "./utils.css";
+
+export default {
+  title: "CCircularButton",
+  component: CCircularButton,
+  argTypes: {
+    type: String,
+    icon: Object,
+    disabled: Boolean,
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { CCircularButton },
+  template: '<c-circular-button v-bind="$props" />',
+});
+
+export const Default = Template.bind({});
+Default.args = {
+  type: "black",
+  icon: {
+    name: "minus-solid",
+    type: "solid",
+    viewBox: "0 0 24 24",
+    class: "h-5 w-5",
+  },
+};

package/src/stories/CCollapsibleSection.stories.js

@@ -1,28 +1,28 @@
-import CCollapsibleSection from '../components/CCollapsibleSection/CCollapsibleSection.vue';
-import './utils.css'
-
-export default {
-  title: 'CCollapsibleSection',
-  component: CCollapsibleSection,
-  argTypes: {
-    label: String,
-    tabAction:Boolean,
-    buttonLabel:String,
-    tabLink: { control: { type: "object" } }
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { CCollapsibleSection },
-  template: '<c-collapsible-section v-bind="$props" />',
-});
-
-export const Default = Template.bind({});
-Default.args = {
-  label: 'Details',
-  tabAction: false,
-  tabLink: {
-    label: 'Edit'
-  }
-};
+import CCollapsibleSection from '../components/CCollapsibleSection/CCollapsibleSection.vue';
+import './utils.css'
+
+export default {
+  title: 'CCollapsibleSection',
+  component: CCollapsibleSection,
+  argTypes: {
+    label: String,
+    tabAction:Boolean,
+    buttonLabel:String,
+    tabLink: { control: { type: "object" } }
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { CCollapsibleSection },
+  template: '<c-collapsible-section v-bind="$props" />',
+});
+
+export const Default = Template.bind({});
+Default.args = {
+  label: 'Details',
+  tabAction: false,
+  tabLink: {
+    label: 'Edit'
+  }
+};

package/src/stories/CColorDots.stories.js

@@ -1,28 +1,28 @@
-import CColorDots from "../components/CColorDots/CColorDots.vue";
-import "./utils.css";
-
-export default {
-  title: "CColorDots",
-  component: CColorDots,
-  argTypes: {
-    label: String,
-    color: {
-      control: {
-        type: "select",
-        options: ["gray", "red", "yellow", "green", "indigo", "purple", "pink"],
-      },
-    },
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { CColorDots },
-  template: '<c-color-dots v-bind="$props" />',
-});
-
-export const Default = Template.bind({});
-Default.args = {
-  label: "Active",
-  color: "green",
-};
+import CColorDots from "../components/CColorDots/CColorDots.vue";
+import "./utils.css";
+
+export default {
+  title: "CColorDots",
+  component: CColorDots,
+  argTypes: {
+    label: String,
+    color: {
+      control: {
+        type: "select",
+        options: ["gray", "red", "yellow", "green", "indigo", "purple", "pink"],
+      },
+    },
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { CColorDots },
+  template: '<c-color-dots v-bind="$props" />',
+});
+
+export const Default = Template.bind({});
+Default.args = {
+  label: "Active",
+  color: "green",
+};

package/src/stories/CConfirmActionModal.stories.js

@@ -1,59 +1,59 @@
-import { CConfirmActionModal, CButton } from "../components";
-import "./utils.css";
-
-export default {
-  title: "CConfirmActionModal",
-  component: CConfirmActionModal,
-  subcomponents: { CButton },
-  argTypes: {
-    actionOneType: {
-      control: {
-        type: "select",
-        options: [
-          "primary",
-          "secondary",
-          "white",
-          "danger",
-          "success",
-          "tertiary",
-          "secondary-gray",
-          "light-red",
-          "dark-blue",
-        ],
-      },
-    },
-    actionTwoType: {
-      control: {
-        type: "select",
-        options: [
-          "primary",
-          "secondary",
-          "white",
-          "danger",
-          "success",
-          "tertiary",
-          "secondary-gray",
-          "light-red",
-          "dark-blue",
-        ],
-      },
-    },
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { CConfirmActionModal },
-  template: '<c-confirm-action-modal v-bind="$props" />',
-});
-
-export const Default = Template.bind({});
-Default.args = {
-  title: "Are you sure?",
-  message: "This action cannot be undone.",
-  actionOneLabel: "Cancel",
-  actionTwoLabel: "Confirm",
-  actionOneType: "secondary-gray",
-  actionTwoType: "secondary-gray",
-  loadButton: "false"
-};
+import { CConfirmActionModal, CButton } from "../components";
+import "./utils.css";
+
+export default {
+  title: "CConfirmActionModal",
+  component: CConfirmActionModal,
+  subcomponents: { CButton },
+  argTypes: {
+    actionOneType: {
+      control: {
+        type: "select",
+        options: [
+          "primary",
+          "secondary",
+          "white",
+          "danger",
+          "success",
+          "tertiary",
+          "secondary-gray",
+          "light-red",
+          "dark-blue",
+        ],
+      },
+    },
+    actionTwoType: {
+      control: {
+        type: "select",
+        options: [
+          "primary",
+          "secondary",
+          "white",
+          "danger",
+          "success",
+          "tertiary",
+          "secondary-gray",
+          "light-red",
+          "dark-blue",
+        ],
+      },
+    },
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { CConfirmActionModal },
+  template: '<c-confirm-action-modal v-bind="$props" />',
+});
+
+export const Default = Template.bind({});
+Default.args = {
+  title: "Are you sure?",
+  message: "This action cannot be undone.",
+  actionOneLabel: "Cancel",
+  actionTwoLabel: "Confirm",
+  actionOneType: "secondary-gray",
+  actionTwoType: "secondary-gray",
+  loadButton: "false"
+};

package/src/stories/CDatepicker.stories.js

@@ -1,30 +1,30 @@
-import CDatepicker from "../components/CDatepicker/CDatepicker.vue";
-import "./utils.css";
-
-export default {
-  title: "CDatepicker",
-  component: CDatepicker,
-  argTypes: {
-    date: String,
-    classes: String,
-    label: String,
-    helpText: String,
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { CDatepicker },
-  template: '<c-datepicker v-bind="$props" />',
-});
-
-export const Default = Template.bind({});
-Default.args = {
-  // date: "",
-  // classes: "",
-  label: "Date",
-  helpText: "Description",
-  value: new Date(),
-  disabled: false,
-  isExpanded: false,
-};
+import CDatepicker from "../components/CDatepicker/CDatepicker.vue";
+import "./utils.css";
+
+export default {
+  title: "CDatepicker",
+  component: CDatepicker,
+  argTypes: {
+    date: String,
+    classes: String,
+    label: String,
+    helpText: String,
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { CDatepicker },
+  template: '<c-datepicker v-bind="$props" />',
+});
+
+export const Default = Template.bind({});
+Default.args = {
+  // date: "",
+  // classes: "",
+  label: "Date",
+  helpText: "Description",
+  value: new Date(),
+  disabled: false,
+  isExpanded: false,
+};

package/src/stories/CDualSelect.stories.js

@@ -1,29 +1,29 @@
-import CDualSelect from "../components/CDualSelect/CDualSelect.vue";
-import CIcon from "../components/CIcon/CIcon.vue";
-import "./utils.css";
-
-export default {
-  title: "CDualSelect",
-  component: CDualSelect,
-  subcomponents: { CIcon },
-  argTypes: {
-    // type: {
-    //   control: { type: "select", options: ["primary", "secondary", "success", "danger"] },
-    // },
-    items: { control: { type: "object" } },
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { CDualSelect },
-  template: '<c-dual-select v-bind="$props" />',
-});
-
-export const Default = Template.bind({});
-Default.args = {
-  firstDropdownOptions: [{ text: "one" }, { text: "two" }],
-  secondDropdownOptions: [{ text: "four" }, { text: "five" }],
-  //   type: 'primary',
-  label: "Button",
-};
+import CDualSelect from "../components/CDualSelect/CDualSelect.vue";
+import CIcon from "../components/CIcon/CIcon.vue";
+import "./utils.css";
+
+export default {
+  title: "CDualSelect",
+  component: CDualSelect,
+  subcomponents: { CIcon },
+  argTypes: {
+    // type: {
+    //   control: { type: "select", options: ["primary", "secondary", "success", "danger"] },
+    // },
+    items: { control: { type: "object" } },
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { CDualSelect },
+  template: '<c-dual-select v-bind="$props" />',
+});
+
+export const Default = Template.bind({});
+Default.args = {
+  firstDropdownOptions: [{ text: "one" }, { text: "two" }],
+  secondDropdownOptions: [{ text: "four" }, { text: "five" }],
+  //   type: 'primary',
+  label: "Button",
+};

package/src/stories/CEditor.stories.js

@@ -1,30 +1,30 @@
-import CEditor from "../components/CEditor/CEditor.vue";
-import "./utils.css";
-
-export default {
-  title: "CEditor",
-  component: CEditor,
-  argTypes: {
-    content: String,
-    label: String,
-    hint: String,
-    helpText: String,
-    toolbarOptions: Array,
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { CEditor },
-  template: '<c-editor v-bind="$props" />',
-});
-
-export const Default = Template.bind({});
-Default.args = {
-  content: "This is the editor",
-  label: "String",
-  hint: "String",
-  helpText: "String",
-  toolbarOptions: ["bold", "italic"],
-  placeholder: "Please enter your text here...",
-};
+import CEditor from "../components/CEditor/CEditor.vue";
+import "./utils.css";
+
+export default {
+  title: "CEditor",
+  component: CEditor,
+  argTypes: {
+    content: String,
+    label: String,
+    hint: String,
+    helpText: String,
+    toolbarOptions: Array,
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { CEditor },
+  template: '<c-editor v-bind="$props" />',
+});
+
+export const Default = Template.bind({});
+Default.args = {
+  content: "This is the editor",
+  label: "String",
+  hint: "String",
+  helpText: "String",
+  toolbarOptions: ["bold", "italic"],
+  placeholder: "Please enter your text here...",
+};

package/src/stories/CFormSectionHeading.stories.js

@@ -1,34 +1,34 @@
-import CFormSectionHeading from "../components/CFormSectionHeading/CFormSectionHeading.vue";
-import "./utils.css";
-
-export default {
-  title: "CFormSectionHeading",
-  component: CFormSectionHeading,
-  argTypes: {
-    heading: String,
-    description: String,
-    divider: Boolean,
-    tabAction:{ control: { type: "object" } },
-    tabLink: { control: { type: "object" } },
-  },
-};
-
-const Template = (args, { argTypes }) => ({
-  props: Object.keys(argTypes),
-  components: { CFormSectionHeading },
-  template: '<c-form-section-heading v-bind="$props" />',
-});
-
-export const Default = Template.bind({});
-Default.args = {
-  heading: "Includes",
-  description: "Add subjects to include them in the package",
-  divider: false,
-  tabAction: {
-    label: 'Hide completed',
-    type: 'tertiary'
-  },
-  // tabLink: {
-  //   label: 'Hide completed'
-  // }
-};
+import CFormSectionHeading from "../components/CFormSectionHeading/CFormSectionHeading.vue";
+import "./utils.css";
+
+export default {
+  title: "CFormSectionHeading",
+  component: CFormSectionHeading,
+  argTypes: {
+    heading: String,
+    description: String,
+    divider: Boolean,
+    tabAction:{ control: { type: "object" } },
+    tabLink: { control: { type: "object" } },
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { CFormSectionHeading },
+  template: '<c-form-section-heading v-bind="$props" />',
+});
+
+export const Default = Template.bind({});
+Default.args = {
+  heading: "Includes",
+  description: "Add subjects to include them in the package",
+  divider: false,
+  tabAction: {
+    label: 'Hide completed',
+    type: 'tertiary'
+  },
+  // tabLink: {
+  //   label: 'Hide completed'
+  // }
+};