@onereach/ui-components 4.9.1-beta.2907.0 → 4.10.0

package/dist/esm/v3/OrDateTimePickerTimeSelect-14503fde.js

@@ -1,252 +0,0 @@
-import { defineComponent, ref, computed } from 'vue-demi';
-import { openBlock, createElementBlock, normalizeClass, Fragment, createTextVNode, toDisplayString, resolveComponent, createElementVNode, renderList, createBlock, withModifiers, withCtx } from 'vue';
-import { s as script$2 } from './OrButton-c2b6aa9e.js';
-
-function useTimePlaceholder() {
-  const sample = new Date(Date.UTC(1, 1, 3, 4, 5)).toLocaleString(navigator.language, {
-    timeStyle: 'short',
-    timeZone: 'UTC'
-  });
-  return sample.replace(/04/, 'HH').replace(/4/, 'H').replace(/05/, 'MM').replace(/5/, 'M').replace(/AM|PM/, 'A');
-}
-
-const DateTimePickerTimeControl = [
-// Layout
-'layout-inline-row',
-// Interactivity
-'interactivity-auto',
-// Theme (focus)
-'focus:theme-border-2-inherit', 'dark:focus:theme-border-2-inherit-dark', 'focus:theme-border-underline'];
-const DateTimePickerTimeControlPlaceholder = [
-// Theme
-'theme-foreground-outline', 'dark:theme-foreground-outline-dark'];
-
-var script$1 = defineComponent({
-  name: 'OrDateTimePickerTimeControl',
-  model: {
-    prop: 'modelValue',
-    event: 'update:modelValue'
-  },
-  props: {
-    modelValue: {
-      type: Date,
-      default: undefined
-    },
-    required: {
-      type: Boolean,
-      default: false
-    },
-    readonly: {
-      type: Boolean,
-      default: false
-    },
-    disabled: {
-      type: Boolean,
-      default: false
-    }
-  },
-  expose: ['root'],
-  setup(props, context) {
-    // Refs
-    const root = ref();
-    // Styles
-    const rootStyles = computed(() => ['or-date-time-picker-time-control-v3', ...DateTimePickerTimeControl]);
-    const placeholderStyles = computed(() => [...DateTimePickerTimeControlPlaceholder]);
-    // State
-    const proxyModelValue = computed({
-      get: () => props.modelValue,
-      set: value => {
-        context.emit('update:modelValue', value);
-      }
-    });
-    const placeholder = useTimePlaceholder();
-    // Methods
-    function formatModelValue(value) {
-      return value.toLocaleString(navigator.language, {
-        timeStyle: 'short',
-        timeZone: 'UTC'
-      });
-    }
-    return {
-      root,
-      rootStyles,
-      placeholderStyles,
-      proxyModelValue,
-      placeholder,
-      formatModelValue
-    };
-  }
-});
-
-const _hoisted_1 = ["contenteditable", "required", "readonly", "disabled"];
-const _hoisted_2 = ["disabled"];
-function render$1(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("div", {
-    ref: "root",
-    class: normalizeClass(_ctx.rootStyles),
-    contenteditable: !_ctx.disabled ? '' : null,
-    required: _ctx.required ? '' : null,
-    readonly: _ctx.readonly ? '' : null,
-    disabled: _ctx.disabled ? '' : null
-  }, [_ctx.proxyModelValue ? (openBlock(), createElementBlock(Fragment, {
-    key: 0
-  }, [createTextVNode(toDisplayString(_ctx.formatModelValue(_ctx.proxyModelValue)), 1 /* TEXT */)], 64 /* STABLE_FRAGMENT */)) : (openBlock(), createElementBlock("span", {
-    key: 1,
-    class: normalizeClass(_ctx.placeholderStyles),
-    disabled: _ctx.disabled ? '' : null
-  }, toDisplayString(_ctx.placeholder), 11 /* TEXT, CLASS, PROPS */, _hoisted_2))], 10 /* CLASS, PROPS */, _hoisted_1);
-}
-
-script$1.render = render$1;
-script$1.__file = "src/components/or-date-time-picker-v3/partials/or-date-time-picker-time-control/OrDateTimePickerTimeControl.vue";
-
-const DateTimePickerTimeSelect = [
-// Layout
-'layout-row justify-center',
-// Spacing
-'px-md', 'py-md', 'gap-sm',
-// Typography
-'typography-body-2-regular',
-// Theme
-'theme-foreground-default', 'dark:theme-foreground-default-dark'];
-const DateTimePickerTimeSelectButtonGroup = [
-// Layout
-'layout-column',
-// Box
-'h-[294px] md:h-[238px]',
-// Overflow
-'overflow-x-hidden', 'overflow-y-auto'];
-const DateTimePickerTimeSelectButtonGroupItem = [
-// Box
-'!min-w-fit',
-// Typography
-'typography-caption-regular'];
-
-var script = defineComponent({
-  name: 'OrDateTimePickerTimeSelect',
-  components: {
-    OrButton: script$2
-  },
-  model: {
-    prop: 'modelValue',
-    event: 'update:modelValue'
-  },
-  props: {
-    modelValue: {
-      type: Date,
-      default: undefined
-    },
-    initialValue: {
-      type: Date,
-      required: true
-    },
-    hoursFilter: {
-      type: Function,
-      default: undefined
-    },
-    minutesFilter: {
-      type: Function,
-      default: undefined
-    }
-  },
-  emits: ['update:modelValue'],
-  expose: ['root'],
-  setup(props, context) {
-    // Refs
-    const root = ref();
-    // Styles
-    const rootStyles = computed(() => ['or-date-time-picker-time-select-v3', ...DateTimePickerTimeSelect]);
-    const buttonGroupStyles = computed(() => [...DateTimePickerTimeSelectButtonGroup]);
-    const buttonGroupItemStyles = computed(() => [...DateTimePickerTimeSelectButtonGroupItem]);
-    // State
-    const proxyModelValue = computed({
-      get: () => {
-        var _a;
-        return (_a = props.modelValue) !== null && _a !== void 0 ? _a : props.initialValue;
-      },
-      set: value => {
-        context.emit('update:modelValue', value);
-      }
-    });
-    const hoursOptions = computed(() => {
-      return Array.from({
-        length: 24
-      }, (_value, index) => {
-        const value = index;
-        return new Date(Date.UTC(proxyModelValue.value.getUTCFullYear(), proxyModelValue.value.getUTCMonth(), proxyModelValue.value.getUTCDate(), value, proxyModelValue.value.getUTCMinutes()));
-      });
-    });
-    const minutesOptions = computed(() => {
-      return Array.from({
-        length: 60
-      }, (_value, index) => {
-        const value = index;
-        return new Date(Date.UTC(proxyModelValue.value.getUTCFullYear(), proxyModelValue.value.getUTCMonth(), proxyModelValue.value.getUTCDate(), proxyModelValue.value.getUTCHours(), value));
-      });
-    });
-    // Methods
-    function formatHours(value) {
-      return value.toLocaleString(navigator.language, {
-        hour: 'numeric',
-        timeZone: 'UTC'
-      });
-    }
-    function formatMinutes(value) {
-      return String(value.getUTCMinutes()).padStart(2, '0');
-    }
-    return {
-      root,
-      rootStyles,
-      buttonGroupStyles,
-      buttonGroupItemStyles,
-      proxyModelValue,
-      hoursOptions,
-      minutesOptions,
-      formatHours,
-      formatMinutes
-    };
-  }
-});
-
-function render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_OrButton = resolveComponent("OrButton");
-  return openBlock(), createElementBlock("div", {
-    ref: "root",
-    class: normalizeClass(_ctx.rootStyles)
-  }, [createElementVNode("div", {
-    class: normalizeClass(_ctx.buttonGroupStyles)
-  }, [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.hoursOptions, value => {
-    return openBlock(), createBlock(_component_OrButton, {
-      key: Number(value),
-      class: normalizeClass(_ctx.buttonGroupItemStyles),
-      variant: Number(value) === Number(_ctx.proxyModelValue) ? 'contained' : 'text',
-      color: Number(value) === Number(_ctx.proxyModelValue) ? 'primary' : 'inherit',
-      disabled: _ctx.hoursFilter && !_ctx.hoursFilter(value),
-      onClick: withModifiers($event => _ctx.proxyModelValue = value, ["stop"])
-    }, {
-      default: withCtx(() => [createTextVNode(toDisplayString(_ctx.formatHours(value)), 1 /* TEXT */)]),
-
-      _: 2 /* DYNAMIC */
-    }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["class", "variant", "color", "disabled", "onClick"]);
-  }), 128 /* KEYED_FRAGMENT */))], 2 /* CLASS */), createTextVNode(" : "), createElementVNode("div", {
-    class: normalizeClass(_ctx.buttonGroupStyles)
-  }, [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.minutesOptions, value => {
-    return openBlock(), createBlock(_component_OrButton, {
-      key: Number(value),
-      class: normalizeClass(_ctx.buttonGroupItemStyles),
-      variant: Number(value) === Number(_ctx.proxyModelValue) ? 'contained' : 'text',
-      color: Number(value) === Number(_ctx.proxyModelValue) ? 'primary' : 'inherit',
-      disabled: _ctx.minutesFilter && !_ctx.minutesFilter(value),
-      onClick: withModifiers($event => _ctx.proxyModelValue = value, ["stop"])
-    }, {
-      default: withCtx(() => [createTextVNode(toDisplayString(_ctx.formatMinutes(value)), 1 /* TEXT */)]),
-
-      _: 2 /* DYNAMIC */
-    }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["class", "variant", "color", "disabled", "onClick"]);
-  }), 128 /* KEYED_FRAGMENT */))], 2 /* CLASS */)], 2 /* CLASS */);
-}
-
-script.render = render;
-script.__file = "src/components/or-date-time-picker-v3/partials/or-date-time-picker-time-select/OrDateTimePickerTimeSelect.vue";
-
-export { script as a, script$1 as s };

