@quoreadmin/ui 1.8.11 → 1.9.0

package/dist/index9.js

@@ -1,6 +1,6 @@
-import r from "./index76.js";
+import r from "./index77.js";
 import { resolveComponent as l, openBlock as n, createElementBlock as p, createVNode as d, withCtx as c, createElementVNode as i, createBlock as m, createCommentVNode as u, toDisplayString as b } from "vue";
-import f from "./index63.js";
+import f from "./index64.js";
 const B = { class: "button-group flex justify-content-center" }, _ = { class: "flex align-items-center" }, y = { class: "option-label" };
 function V(e, t, k, D, $, g) {
   const s = l("q-icon"), a = l("SelectButton");

package/dist/{index90.js → index91.js}

@@ -1,11 +1,11 @@
 import { defineComponent as de, ref as o, computed as r, watch as H, nextTick as j, onMounted as fe, onUnmounted as ve } from "vue";
-import { useScroll as G, useWindowScroll as me, useElementBounding as he } from "./index165.js";
+import { useScroll as G, useWindowScroll as me, useElementBounding as he } from "./index168.js";
 import ye from "./index18.js";
 import ge from "./index19.js";
-import be from "./index50.js";
-import we from "./index177.js";
-import Se from "./index55.js";
-import xe from "./index56.js";
+import be from "./index51.js";
+import we from "./index180.js";
+import Se from "./index56.js";
+import xe from "./index57.js";
 const Pe = de({
   name: "QDataTable",
   components: {

package/dist/{index96.js → index97.js}

@@ -1,11 +1,11 @@
 import { defineComponent as g, ref as l, computed as n, watch as f, nextTick as w, onUnmounted as v } from "vue";
-import D from "./index178.js";
+import D from "./index181.js";
 /* empty css         */
-import "./index180.js";
-import "./index181.js";
-import "./index182.js";
 import "./index183.js";
 import "./index184.js";
+import "./index185.js";
+import "./index186.js";
+import "./index187.js";
 const A = g({
   name: "QDatePicker",
   components: {

package/dist/index99.js

@@ -1,34 +1,29 @@
-import { defineComponent as r, computed as l } from "vue";
-import a from "./index55.js";
-import g from "./index34.js";
-const s = r({
-  name: "QErrorModal",
-  components: {
-    QModal: g
-  },
+import { defineComponent as e, computed as o } from "vue";
+const a = e({
+  name: "QDivider",
   props: {
-    // Model value to hide show modal.
-    toggle: {
-      type: Boolean,
-      default: !1,
-      required: !0
+    /** Border style */
+    borderStyle: {
+      type: String,
+      default: "solid"
+    },
+    /** Border color */
+    borderColor: {
+      type: String,
+      default: "gray-20"
+    },
+    textClass: {
+      type: String,
+      default: ""
     }
   },
-  emits: ["update:toggle"],
-  setup(o, { emit: e }) {
+  emits: ["update:modelValue"],
+  setup(r, { slots: t }) {
     return {
-      // Computed
-      toggleModal: l({
-        get: () => o.toggle,
-        set: (t) => {
-          e("update:toggle", t);
-        }
-      }),
-      // Composables
-      mq: a
+      hasSlotContent: o(() => !!t.default)
     };
   }
 });
 export {
-  s as default
+  a as default
 };

package/dist/src/components/time-picker/time-picker.stories.d.ts

@@ -0,0 +1,25 @@
+import { Meta, StoryObj } from '@storybook/vue3';
+import { default as QTimePicker } from './time-picker.vue';
+/**
+ * A time picker component that wraps QSelect for desktop (dropdown of time
+ * intervals with inline text editing) and QBottomSheet with scroll-wheel
+ * pickers for mobile.
+ */
+declare const meta: Meta<typeof QTimePicker>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const WithValue: Story;
+export declare const TwentyFourHour: Story;
+export declare const Mobile: Story;
+export declare const Mobile24h: Story;
+export declare const MinMax: Story;
+export declare const FiveMinuteStep: Story;
+export declare const ThirtyMinuteStep: Story;
+export declare const FloatingLabel: Story;
+export declare const Required: Story;
+export declare const Disabled: Story;
+export declare const WithNowShortcut: Story;
+export declare const WithTimezone: Story;
+export declare const Clearable: Story;
+export declare const Sizes: Story;

package/dist/src/components/time-picker/time-picker.vue.d.ts

@@ -0,0 +1,52 @@
+interface TimeOption {
+    label: string;
+    value: string;
+}
+type __VLS_Props = {
+    modelValue?: string;
+    format?: '12h' | '24h';
+    step?: number;
+    minTime?: string;
+    maxTime?: string;
+    mobile?: boolean;
+    placeholder?: string;
+    disabled?: boolean;
+    required?: boolean;
+    floatingLabel?: boolean;
+    size?: 'xs' | 'sm' | 'md' | 'lg';
+    id?: string;
+    clearable?: boolean;
+    customTimes?: TimeOption[];
+    showNow?: boolean;
+    timezone?: string;
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: string) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+}>, {
+    modelValue: string;
+    size: "xs" | "sm" | "md" | "lg";
+    placeholder: string;
+    disabled: boolean;
+    required: boolean;
+    id: string;
+    mobile: boolean;
+    floatingLabel: boolean;
+    clearable: boolean;
+    format: "12h" | "24h";
+    step: number;
+    minTime: string;
+    maxTime: string;
+    customTimes: TimeOption[];
+    showNow: boolean;
+    timezone: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    hourInputRef: HTMLInputElement;
+    minuteInputRef: HTMLInputElement;
+    periodInputRef: HTMLInputElement;
+    hourColumnRef: HTMLDivElement;
+    minuteColumnRef: HTMLDivElement;
+    periodColumnRef: HTMLDivElement;
+}, HTMLDivElement>;
+export default _default;

package/dist/src/index.d.ts

@@ -45,6 +45,7 @@ export { default as QSelect } from './components/select/select.vue';
 export { default as QTable } from './components/table/table.vue';
 export { default as QTag } from './components/tag/tag.vue';
 export { default as QTextarea } from './components/textarea/textarea.vue';
+export { default as QTimePicker } from './components/time-picker/time-picker.vue';
 export { default as QToast } from './components/toast/toast.vue';
 export { default as QTooltip } from './components/tooltip/tooltip.vue';
 export { default as QTour } from './components/tour/tour.vue';

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@quoreadmin/ui",
     "private": false,
-    "version": "1.8.11",
+    "version": "1.9.0",
     "type": "module",
     "sideEffects": [
         "**/*.css",

package/dist/index103.js

@@ -1,142 +0,0 @@
-import { defineComponent as C, ref as n, computed as v } from "vue";
-import { useDropZone as b } from "./index165.js";
-import z from "./index55.js";
-import M from "./index185.js";
-import T from "./index6.js";
-import h from "./index30.js";
-import I from "./index34.js";
-import O from "./index35.js";
-const W = C({
-  name: "QFileUpload",
-  components: {
-    FileUpload: M,
-    QBadge: T,
-    QImageGallery: h,
-    QModal: I,
-    QModalContent: O
-  },
-  props: {
-    /** Name of the request parameter to identify the files at backend. */
-    name: {
-      type: Array,
-      default: null
-    },
-    files: {
-      type: Array,
-      default: () => []
-    },
-    /** Upload url */
-    url: {
-      type: String,
-      default: ""
-    },
-    /** If we should allow multiple files */
-    multiple: {
-      type: Boolean,
-      default: !0
-    },
-    /** Specify file types allowed */
-    // https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file
-    filesAllowed: {
-      type: String,
-      default: "image/*,.pdf"
-    },
-    /** Specify file types allowed */
-    // Added any because type: null as unknown as PropType<number | null>, doesn't work
-    maxFileSize: {
-      type: Number,
-      default: 33554432
-      // 32MB - updated from 8MB standard in quorev2
-    },
-    /** Auto upload files */
-    autoUpload: {
-      type: Boolean,
-      default: !1
-    },
-    /** Override uploading by enabling customUpload and defining a custom uploader handler event. */
-    // https://primevue.org/fileupload/#custom-upload
-    customUpload: {
-      type: Boolean,
-      default: !1
-    },
-    disabled: {
-      type: Boolean,
-      default: !1
-    },
-    expands: {
-      type: Boolean,
-      default: !1
-    },
-    processing: {
-      type: Boolean,
-      default: !1
-    },
-    showGallery: {
-      type: Boolean,
-      default: !1
-    }
-  },
-  emits: ["file-list", "upload-error", "uploading"],
-  setup(s, { emit: r }) {
-    const a = n(null), d = n(), i = n([]), p = n([]), u = v(() => s.files), F = v(() => s.filesAllowed.replace(/,/g, ", ")), w = () => {
-      a.value && a.value.clear();
-    }, x = () => {
-      i.value = [], p.value = [];
-    }, c = (e) => {
-      const o = s.filesAllowed.split(",").map((l) => l.trim());
-      for (const l of o)
-        if (m(l) ? f(e.type) === f(l) : e.type == l || y(e).toLowerCase() === l.toLowerCase())
-          return !0;
-      return !1;
-    }, m = (e) => e.indexOf("*") !== -1, y = (e) => "." + e.name.split(".").pop(), f = (e) => e.substring(0, e.indexOf("/")), g = (e) => {
-      const o = e.originalEvent;
-      let l = [];
-      o.type === "drop" ? l = o.dataTransfer?.files : l = o.target.files;
-      for (const t of l)
-        t.size > s.maxFileSize && i.value.push(t.name), c(t) || p.value.push(t.name);
-    }, B = (e) => {
-      r("upload-error", e);
-    }, U = () => {
-      a.value && a.value.upload();
-    }, A = (e) => {
-      r("uploading", e);
-    }, E = (e) => {
-      const o = u.value, l = o.findIndex(
-        (t) => t.lastModified === e.lastModified
-      );
-      l !== -1 && (o.splice(l, 1), r("file-list", o)), a.value.messages = null;
-    }, Q = (e) => {
-      g(e), r("file-list", e.files);
-    }, { isOverDropZone: S } = b(d);
-    return {
-      // ref elements - Needed this for triggering events in component
-      fileUpload: a,
-      dropZoneRef: d,
-      // refs
-      allFiles: u,
-      sizeErrors: i,
-      typeErrors: p,
-      isOverDropZone: S,
-      // computed
-      displayAllowedTypes: F,
-      // methods
-      clear: w,
-      clearErrors: x,
-      getFileExtension: y,
-      getTypeClass: f,
-      isValidFileType: c,
-      isWildcard: m,
-      onBeforeSelect: g,
-      onUpload: U,
-      onUploadError: B,
-      onUploading: A,
-      onRemoveFile: E,
-      onSelectedFiles: Q,
-      // composables
-      mq: z
-    };
-  }
-});
-export {
-  W as default
-};

package/dist/index154.js

@@ -1,120 +0,0 @@
-import { defineComponent as c, ref as u, computed as v, onMounted as g, onUnmounted as h, watch as y, nextTick as m } from "vue";
-import { useThrottleFn as b } from "./index176.js";
-const T = c({
-  name: "QTooltip",
-  props: {
-    // Pass in an ID unique to the tooltip used for aria-describedby.
-    id: {
-      type: String,
-      default: "tooltip"
-    },
-    /** Set tooltip color - currently only inkwell-30 */
-    color: {
-      type: String,
-      default: "inkwell-30"
-    },
-    /** Controls if the tooltip is in controlled mode */
-    controlled: {
-      type: Boolean,
-      default: !1
-    },
-    disabled: {
-      type: Boolean,
-      default: !1
-    },
-    /** Sets the width of the element as well as the alignment and wrapping of the tooltip text*/
-    noWrap: {
-      type: Boolean,
-      default: !0
-    },
-    /** Ability to customize the tooltip position (top, bottom, left, right) */
-    position: {
-      type: String,
-      default: "bottom"
-    },
-    /** Set if the tooltip is relatively positioned or not */
-    relative: {
-      type: Boolean,
-      default: !1
-    },
-    /** Set if the tooltip is teleported to the the teleportTo element */
-    teleport: {
-      type: Boolean,
-      default: !1
-    },
-    teleportTo: {
-      type: String,
-      default: "body"
-    },
-    /** Ability to set custom tooltip classes */
-    tooltipClasses: {
-      type: [String, Array, Object],
-      default: ""
-    },
-    /** Controls visibility in controlled mode */
-    visible: {
-      type: Boolean,
-      default: !1
-    },
-    tooltipGap: {
-      type: Number,
-      default: 12
-    }
-  },
-  setup(e) {
-    const o = u(!1), l = u({
-      top: "0",
-      left: "0"
-    }), r = u(null), p = v(() => e.controlled ? e.visible : e.teleport ? o.value : !1), d = () => {
-      if (!r.value) return;
-      const t = r.value.getBoundingClientRect(), a = e.tooltipGap;
-      e.position === "top" ? (l.value.top = `${t.top - a}px`, l.value.left = `${t.left + t.width / 2}px`) : e.position === "bottom" ? (l.value.top = `${t.bottom + a}px`, l.value.left = `${t.left + t.width / 2}px`) : e.position === "left" ? (l.value.left = `${t.left - a}px`, l.value.top = `${t.top + t.height / 2}px`) : e.position === "right" && (l.value.left = `${t.right + a}px`, l.value.top = `${t.top + t.height / 2}px`);
-    }, f = () => {
-      o.value = !0, m(() => {
-        d();
-      });
-    }, i = () => {
-      o.value = !1, l.value.top = "0", l.value.left = "0";
-    }, n = b(
-      () => {
-        e.controlled && o.value === !0 && d(), !e.controlled && o.value === !0 && i();
-      },
-      100,
-      !0
-    );
-    return g(() => {
-      e.teleport && e.controlled && (e.visible ? f() : i()), e.teleport && (window.addEventListener(
-        "resize",
-        n
-      ), window.addEventListener(
-        "scroll",
-        n
-      ));
-    }), h(() => {
-      e.teleport && (window.removeEventListener(
-        "resize",
-        n
-      ), window.removeEventListener(
-        "scroll",
-        n
-      ));
-    }), y(
-      () => e.visible,
-      (s) => {
-        e.teleport && e.controlled && (s ? f() : i());
-      }
-    ), {
-      // Refs
-      tooltipStyle: l,
-      tooltipTarget: r,
-      // Computed
-      isVisible: p,
-      // Methods
-      hideTooltip: i,
-      showTooltip: f
-    };
-  }
-});
-export {
-  T as default
-};

package/dist/index161.js

@@ -1,210 +0,0 @@
-import { defineComponent as q, ref as o, computed as c, watch as k, onBeforeUnmount as M, onMounted as z, onUnmounted as K, nextTick as Q } from "vue";
-import { onClickOutside as b, useBreakpoints as W, breakpointsTailwind as _ } from "./index165.js";
-import { EditorContent as $, useEditor as D } from "./index198.js";
-import G from "./index199.js";
-import I from "./index200.js";
-import { Underline as J } from "./index201.js";
-import { TextStyle as N, Color as X } from "./index202.js";
-import { Link as Y } from "./index203.js";
-import { Placeholder as Z } from "./index204.js";
-import ee from "./index24.js";
-import te from "./index164.js";
-const ve = q({
-  components: {
-    EditorContent: $,
-    EmojiPicker: G,
-    QFileUpload: ee
-  },
-  props: {
-    modelValue: {
-      type: String,
-      default: ""
-    },
-    attachments: {
-      type: Object,
-      default: () => []
-    },
-    allowEmojis: {
-      type: Boolean,
-      default: !1
-    },
-    // If the wysiwyg should allow users to upload files/images
-    allowAttachments: {
-      type: Boolean,
-      default: !1
-    },
-    allowFormatting: {
-      type: Boolean,
-      default: !1
-    },
-    disabled: {
-      type: Boolean,
-      default: !1
-    },
-    /** Specify file types allowed */
-    // https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file
-    filesAllowed: {
-      type: String,
-      default: "image/*,.pdf"
-    },
-    // If NOT isStacked we can expand it to be stacked when focused or files are attached
-    expands: {
-      type: Boolean,
-      default: !1
-    },
-    isStacked: {
-      type: Boolean,
-      default: !0
-    },
-    isStandalone: {
-      type: Boolean,
-      default: !1
-    },
-    placeholder: {
-      type: String,
-      default: ""
-    },
-    processing: {
-      type: Boolean,
-      default: !1
-    }
-    // If we have attachments, the wysiwyg should show the image preview as thumbnails (circle back)
-    // showThumbnails: {
-    //     type: Boolean,
-    //     default: true,
-    // },
-    // circle back to this
-    // mentions: {
-    //     // Refine type as we get further
-    //     type: Array as PropType<any>,
-    //     default: () => [],
-    // },
-  },
-  emits: ["update:model-value", "update:attachments", "keyboard-open"],
-  setup(a, { emit: i }) {
-    const d = o(), u = o(!1), C = o(""), f = o(), x = o(), s = o(!1), m = o(!1), n = o(!1), r = o([]), v = o(), E = o(), p = o(), l = o(!1), S = o(window.innerHeight), B = c(() => t.value.getAttributes("textStyle").color || "#121517"), h = c(() => a.attachments), V = c(() => a.isStacked || a.expands && (h.value.length > 0 || n.value || !t.value.isEmpty) || m.value), U = W(_).greaterOrEqual("md"), j = () => {
-      const e = window.prompt("URL");
-      t.value.chain().focus().extendMarkRange("link").setLink({ href: e || "" }).run();
-    }, L = (e) => {
-      t.value.chain().focus().setColor(e).run(), g();
-    }, F = () => {
-      s.value = !s.value;
-    }, g = () => {
-      s.value = !1;
-    }, O = () => {
-      v.value?.fileUpload?.choose();
-    }, P = (e) => {
-      t.value.chain().focus().insertContent(e).run(), f.value.$el.click();
-    }, w = async () => {
-      if (await Q(), n.value) {
-        const e = l.value, T = visualViewport?.height || window.innerHeight;
-        l.value = S.value - T > 0, e !== l.value && (n.value = l.value, i("keyboard-open", l.value));
-      }
-    }, R = () => {
-      n.value && a.expands && (l.value = !1, i("keyboard-open", l.value)), n.value = !1;
-    }, A = (e) => {
-      t.value.chain().focus().insertContent(e.i).run(), u.value = !1;
-    }, H = (e) => {
-      r.value = e, y();
-    }, y = () => {
-      let e = "";
-      t.value.isEmpty || (e = a.allowFormatting ? t.value.getHTML() : t.value.getText()), r.value !== a.attachments && i("update:attachments", r.value), i("update:model-value", e);
-    }, t = o(
-      D({
-        extensions: [
-          I.configure({
-            // Disable an included extension
-            // Command + z = undo
-            // TODO: Add an undo button if this is needed
-            // history: false,
-            // Configure an included extension
-            heading: {
-              levels: [1, 2]
-            }
-          }),
-          J,
-          N,
-          X,
-          Y.configure({
-            openOnClick: !1
-          }),
-          Z.configure({
-            placeholder: a.placeholder
-          })
-        ],
-        content: a.modelValue,
-        // Set this to the initial value coming in.
-        onUpdate: y,
-        editable: !a.disabled
-        // make the text editable or not - default is editable
-      })
-    );
-    return k(() => a.modelValue, (e) => {
-      t.value && !e && t.value.commands.clearContent();
-    }), k(() => a.disabled, (e) => {
-      t.value && (t.value.options.editable = !e, t.value.view.update(t.value.view.props));
-    }), M(() => {
-      t.value?.destroy();
-    }), z(() => {
-      visualViewport && a.expands && visualViewport.addEventListener("resize", w);
-    }), K(() => {
-      visualViewport && a.expands && visualViewport.removeEventListener("resize", w);
-    }), b(d, () => {
-      u.value = !1;
-    }), b(p, () => {
-      n.value && a.expands && (l.value = !1, i("keyboard-open", l.value)), n.value = !1;
-    }), {
-      colors: te.theme.colors,
-      colorExclusions: [
-        "success",
-        "success-light",
-        "error",
-        "error-light",
-        "warning",
-        "warning-light",
-        "info",
-        "info-light",
-        "transparent",
-        "current",
-        "green-quore",
-        "blue-sky",
-        "blue-quore",
-        "complaint",
-        "recurring",
-        "workorder"
-      ],
-      editor: t,
-      editorRef: E,
-      // refs
-      emojiPickerElement: d,
-      showEmojiPicker: u,
-      emojiSearch: C,
-      invoker: f,
-      isExpanded: V,
-      multiUploader: x,
-      showColorMenu: s,
-      focused: n,
-      files: h,
-      showFormatOptions: m,
-      uploadedfiles: r,
-      fileUploadRef: v,
-      wysiwygRef: p,
-      // computed
-      setColor: B,
-      // methods
-      mdAndLarger: U,
-      setLink: j,
-      selectColor: L,
-      showColors: F,
-      onClickAction: R,
-      onClickOutColors: g,
-      attachFiles: O,
-      appendEmoji: P,
-      onSelectEmoji: A,
-      onSelectFiles: H
-    };
-  }
-});
-export {
-  ve as default
-};