@ulu/frontend-vue 0.5.3 → 0.5.5

package/dist/components/elements/UluCounterList.vue.d.ts

@@ -0,0 +1,32 @@
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & (new () => {
+    $slots: S;
+});
+declare const __VLS_component: import('vue').DefineComponent<{}, {
+    classes: Record<string, any>;
+    element: string;
+    itemElement: string;
+    alphabetical: boolean;
+    noReset: boolean;
+    modifiers?: string | unknown[] | undefined;
+    items?: unknown[] | undefined;
+    $props: {
+        readonly classes?: Record<string, any> | undefined;
+        readonly element?: string | undefined;
+        readonly itemElement?: string | undefined;
+        readonly alphabetical?: boolean | undefined;
+        readonly noReset?: boolean | undefined;
+        readonly modifiers?: string | unknown[] | undefined;
+        readonly items?: unknown[] | undefined;
+    };
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+type __VLS_TemplateResult = {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+//# sourceMappingURL=UluCounterList.vue.d.ts.map

package/dist/components/elements/UluCounterList.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UluCounterList.vue.d.ts","sourceRoot":"","sources":["../../../lib/components/elements/UluCounterList.vue"],"names":[],"mappings":"AAcA;wBA4NqB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;;6BAEtE,CAAC,EAAE,CAAC;;;AAXjC;;;;;;;;;;;;;;;;;2OAQG"}

package/dist/components/elements/UluCounterList.vue.js

@@ -0,0 +1,77 @@
+import { computed as l, createBlock as r, openBlock as o, normalizeClass as m, unref as c, createSlots as u, withCtx as f, renderSlot as d, normalizeProps as p, guardReactiveProps as y } from "vue";
+import { useModifiers as b } from "../../composables/useModifiers.js";
+import h from "./UluList.vue.js";
+const B = {
+  __name: "UluCounterList",
+  props: {
+    /**
+     * Array of list items, output as is or use slot to template the item
+     * - Note item can add classes by defining { classes: { item } }
+     */
+    items: Array,
+    /**
+     * HTML element for the list
+     */
+    element: {
+      type: String,
+      default: "ol"
+    },
+    /**
+     * HTML element for the list items (when using items array)
+     */
+    itemElement: {
+      type: String,
+      default: "li"
+    },
+    /**
+     * Classes object (keys are { list, item } to be applied to list and item elements)
+     */
+    classes: {
+      type: Object,
+      default: () => ({})
+    },
+    /**
+     * Use alphabetical counter
+     */
+    alphabetical: Boolean,
+    /**
+     * Remove counter reset
+     */
+    noReset: Boolean,
+    /**
+     * Modifiers (to add any modifier classes based on base class [ie. 'alphabetical'])
+     */
+    modifiers: [String, Array]
+  },
+  setup(t) {
+    const e = t, { resolvedModifiers: a } = b({
+      props: e,
+      baseClass: "counter-list",
+      internal: l(() => ({
+        alphabetical: e.alphabetical,
+        "no-reset": e.noReset
+      }))
+    }), i = l(() => ({
+      list: e.classes.list,
+      item: ["counter-list__item", e.classes.item]
+    }));
+    return (s, C) => (o(), r(h, {
+      class: m(["counter-list", c(a)]),
+      items: t.items,
+      element: t.element,
+      itemElement: t.itemElement,
+      classes: i.value
+    }, u({ _: 2 }, [
+      s.$slots.default ? {
+        name: "default",
+        fn: f((n) => [
+          d(s.$slots, "default", p(y(n)))
+        ]),
+        key: "0"
+      } : void 0
+    ]), 1032, ["class", "items", "element", "itemElement", "classes"]));
+  }
+};
+export {
+  B as default
+};

package/dist/components/elements/UluDataTable.vue.d.ts

@@ -0,0 +1,43 @@
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & (new () => {
+    $slots: S;
+});
+declare const __VLS_component: import('vue').DefineComponent<{}, {
+    classes: Record<string, any>;
+    striped: boolean;
+    largeFirst: boolean;
+    modifiers?: string | unknown[] | undefined;
+    columns?: unknown[] | undefined;
+    rows?: unknown[] | undefined;
+    footerRows?: unknown[] | undefined;
+    idPrefix?: string | undefined;
+    caption?: string | undefined;
+    getRowValue?: Function | undefined;
+    getColumnTitle?: Function | undefined;
+    $props: {
+        readonly classes?: Record<string, any> | undefined;
+        readonly striped?: boolean | undefined;
+        readonly largeFirst?: boolean | undefined;
+        readonly modifiers?: string | unknown[] | undefined;
+        readonly columns?: unknown[] | undefined;
+        readonly rows?: unknown[] | undefined;
+        readonly footerRows?: unknown[] | undefined;
+        readonly idPrefix?: string | undefined;
+        readonly caption?: string | undefined;
+        readonly getRowValue?: Function | undefined;
+        readonly getColumnTitle?: Function | undefined;
+    };
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLTableElement>;
+type __VLS_TemplateResult = {
+    attrs: Partial<{}>;
+    slots: Partial<Record<number, (_: {
+        row: any;
+        column: any;
+        rowIndex: number;
+        index: number;
+    }) => any>>;
+    refs: {};
+    rootEl: HTMLTableElement;
+};
+//# sourceMappingURL=UluDataTable.vue.d.ts.map

package/dist/components/elements/UluDataTable.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UluDataTable.vue.d.ts","sourceRoot":"","sources":["../../../lib/components/elements/UluDataTable.vue"],"names":[],"mappings":"AAqBA;wBA6SqB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;;6BAEtE,CAAC,EAAE,CAAC;;;AAXjC;;;;;;;;;;;;;;;;;;;;;;;;;wPAQG"}

package/dist/components/elements/UluDataTable.vue.js

@@ -0,0 +1,114 @@
+import { computed as l, createBlock as n, openBlock as c, mergeProps as u, unref as f, createSlots as m, renderList as d, withCtx as g, renderSlot as w, normalizeProps as y, guardReactiveProps as R } from "vue";
+import { useModifiers as b } from "../../composables/useModifiers.js";
+import p from "./UluTable.vue.js";
+import { isArrayOfObjects as o } from "../../utils/props.js";
+const x = {
+  __name: "UluDataTable",
+  props: {
+    /**
+     * Array of column configurations to convert to list output
+     * 
+     * @property {Object} column A column config
+     * @property {String|Boolean} column.title The title to output for the column if set to a falsey value nothing will print
+     * @property {Array} column.columns Array of child columns
+     * @property {String} column.key The key that should be usec to grab column's value from rows
+     * @property {Function} column.value A function that returns the column's value used instead of key passed (row, column)
+     * @property {String} column.slot Register custom slot name to use as a template for this column. Passing a slot with this name will link them. The slot are passed the ({row, column}). Note this will disable output of the column's value
+     * @property {String} column.slotHeader Register custom slot name to use in the header
+     * @property {String} column.classHeader Custom class(s) to be set to column <th>
+     * @property {String} column.class Custom class(s) to be set to column's value <td>       
+     * @property {String} column.html Use v-html output for value      
+     * @property {String} column.rowHeader When this column is printed in the <tbody> it should be a header for the row. Note supports multiple row headers from left to right only. No rowspan support for rowHeaders. 
+     */
+    columns: {
+      type: Array,
+      validator: o
+    },
+    /**
+     * Array of tables rows (tbody)
+     * - Each row is an object who's value will be matched to columns
+     */
+    rows: {
+      type: Array,
+      validator: o
+    },
+    /**
+     * Array of rows for footer (tfoot)
+     */
+    footerRows: {
+      type: Array,
+      validator: o
+    },
+    /**
+     * Hidden caption for accessibility (or visible depending on styles). Can also be passed via slot.
+     */
+    caption: String,
+    /**
+     * Prefix used for id generation
+     */
+    idPrefix: String,
+    /**
+     * Optional user overridden value getter (for rows)
+     * @param {Object} row The current row
+     * @param {Object} column The current column in the row
+     */
+    getRowValue: Function,
+    /**
+     * Optional user overridden title getter (for headers)
+     * @param {Object} column The current column
+     */
+    getColumnTitle: Function,
+    /**
+     * Applies striped row styling
+     */
+    striped: Boolean,
+    /**
+     * Enhances the first column's visual prominence
+     */
+    largeFirst: Boolean,
+    /**
+     * Additional style modifiers
+     */
+    modifiers: [String, Array],
+    /**
+     * Allows user to pass classes object to add custom classes to parts of the component
+     */
+    classes: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  setup(e) {
+    const t = e, { resolvedModifiers: s } = b({
+      props: t,
+      baseClass: "data-table",
+      internal: l(() => ({
+        striped: t.striped,
+        "large-first": t.largeFirst
+      }))
+    });
+    return (r, P) => (c(), n(p, u({ class: "data-table" }, r.$attrs, {
+      columns: e.columns,
+      rows: e.rows,
+      footerRows: e.footerRows,
+      caption: e.caption,
+      idPrefix: e.idPrefix,
+      getRowValue: e.getRowValue,
+      getColumnTitle: e.getColumnTitle,
+      classes: {
+        ...e.classes,
+        table: [f(s), e.classes?.table]
+      }
+    }), m({ _: 2 }, [
+      d(r.$slots, (C, a) => ({
+        name: a,
+        fn: g((i) => [
+          w(r.$slots, a, y(R(i)))
+        ])
+      }))
+    ]), 1040, ["columns", "rows", "footerRows", "caption", "idPrefix", "getRowValue", "getColumnTitle", "classes"]));
+  }
+};
+export {
+  x as default
+};

package/dist/components/elements/UluDefinitionList.vue.d.ts

@@ -6,9 +6,9 @@ type __VLS_WithTemplateSlots<T, S> = T & (new () => {
 declare const __VLS_component: import('vue').DefineComponent<{}, {
     classes: Record<string, any>;
     compact: boolean;
+    table: boolean;
     inline: boolean;
     inlineAll: boolean;
-    table: boolean;
     separated: boolean;
     separatedFirst: boolean;
     separatedLast: boolean;
@@ -17,9 +17,9 @@ declare const __VLS_component: import('vue').DefineComponent<{}, {
     $props: {
         readonly classes?: Record<string, any> | undefined;
         readonly compact?: boolean | undefined;
+        readonly table?: boolean | undefined;
         readonly inline?: boolean | undefined;
         readonly inlineAll?: boolean | undefined;
-        readonly table?: boolean | undefined;
         readonly separated?: boolean | undefined;
         readonly separatedFirst?: boolean | undefined;
         readonly separatedLast?: boolean | undefined;

package/dist/components/elements/UluList.vue.d.ts

@@ -11,8 +11,10 @@ declare const __VLS_component: import('vue').DefineComponent<{}, {
     lines: boolean;
     forceOrdered: boolean;
     reversed: boolean;
+    itemElement: string;
     start?: string | undefined;
     items?: unknown[] | undefined;
+    element?: string | undefined;
     listStyleType?: string | undefined;
     $props: {
         readonly classes?: Record<string, any> | undefined;
@@ -22,8 +24,10 @@ declare const __VLS_component: import('vue').DefineComponent<{}, {
         readonly lines?: boolean | undefined;
         readonly forceOrdered?: boolean | undefined;
         readonly reversed?: boolean | undefined;
+        readonly itemElement?: string | undefined;
         readonly start?: string | undefined;
         readonly items?: unknown[] | undefined;
+        readonly element?: string | undefined;
         readonly listStyleType?: string | undefined;
     };
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;

package/dist/components/elements/UluList.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UluList.vue.d.ts","sourceRoot":"","sources":["../../../lib/components/elements/UluList.vue"],"names":[],"mappings":"AAoCA;wBAiQqB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;;6BAEtE,CAAC,EAAE,CAAC;;;AAVjC;;;;;;;;;;;;;;;;;;;;;;;2OAOG"}
+{"version":3,"file":"UluList.vue.d.ts","sourceRoot":"","sources":["../../../lib/components/elements/UluList.vue"],"names":[],"mappings":"AAqCA;wBA0SqB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;;6BAEtE,CAAC,EAAE,CAAC;;;AAVjC;;;;;;;;;;;;;;;;;;;;;;;;;;;2OAOG"}

package/dist/components/elements/UluList.vue.js

@@ -1,5 +1,5 @@
-import { provide as m, computed as r, createBlock as y, createCommentVNode as f, openBlock as a, resolveDynamicComponent as v, normalizeStyle as B, normalizeClass as o, withCtx as S, createElementBlock as i, renderSlot as c, Fragment as k, renderList as g, createTextVNode as C, toDisplayString as O } from "vue";
-const L = {
+import { provide as f, computed as r, createBlock as i, createCommentVNode as v, openBlock as n, resolveDynamicComponent as o, normalizeStyle as S, normalizeClass as c, withCtx as m, createElementBlock as B, renderSlot as u, Fragment as g, renderList as k, createTextVNode as E, toDisplayString as C } from "vue";
+const h = {
   __name: "UluList",
   props: {
     /**
@@ -8,7 +8,7 @@ const L = {
      */
     items: Array,
     /**
-     * Classes object (keys are { list, item } to be applied to <ul> and <li>)
+     * Classes object (keys are { list, item } to be applied to list and item elements)
      * - Any valid class binding for each
      */
     classes: {
@@ -47,15 +47,29 @@ const L = {
     /**
      * Define list style type (ie. disc, decimal, etc)
      */
-    listStyleType: String
+    listStyleType: String,
+    /**
+     * Element to render the list as (overrides ul/ol)
+     */
+    element: String,
+    /**
+     * Element to render items as when using items array
+     */
+    itemElement: {
+      type: String,
+      default: "li"
+    }
   },
   setup(e) {
     const t = e;
-    m("uluListClasses", r(() => t.classes));
-    const n = r(() => t.ordered || t.forceOrdered), u = r(() => n.value ? "ol" : "ul");
-    return (l, T) => (e.items !== void 0 ? e.items.length : l.$slots.default) ? (a(), y(v(u.value), {
+    f("uluListContext", r(() => ({
+      classes: t.classes,
+      itemElement: t.itemElement
+    })));
+    const a = r(() => t.ordered || t.forceOrdered), y = r(() => t.element || (a.value ? "ol" : "ul"));
+    return (l, O) => (e.items !== void 0 ? e.items.length : l.$slots.default) ? (n(), i(o(y.value), {
       key: 0,
-      class: o([
+      class: c([
         {
           "list-ordered": e.ordered,
           "list-unordered": e.unordered,
@@ -64,32 +78,35 @@ const L = {
         },
         e.classes.list
       ]),
-      style: B({
+      style: S({
         listStyleType: e.listStyleType
       }),
-      reversed: n.value ? e.reversed : null,
+      reversed: a.value ? e.reversed : null,
       start: e.start
     }, {
-      default: S(() => [
-        e.items !== void 0 ? (a(!0), i(k, { key: 0 }, g(e.items, (s, d) => (a(), i("li", {
+      default: m(() => [
+        e.items !== void 0 ? (n(!0), B(g, { key: 0 }, k(e.items, (s, d) => (n(), i(o(e.itemElement), {
           key: d,
-          class: o([
+          class: c([
             e.classes.item,
             s?.classes?.item
           ])
-        }, [
-          c(l.$slots, "default", {
-            item: s,
-            index: d
-          }, () => [
-            C(O(s), 1)
-          ])
-        ], 2))), 128)) : c(l.$slots, "default", { key: 1 })
+        }, {
+          default: m(() => [
+            u(l.$slots, "default", {
+              item: s,
+              index: d
+            }, () => [
+              E(C(s), 1)
+            ])
+          ]),
+          _: 2
+        }, 1032, ["class"]))), 128)) : u(l.$slots, "default", { key: 1 })
       ]),
       _: 3
-    }, 8, ["class", "style", "reversed", "start"])) : f("", !0);
+    }, 8, ["class", "style", "reversed", "start"])) : v("", !0);
   }
 };
 export {
-  L as default
+  h as default
 };

package/dist/components/elements/UluListItem.vue.d.ts

@@ -5,16 +5,18 @@ type __VLS_WithTemplateSlots<T, S> = T & (new () => {
 });
 declare const __VLS_component: import('vue').DefineComponent<{}, {
     classes?: string | Record<string, any> | unknown[] | undefined;
+    element?: string | undefined;
     $props: {
         readonly classes?: string | Record<string, any> | unknown[] | undefined;
+        readonly element?: string | undefined;
     };
-}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLLIElement>;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
 type __VLS_TemplateResult = {
     attrs: Partial<{}>;
     slots: {
         default?(_: {}): any;
     };
     refs: {};
-    rootEl: HTMLLIElement;
+    rootEl: any;
 };
 //# sourceMappingURL=UluListItem.vue.d.ts.map

package/dist/components/elements/UluListItem.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UluListItem.vue.d.ts","sourceRoot":"","sources":["../../../lib/components/elements/UluListItem.vue"],"names":[],"mappings":"AAKA;wBAkFqB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;;6BAEtE,CAAC,EAAE,CAAC;;;AAXjC;;;;;qPAQG"}
+{"version":3,"file":"UluListItem.vue.d.ts","sourceRoot":"","sources":["../../../lib/components/elements/UluListItem.vue"],"names":[],"mappings":"AAKA;wBAqGqB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;;6BAEtE,CAAC,EAAE,CAAC;;;AAXjC;;;;;;;2OAQG"}

package/dist/components/elements/UluListItem.vue.js

@@ -1,21 +1,28 @@
-import { inject as a, computed as c, createElementBlock as r, openBlock as n, normalizeClass as o, renderSlot as u } from "vue";
-const p = {
+import { inject as c, computed as s, createBlock as r, openBlock as i, resolveDynamicComponent as m, normalizeClass as u, withCtx as p, renderSlot as d } from "vue";
+const f = {
   __name: "UluListItem",
   props: {
     /**
      * Optional class binding to append to the injected parent classes
      */
-    classes: [String, Array, Object]
+    classes: [String, Array, Object],
+    /**
+     * The HTML element to render the item as
+     */
+    element: String
   },
   setup(e) {
-    const s = a("uluListClasses", { value: {} }), t = c(() => s.value || {});
-    return (l, i) => (n(), r("li", {
-      class: o([t.value.item, e.classes])
-    }, [
-      u(l.$slots, "default")
-    ], 2));
+    const l = e, t = c("uluListContext", { value: {} }), n = s(() => t.value?.classes || {}), a = s(() => l.element || t.value?.itemElement || "li");
+    return (o, v) => (i(), r(m(a.value), {
+      class: u([n.value.item, e.classes])
+    }, {
+      default: p(() => [
+        d(o.$slots, "default")
+      ]),
+      _: 3
+    }, 8, ["class"]));
   }
 };
 export {
-  p as default
+  f as default
 };

package/dist/components/elements/UluTable.vue.d.ts

@@ -0,0 +1,48 @@
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & (new () => {
+    $slots: S;
+});
+declare const __VLS_component: import('vue').DefineComponent<{}, {
+    classes: Record<string, any>;
+    idPrefix: string;
+    columns?: unknown[] | undefined;
+    rows?: unknown[] | undefined;
+    footerRows?: unknown[] | undefined;
+    caption?: string | undefined;
+    getRowValue?: Function | undefined;
+    getColumnTitle?: Function | undefined;
+    $props: {
+        readonly classes?: Record<string, any> | undefined;
+        readonly idPrefix?: string | undefined;
+        readonly columns?: unknown[] | undefined;
+        readonly rows?: unknown[] | undefined;
+        readonly footerRows?: unknown[] | undefined;
+        readonly caption?: string | undefined;
+        readonly getRowValue?: Function | undefined;
+        readonly getColumnTitle?: Function | undefined;
+    };
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLTableElement>;
+type __VLS_TemplateResult = {
+    attrs: Partial<{}>;
+    slots: Partial<Record<any, (_: {
+        column: never;
+        index: number;
+    }) => any>> & Partial<Record<any, (_: {
+        row: any;
+        column: any;
+        rowIndex: number;
+        index: number;
+    }) => any>> & Partial<Record<any, (_: {
+        row: any;
+        column: any;
+        rowIndex: number;
+        index: number;
+    }) => any>> & {
+        caption?(_: {}): any;
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLTableElement;
+};
+//# sourceMappingURL=UluTable.vue.d.ts.map

package/dist/components/elements/UluTable.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UluTable.vue.d.ts","sourceRoot":"","sources":["../../../lib/components/elements/UluTable.vue"],"names":[],"mappings":"AAwGA;wBAshBqB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;;6BAEtE,CAAC,EAAE,CAAC;;;AAXjC;;;;;;;;;;;;;;;;;;;wPAQG"}