package/dist/esm/v3/OrTree-b4276dfb.js

@@ -1,204 +0,0 @@
-import { defineComponent, ref, computed, watch, onMounted, unref } from 'vue-demi';
-import { useToggle } from '@vueuse/core';
-import { s as script$2 } from './OrButton-c2b6aa9e.js';
-import { s as script$3 } from './OrIcon-62793572.js';
-import { resolveComponent, openBlock, createElementBlock, createElementVNode, normalizeClass, withModifiers, createBlock, withCtx, createVNode, createCommentVNode, renderSlot, normalizeProps, guardReactiveProps, Fragment, renderList, createTextVNode, toDisplayString } from 'vue';
-import { s as script$4 } from './OrLabel-4da56db0.js';
-
-var script$1 = defineComponent({
-  name: 'OrTreeNode',
-  components: {
-    OrButton: script$2,
-    OrIcon: script$3
-  },
-  props: {
-    node: {
-      type: Object,
-      required: true
-    },
-    collapsible: {
-      type: Boolean,
-      default: false
-    },
-    expanded: {
-      type: Boolean,
-      default: true
-    },
-    depth: {
-      type: Number,
-      default: 1
-    },
-    draggable: {
-      type: Boolean,
-      default: false
-    }
-  },
-  setup(props) {
-    const root = ref(null);
-    const nodeRoot = ref(null);
-    const hover = ref(false);
-    const dragOver = ref(false);
-    const draged = ref(false);
-    const hasChildren = computed(() => !!props.node.children && props.node.children.length > 0);
-    const [isOpen, setIsOpen] = useToggle(props.expanded);
-    watch(() => props.expanded, value => {
-      if (value !== undefined) {
-        setIsOpen(value);
-      }
-    }, {
-      immediate: true
-    });
-    const applyPadding = value => {
-      const rootElement = unref(nodeRoot);
-      const padding = value * 20 - (props.collapsible ? 16 : 0);
-      Object.assign(rootElement.style, {
-        paddingLeft: `${padding}px`
-      });
-    };
-    watch(() => props.depth, value => {
-      applyPadding(value);
-    });
-    onMounted(() => {
-      applyPadding(props.depth);
-    });
-    const handleDrop = () => {
-      dragOver.value = false;
-    };
-    const nodeStyles = computed(() => ['layout-row', ...[hover.value ? ['bg-primary-opacity-0-08', 'dark:bg-primary-opacity-0-08-dark'] : []], ...[dragOver.value && !draged.value ? ['border-t-2', 'border-primary'] : []]]);
-    return {
-      root,
-      hasChildren,
-      isOpen,
-      setIsOpen,
-      nodeRoot,
-      hover,
-      draged,
-      handleDrop,
-      dragOver,
-      nodeStyles
-    };
-  }
-});
-
-const _hoisted_1$1 = {
-  ref: "root",
-  class: "or-tree-node-v3"
-};
-const _hoisted_2 = ["draggable"];
-function render$1(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_OrIcon = resolveComponent("OrIcon");
-  const _component_OrButton = resolveComponent("OrButton");
-  const _component_OrTreeNode = resolveComponent("OrTreeNode", true);
-  return openBlock(), createElementBlock("div", _hoisted_1$1, [createElementVNode("div", {
-    ref: "nodeRoot",
-    class: normalizeClass(_ctx.nodeStyles),
-    draggable: _ctx.draggable ? true : undefined,
-    onMouseover: _cache[1] || (_cache[1] = $event => _ctx.hover = true),
-    onMouseleave: _cache[2] || (_cache[2] = $event => _ctx.hover = false),
-    onDragstart: _cache[3] || (_cache[3] = $event => _ctx.draged = true),
-    onDragend: _cache[4] || (_cache[4] = $event => _ctx.draged = false),
-    onDragover: _cache[5] || (_cache[5] = withModifiers(() => {}, ["prevent"])),
-    onDragenter: _cache[6] || (_cache[6] = $event => _ctx.dragOver = true),
-    onDragleave: _cache[7] || (_cache[7] = $event => _ctx.dragOver = false),
-    onDrop: _cache[8] || (_cache[8] = function () {
-      return _ctx.handleDrop && _ctx.handleDrop(...arguments);
-    })
-  }, [_ctx.hasChildren && _ctx.collapsible ? (openBlock(), createBlock(_component_OrButton, {
-    key: 0,
-    variant: "link",
-    onClick: _cache[0] || (_cache[0] = () => _ctx.setIsOpen(!_ctx.isOpen))
-  }, {
-    default: withCtx(() => [createVNode(_component_OrIcon, {
-      class: normalizeClass([_ctx.isOpen ? 'rotate-90' : 'rotate-0']),
-      icon: "arrow_right",
-      size: "l"
-    }, null, 8 /* PROPS */, ["class"])]),
-    _: 1 /* STABLE */
-  })) : createCommentVNode("v-if", true), renderSlot(_ctx.$slots, "node", normalizeProps(guardReactiveProps({
-    node: _ctx.node,
-    hasChildren: _ctx.hasChildren,
-    isOpen: _ctx.isOpen
-  })))], 42 /* CLASS, PROPS, HYDRATE_EVENTS */, _hoisted_2), _ctx.hasChildren && _ctx.isOpen ? (openBlock(true), createElementBlock(Fragment, {
-    key: 0
-  }, renderList(_ctx.node.children, child => {
-    return openBlock(), createBlock(_component_OrTreeNode, {
-      key: child.key,
-      node: child,
-      collapsible: _ctx.collapsible || child.collapsible,
-      depth: _ctx.depth + 1,
-      draggable: _ctx.draggable
-    }, {
-      node: withCtx(props => [renderSlot(_ctx.$slots, "node", normalizeProps(guardReactiveProps(props)))]),
-      _: 2 /* DYNAMIC */
-    }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["node", "collapsible", "depth", "draggable"]);
-  }), 128 /* KEYED_FRAGMENT */)) : createCommentVNode("v-if", true)], 512 /* NEED_PATCH */);
-}
-
-script$1.render = render$1;
-script$1.__file = "src/components/or-tree-v3/partials/or-tree-node/OrTreeNode.vue";
-
-var script = defineComponent({
-  name: 'OrTree',
-  components: {
-    OrLabel: script$4,
-    OrTreeNode: script$1
-  },
-  props: {
-    label: {
-      type: String,
-      default: ''
-    },
-    error: {
-      type: String,
-      default: ''
-    },
-    nodes: {
-      type: Array,
-      default: () => []
-    },
-    collapsible: {
-      type: Boolean,
-      default: false
-    },
-    draggable: {
-      type: Boolean,
-      default: false
-    }
-  },
-  setup() {
-    const root = ref(null);
-    return {
-      root
-    };
-  }
-});
-
-const _hoisted_1 = {
-  ref: "root"
-};
-function render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_or_label = resolveComponent("or-label");
-  const _component_OrTreeNode = resolveComponent("OrTreeNode");
-  return openBlock(), createElementBlock("div", _hoisted_1, [_ctx.label ? (openBlock(), createBlock(_component_or_label, {
-    key: 0
-  }, {
-    default: withCtx(() => [createTextVNode(toDisplayString(_ctx.label), 1 /* TEXT */)]),
-
-    _: 1 /* STABLE */
-  })) : createCommentVNode("v-if", true), (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.nodes, item => {
-    return openBlock(), createBlock(_component_OrTreeNode, {
-      key: item.key,
-      node: item,
-      collapsible: _ctx.collapsible || item.collapsible,
-      draggable: _ctx.draggable
-    }, {
-      node: withCtx(props => [renderSlot(_ctx.$slots, "node", normalizeProps(guardReactiveProps(props)))]),
-      _: 2 /* DYNAMIC */
-    }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["node", "collapsible", "draggable"]);
-  }), 128 /* KEYED_FRAGMENT */))], 512 /* NEED_PATCH */);
-}
-
-script.render = render;
-script.__file = "src/components/or-tree-v3/OrTree.vue";
-
-export { script as s };

package/dist/esm/v3/components/or-tree-v3/OrTree.vue.d.ts

@@ -1,54 +0,0 @@
-import { PropType } from 'vue-demi';
-import { TreeNode } from './types';
-declare const _default: import("vue-demi").DefineComponent<{
-    label: {
-        type: StringConstructor;
-        default: string;
-    };
-    error: {
-        type: StringConstructor;
-        default: string;
-    };
-    nodes: {
-        type: PropType<TreeNode[]>;
-        default: () => never[];
-    };
-    collapsible: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    draggable: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}, {
-    root: import("vue-demi").Ref<HTMLElement | null>;
-}, unknown, {}, {}, import("vue-demi").ComponentOptionsMixin, import("vue-demi").ComponentOptionsMixin, {}, string, import("vue-demi").VNodeProps & import("vue-demi").AllowedComponentProps & import("vue-demi").ComponentCustomProps, Readonly<import("vue-demi").ExtractPropTypes<{
-    label: {
-        type: StringConstructor;
-        default: string;
-    };
-    error: {
-        type: StringConstructor;
-        default: string;
-    };
-    nodes: {
-        type: PropType<TreeNode[]>;
-        default: () => never[];
-    };
-    collapsible: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    draggable: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}>>, {
-    label: string;
-    error: string;
-    nodes: TreeNode[];
-    collapsible: boolean;
-    draggable: boolean;
-}>;
-export default _default;

package/dist/esm/v3/components/or-tree-v3/index.d.ts

@@ -1 +0,0 @@
-export { default as OrTreeV3 } from './OrTree.vue';

package/dist/esm/v3/components/or-tree-v3/index.js

@@ -1,8 +0,0 @@
-export { s as OrTreeV3 } from '../../OrTree-b4276dfb.js';
-import 'vue-demi';
-import '@vueuse/core';
-import '../../OrButton-c2b6aa9e.js';
-import '../../OrLoader-b79022da.js';
-import 'vue';
-import '../../OrIcon-62793572.js';
-import '../../OrLabel-4da56db0.js';

package/dist/esm/v3/components/or-tree-v3/partials/or-tree-node/OrTreeNode.vue.d.ts

@@ -1,62 +0,0 @@
-import { PropType } from 'vue-demi';
-import { TreeNode } from '../../types';
-declare const _default: import("vue-demi").DefineComponent<{
-    node: {
-        type: PropType<TreeNode>;
-        required: true;
-    };
-    collapsible: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    expanded: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    depth: {
-        type: NumberConstructor;
-        default: number;
-    };
-    draggable: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}, {
-    root: import("vue-demi").Ref<HTMLElement | null>;
-    hasChildren: import("vue-demi").ComputedRef<boolean>;
-    isOpen: import("vue-demi").Ref<boolean>;
-    setIsOpen: (value?: boolean | undefined) => boolean;
-    nodeRoot: import("vue-demi").Ref<HTMLElement | null>;
-    hover: import("vue-demi").Ref<boolean>;
-    draged: import("vue-demi").Ref<boolean>;
-    handleDrop: () => void;
-    dragOver: import("vue-demi").Ref<boolean>;
-    nodeStyles: import("vue-demi").ComputedRef<(string | string[])[]>;
-}, unknown, {}, {}, import("vue-demi").ComponentOptionsMixin, import("vue-demi").ComponentOptionsMixin, {}, string, import("vue-demi").VNodeProps & import("vue-demi").AllowedComponentProps & import("vue-demi").ComponentCustomProps, Readonly<import("vue-demi").ExtractPropTypes<{
-    node: {
-        type: PropType<TreeNode>;
-        required: true;
-    };
-    collapsible: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    expanded: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    depth: {
-        type: NumberConstructor;
-        default: number;
-    };
-    draggable: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}>>, {
-    collapsible: boolean;
-    expanded: boolean;
-    depth: number;
-    draggable: boolean;
-}>;
-export default _default;

package/dist/esm/v3/components/or-tree-v3/types.d.ts

@@ -1,7 +0,0 @@
-export type TreeNode = {
-    key: string;
-    children?: TreeNode[];
-    collapsible?: boolean;
-    expanded?: boolean;
-    draggable?: boolean;
-};

package/src/components/or-tree-v3/OrTree.vue

@@ -1,63 +0,0 @@
-<template>
-  <div ref="root">
-    <or-label v-if="label">
-      {{ label }}
-    </or-label>
-    <OrTreeNode
-      v-for="item in nodes"
-      :key="item.key"
-      :node="item"
-      :collapsible="collapsible || item.collapsible"
-      :draggable="draggable"
-    >
-      <template v-slot:node="props">
-        <slot
-          name="node"
-          v-bind="props"
-        />
-      </template>
-    </OrTreeNode>
-  </div>
-</template>
-<script lang="ts">
-import { defineComponent, PropType, ref } from 'vue-demi';
-import OrTreeNode from './partials/or-tree-node/OrTreeNode.vue';
-import { TreeNode } from './types';
-import { OrLabelV3 as OrLabel } from '../or-label-v3';
-
-export default defineComponent({
-  name: 'OrTree',
-  components: {
-    OrLabel,
-    OrTreeNode,
-  },
-  props: {
-    label: {
-      type: String,
-      default: '',
-    },
-    error: {
-      type: String,
-      default: '',
-    },
-    nodes: {
-      type: Array as PropType<TreeNode[]>,
-      default: () => [],
-    },
-    collapsible: {
-      type: Boolean,
-      default: false,
-    },
-    draggable: {
-      type: Boolean,
-      default: false,
-    },
-  },
-  setup() {
-    const root = ref<HTMLElement | null>(null);
-    return {
-      root,
-    };
-  },
-});
-</script>

package/src/components/or-tree-v3/index.ts

@@ -1 +0,0 @@
-export { default as OrTreeV3 } from './OrTree.vue';