@onereach/ui-components 7.1.0 → 7.1.1-beta.3560.0

package/dist/bundled/v3/{OrCardCollection.vue_vue_type_script_lang-c196d039.js → OrCardCollection.vue_vue_type_script_lang-2ce06287.js}

@@ -4,10 +4,10 @@ import { openBlock, createElementBlock, normalizeClass, Fragment, renderList, re
 import { gridView, defaultViewModes } from './components/OrCardCollectionV3/props.js';
 import './components/OrIconButtonV3/OrIconButton.js';
 import './components/OrSortingV3/OrSorting.js';
-import { s as script$3 } from './OrSorting.vue_vue_type_script_lang-9f514be8.js';
+import { s as script$3 } from './OrSorting.vue_vue_type_script_lang-5f90a4ca.js';
 import './components/OrSearchV3/OrSearch.js';
-import { s as script$4 } from './OrSearch.vue_vue_type_script_lang-55ed983e.js';
-import { s as script$2 } from './OrIconButton.vue_vue_type_script_lang-8a4dcc47.js';
+import { s as script$4 } from './OrSearch.vue_vue_type_script_lang-d5d5ced4.js';
+import { s as script$2 } from './OrIconButton.vue_vue_type_script_lang-14f36240.js';
 
 var script$1 = defineComponent({
   name: 'OrCardCollectionView',

package/dist/bundled/v3/{OrCode.vue_vue_type_script_lang-da0fa78f.js → OrCode.vue_vue_type_script_lang-ed0c782e.js}

@@ -13,9 +13,9 @@ import { s as script$4 } from './OrInputBox.vue_vue_type_script_lang-989d5ee6.js
 import { s as script$5 } from './OrLabel.vue_vue_type_script_lang-e2bcff17.js';
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, createVNode, withCtx, renderSlot, createTextVNode, toDisplayString, createElementVNode, withDirectives, createBlock, createCommentVNode, vShow } from 'vue';
 import './components/OrModalV3/OrModal.js';
-import { s as script$6 } from './OrModal.vue_vue_type_script_lang-7ed03f88.js';
+import { s as script$6 } from './OrModal.vue_vue_type_script_lang-051dddcb.js';
 import './components/OrIconButtonV3/OrIconButton.js';
-import { s as script$7 } from './OrIconButton.vue_vue_type_script_lang-8a4dcc47.js';
+import { s as script$7 } from './OrIconButton.vue_vue_type_script_lang-14f36240.js';
 import { useIdAttribute } from './hooks/useIdAttribute.js';
 import { useControlAttributes } from './hooks/useControlAttributes.js';
 import { useValidationAttributes } from './hooks/useValidationAttributes.js';

package/dist/bundled/v3/{OrConfirm.vue_vue_type_script_lang-16732e9d.js → OrConfirm.vue_vue_type_script_lang-3717bdc9.js}

@@ -9,7 +9,7 @@ import './components/OrInputV3/OrInput.js';
 import { ButtonColor } from './components/OrButtonV3/props.js';
 import { s as script$1 } from './OrOverlay.vue_vue_type_script_lang-5b1f4a36.js';
 import { s as script$2 } from './OrButton.vue_vue_type_script_lang-0f7bda53.js';
-import { s as script$3 } from './OrInput.vue_vue_type_script_lang-10d8887d.js';
+import { s as script$3 } from './OrInput.vue_vue_type_script_lang-bbf2d591.js';
 import { usePopoverState } from './hooks/usePopoverState.js';
 import { w as whenever } from './index-6cbf1493.js';
 

package/dist/bundled/v3/{OrContextMenu.vue_vue_type_script_lang-9965a7ee.js → OrContextMenu.vue_vue_type_script_lang-faabc0aa.js}

@@ -1,6 +1,6 @@
 import { defineComponent, ref, watch } from 'vue-demi';
 import './components/OrMenuV3/OrMenu.js';
-import { s as script$1 } from './OrMenu.vue_vue_type_script_lang-af4f2a40.js';
+import { s as script$1 } from './OrMenu.vue_vue_type_script_lang-bb8832d7.js';
 import { PopoverPlacement } from './components/OrPopoverV3/props.js';
 import { usePopoverState } from './hooks/usePopoverState.js';
 

package/dist/bundled/v3/{OrDatePicker.vue_vue_type_script_lang-69238079.js → OrDatePicker.vue_vue_type_script_lang-3cb0cf6b.js}

@@ -1,6 +1,6 @@
 import { defineComponent, ref, computed, watch, toRef } from 'vue-demi';
 import { DatePicker, DatePickerPopover } from './components/OrDatePickerV3/styles.js';
-import './OrDateTimePickerPopoverHeader-382f7eb9.js';
+import './OrDateTimePickerPopoverHeader-adf15a04.js';
 import './components/OrErrorV3/OrError.js';
 import './components/OrHintV3/OrHint.js';
 import './components/OrIconV3/OrIcon.js';
@@ -8,15 +8,15 @@ import './components/OrIconButtonV3/OrIconButton.js';
 import './components/OrInputBoxV3/OrInputBox.js';
 import './components/OrLabelV3/OrLabel.js';
 import './components/OrPopoverV3/OrPopover.js';
-import { s as script$1, a as script$2, b as script$4 } from './OrDateTimePickerMonthSelect.vue_vue_type_script_lang-fbc84f84.js';
+import { s as script$1, a as script$2, b as script$4 } from './OrDateTimePickerMonthSelect.vue_vue_type_script_lang-944f5be2.js';
 import { s as script$3, a as script$5, b as script$6 } from './OrDateTimePickerPopoverHeader.vue_vue_type_script_lang-1f596d82.js';
 import { s as script$7 } from './OrError.vue_vue_type_script_lang-fcf91781.js';
 import { s as script$8 } from './OrHint.vue_vue_type_script_lang-0ab8b932.js';
 import { s as script$9 } from './OrIcon.vue_vue_type_script_lang-bc674d9e.js';
-import { s as script$a } from './OrIconButton.vue_vue_type_script_lang-8a4dcc47.js';
+import { s as script$a } from './OrIconButton.vue_vue_type_script_lang-14f36240.js';
 import { s as script$b } from './OrInputBox.vue_vue_type_script_lang-989d5ee6.js';
 import { s as script$c } from './OrLabel.vue_vue_type_script_lang-e2bcff17.js';
-import { s as script$d } from './OrPopover.vue_vue_type_script_lang-62552b5d.js';
+import { s as script$d } from './OrPopover.vue_vue_type_script_lang-f80a7a1b.js';
 import { DropdownClose } from './directives/dropdown-close.js';
 import { DropdownOpen } from './directives/dropdown-open.js';
 import { InputBoxSize } from './components/OrInputBoxV3/props.js';

package/dist/bundled/v3/{OrDateRangePicker.vue_vue_type_script_lang-dac15e2a.js → OrDateRangePicker.vue_vue_type_script_lang-8fc45f7e.js}

@@ -8,15 +8,15 @@ import './components/OrInputBoxV3/OrInputBox.js';
 import './components/OrLabelV3/OrLabel.js';
 import './components/OrPopoverV3/OrPopover.js';
 import { getNextMonthDate } from './components/OrDateTimePickerV3/utils/getNextMonthDate.js';
-import { s as script$1, a as script$2, b as script$4 } from './OrDateTimePickerMonthSelect.vue_vue_type_script_lang-fbc84f84.js';
+import { s as script$1, a as script$2, b as script$4 } from './OrDateTimePickerMonthSelect.vue_vue_type_script_lang-944f5be2.js';
 import { s as script$3, a as script$5, b as script$6 } from './OrDateTimePickerPopoverHeader.vue_vue_type_script_lang-1f596d82.js';
 import { s as script$7 } from './OrError.vue_vue_type_script_lang-fcf91781.js';
 import { s as script$8 } from './OrHint.vue_vue_type_script_lang-0ab8b932.js';
 import { s as script$9 } from './OrIcon.vue_vue_type_script_lang-bc674d9e.js';
-import { s as script$a } from './OrIconButton.vue_vue_type_script_lang-8a4dcc47.js';
+import { s as script$a } from './OrIconButton.vue_vue_type_script_lang-14f36240.js';
 import { s as script$b } from './OrInputBox.vue_vue_type_script_lang-989d5ee6.js';
 import { s as script$c } from './OrLabel.vue_vue_type_script_lang-e2bcff17.js';
-import { s as script$d } from './OrPopover.vue_vue_type_script_lang-62552b5d.js';
+import { s as script$d } from './OrPopover.vue_vue_type_script_lang-f80a7a1b.js';
 import { DropdownClose } from './directives/dropdown-close.js';
 import { DropdownOpen } from './directives/dropdown-open.js';
 import { InputBoxSize } from './components/OrInputBoxV3/props.js';

package/dist/bundled/v3/{OrDateTimePicker.vue_vue_type_script_lang-936adb1b.js → OrDateTimePicker.vue_vue_type_script_lang-8e1cb539.js}

@@ -1,9 +1,9 @@
 import { defineComponent, ref, computed, watch, toRef } from 'vue-demi';
-import './OrDateTimePickerPopoverHeader-382f7eb9.js';
+import './OrDateTimePickerPopoverHeader-adf15a04.js';
 import './OrDateTimePickerTimeSelect-2f107e35.js';
 import { DateTimePickerTimeFormat } from './components/OrDateTimePickerV3/props.js';
 import { DateTimePicker, DateTimePickerDatePopover, DateTimePickerTimePopover } from './components/OrDateTimePickerV3/styles.js';
-import { s as script$1, a as script$2, b as script$4 } from './OrDateTimePickerMonthSelect.vue_vue_type_script_lang-fbc84f84.js';
+import { s as script$1, a as script$2, b as script$4 } from './OrDateTimePickerMonthSelect.vue_vue_type_script_lang-944f5be2.js';
 import { s as script$3, a as script$5, b as script$6 } from './OrDateTimePickerPopoverHeader.vue_vue_type_script_lang-1f596d82.js';
 import { s as script$7, a as script$8 } from './OrDateTimePickerTimeSelect.vue_vue_type_script_lang-c8d018a1.js';
 import './components/OrErrorV3/OrError.js';
@@ -19,10 +19,10 @@ import { getCurrentDate } from './components/OrDateTimePickerV3/utils/getCurrent
 import { s as script$9 } from './OrError.vue_vue_type_script_lang-fcf91781.js';
 import { s as script$a } from './OrHint.vue_vue_type_script_lang-0ab8b932.js';
 import { s as script$b } from './OrIcon.vue_vue_type_script_lang-bc674d9e.js';
-import { s as script$c } from './OrIconButton.vue_vue_type_script_lang-8a4dcc47.js';
+import { s as script$c } from './OrIconButton.vue_vue_type_script_lang-14f36240.js';
 import { s as script$d } from './OrInputBox.vue_vue_type_script_lang-989d5ee6.js';
 import { s as script$e } from './OrLabel.vue_vue_type_script_lang-e2bcff17.js';
-import { s as script$f } from './OrPopover.vue_vue_type_script_lang-62552b5d.js';
+import { s as script$f } from './OrPopover.vue_vue_type_script_lang-f80a7a1b.js';
 import { InputBoxSize } from './components/OrInputBoxV3/props.js';
 import { useProxyModelValue } from './hooks/useProxyModelValue.js';
 

package/dist/bundled/v3/{OrDateTimePickerMonthSelect.vue_vue_type_script_lang-fbc84f84.js → OrDateTimePickerMonthSelect.vue_vue_type_script_lang-944f5be2.js}

@@ -9,8 +9,8 @@ import './components/OrIconButtonV3/OrIconButton.js';
 import './components/OrMenuV3/OrMenu.js';
 import './components/OrMenuItemV3/OrMenuItem.js';
 import { s as script$4 } from './OrIcon.vue_vue_type_script_lang-bc674d9e.js';
-import { s as script$5 } from './OrIconButton.vue_vue_type_script_lang-8a4dcc47.js';
-import { s as script$6 } from './OrMenu.vue_vue_type_script_lang-af4f2a40.js';
+import { s as script$5 } from './OrIconButton.vue_vue_type_script_lang-14f36240.js';
+import { s as script$6 } from './OrMenu.vue_vue_type_script_lang-bb8832d7.js';
 import { s as script$7 } from './OrMenuItem.vue_vue_type_script_lang-1e9ee207.js';
 
 const DateTimePickerDateControl = [

package/dist/bundled/v3/{OrDateTimePickerPopoverHeader-382f7eb9.js → OrDateTimePickerPopoverHeader-adf15a04.js}

@@ -1,4 +1,4 @@
-import { s as script, a as script$1, b as script$3 } from './OrDateTimePickerMonthSelect.vue_vue_type_script_lang-fbc84f84.js';
+import { s as script, a as script$1, b as script$3 } from './OrDateTimePickerMonthSelect.vue_vue_type_script_lang-944f5be2.js';
 import { openBlock, createElementBlock, normalizeClass, Fragment, createTextVNode, toDisplayString, resolveComponent, createElementVNode, renderList, createBlock, withModifiers, withCtx, createVNode, renderSlot } from 'vue';
 import { s as script$2, a as script$4, b as script$5 } from './OrDateTimePickerPopoverHeader.vue_vue_type_script_lang-1f596d82.js';
 

package/dist/bundled/v3/{OrIconButton.vue_vue_type_script_lang-8a4dcc47.js → OrIconButton.vue_vue_type_script_lang-14f36240.js}

@@ -3,7 +3,7 @@ import { IconButtonColor } from './components/OrIconButtonV3/props.js';
 import { IconButton, IconButtonColors } from './components/OrIconButtonV3/styles.js';
 import './components/OrIconV3/OrIcon.js';
 import './components/OrTooltipV3/OrTooltip.js';
-import { s as script$2 } from './OrTooltip.vue_vue_type_script_lang-8af0ce75.js';
+import { s as script$2 } from './OrTooltip.vue_vue_type_script_lang-46e8aa97.js';
 import { IconSize, IconVariant } from './components/OrIconV3/props.js';
 import { s as script$1 } from './OrIcon.vue_vue_type_script_lang-bc674d9e.js';
 

package/dist/bundled/v3/{OrInlineInput.vue_vue_type_script_lang-873efacb.js → OrInlineInput.vue_vue_type_script_lang-a657b7b4.js}

@@ -9,7 +9,7 @@ import { s as script$4 } from './OrInlineInputBox.vue_vue_type_script_lang-fe99c
 import { InlineInputBoxSize } from './components/OrInlineInputBoxV3/props.js';
 import { s as script$1 } from './OrError.vue_vue_type_script_lang-fcf91781.js';
 import { s as script$2 } from './OrHint.vue_vue_type_script_lang-0ab8b932.js';
-import { s as script$3 } from './OrIconButton.vue_vue_type_script_lang-8a4dcc47.js';
+import { s as script$3 } from './OrIconButton.vue_vue_type_script_lang-14f36240.js';
 import { useIdAttribute } from './hooks/useIdAttribute.js';
 import { useControlAttributes } from './hooks/useControlAttributes.js';
 import { useValidationAttributes } from './hooks/useValidationAttributes.js';

package/dist/bundled/v3/{OrInlineTextarea.vue_vue_type_script_lang-3bb287c6.js → OrInlineTextarea.vue_vue_type_script_lang-d0007d91.js}

@@ -6,7 +6,7 @@ import './components/OrIconButtonV3/OrIconButton.js';
 import './components/OrInlineInputBoxV3/OrInlineInputBox.js';
 import { s as script$1 } from './OrError.vue_vue_type_script_lang-fcf91781.js';
 import { s as script$2 } from './OrHint.vue_vue_type_script_lang-0ab8b932.js';
-import { s as script$3 } from './OrIconButton.vue_vue_type_script_lang-8a4dcc47.js';
+import { s as script$3 } from './OrIconButton.vue_vue_type_script_lang-14f36240.js';
 import { s as script$4 } from './OrInlineInputBox.vue_vue_type_script_lang-fe99c485.js';
 import { useIdAttribute } from './hooks/useIdAttribute.js';
 import { useControlAttributes } from './hooks/useControlAttributes.js';

package/dist/bundled/v3/{OrInput.vue_vue_type_script_lang-10d8887d.js → OrInput.vue_vue_type_script_lang-bbf2d591.js}

@@ -7,7 +7,7 @@ import './components/OrHintV3/OrHint.js';
 import { s as script$2 } from './OrHint.vue_vue_type_script_lang-0ab8b932.js';
 import './components/OrIconV3/OrIcon.js';
 import './components/OrIconButtonV3/OrIconButton.js';
-import { s as script$4 } from './OrIconButton.vue_vue_type_script_lang-8a4dcc47.js';
+import { s as script$4 } from './OrIconButton.vue_vue_type_script_lang-14f36240.js';
 import './components/OrInputBoxV3/OrInputBox.js';
 import { s as script$5 } from './OrInputBox.vue_vue_type_script_lang-989d5ee6.js';
 import './components/OrLabelV3/OrLabel.js';

package/dist/bundled/v3/OrList.vue_vue_type_script_lang-6a8befb2.js

@@ -0,0 +1,208 @@
+import { S as Sortable } from './sortable.esm-11705107.js';
+import { v as v4 } from './v4-cf8987a3.js';
+import { defineComponent, ref, computed, toRef, watch } from 'vue-demi';
+import { openBlock, createElementBlock, normalizeClass, createElementVNode, renderSlot } from 'vue';
+import { List, ListContent } from './components/OrListV3/styles.js';
+import './components/OrIconButtonV3/OrIconButton.js';
+import './components/OrLabelV3/OrLabel.js';
+import { s as script$2 } from './OrIconButton.vue_vue_type_script_lang-14f36240.js';
+import { s as script$3 } from './OrLabel.vue_vue_type_script_lang-e2bcff17.js';
+import { useProxyModelValue } from './hooks/useProxyModelValue.js';
+
+const ListItem = [
+// Interactivity (draggable)
+'draggable:interactivity-drag',
+// Spacing
+'px-md md:px-sm', 'py-md md:py-sm',
+// Shape
+'rounded-md',
+// Theme (hover)
+'hover:theme-background-primary-translucent-1', 'dark:hover:theme-background-primary-translucent-1-dark',
+// Theme (focus)
+'focus-within:theme-outline-2-primary', 'dark:focus-within:theme-outline-2-primary-dark',
+// Theme (selected)
+'selected:theme-background-primary-translucent-3', 'dark:selected:theme-background-primary-translucent-3-dark'];
+const ListItemContent = [
+// Layout
+'layout-row',
+// Spacing
+'px-md md:px-sm', 'py-md md:py-sm', 'gap-sm'];
+
+var script$1 = defineComponent({
+  props: {
+    selected: {
+      type: Boolean,
+      default: false
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    draggable: {
+      type: Boolean,
+      default: false
+    }
+  },
+  setup() {
+    // Refs
+    const root = ref();
+    // Styles
+    const rootStyles = computed(() => ['or-list-item-v3', ...ListItem]);
+    const contentStyles = computed(() => [...ListItemContent]);
+    return {
+      root,
+      rootStyles,
+      contentStyles
+    };
+  }
+});
+
+const _hoisted_1 = ["selected", "disabled", "draggable"];
+const _hoisted_2 = ["disabled"];
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("div", {
+    ref: "root",
+    class: normalizeClass(_ctx.rootStyles),
+    selected: _ctx.selected,
+    disabled: _ctx.disabled,
+    draggable: _ctx.draggable
+  }, [createElementVNode("div", {
+    class: normalizeClass(_ctx.contentStyles),
+    disabled: _ctx.disabled
+  }, [renderSlot(_ctx.$slots, "default")], 10 /* CLASS, PROPS */, _hoisted_2)], 10 /* CLASS, PROPS */, _hoisted_1);
+}
+
+script$1.render = render;
+script$1.__file = "src/components/or-list-v3/partials/or-list-item/OrListItem.vue";
+
+var script = defineComponent({
+  components: {
+    OrIconButton: script$2,
+    OrLabel: script$3,
+    OrListItem: script$1
+  },
+  model: {
+    prop: 'modelValue',
+    event: 'update:modelValue'
+  },
+  props: {
+    modelValue: {
+      type: Array,
+      default: () => []
+    },
+    selection: {
+      type: Array,
+      default: () => []
+    },
+    itemFactory: {
+      type: Function,
+      default: () => ({})
+    },
+    label: {
+      type: String,
+      default: undefined
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    canAdd: {
+      type: Boolean,
+      default: true
+    },
+    canDelete: {
+      type: Boolean,
+      default: true
+    },
+    canReorder: {
+      type: Boolean,
+      default: true
+    }
+  },
+  emits: ['update:modelValue', 'before:add', 'before:delete', 'before:reorder', 'add', 'delete', 'reorder'],
+  expose: ['root'],
+  setup(props, context) {
+    // Refs
+    const root = ref();
+    const content = ref();
+    // Styles
+    const rootStyles = computed(() => ['or-list-v3', ...List]);
+    const contentStyles = computed(() => [...ListContent]);
+    // State
+    const proxyModelValue = useProxyModelValue(toRef(props, 'modelValue'), context.emit);
+    // Effects
+    // #region Sortable
+    let sortable;
+    watch([content, () => props.canReorder], _ref => {
+      let [content, canReorder] = _ref;
+      sortable === null || sortable === void 0 ? void 0 : sortable.destroy();
+      sortable = undefined;
+      if (content && canReorder) {
+        sortable = Sortable.create(content, {
+          disabled: props.disabled,
+          onUpdate: event => {
+            context.emit('before:reorder', proxyModelValue.value);
+            const nextModelValue = [...proxyModelValue.value];
+            const reorderedItem = nextModelValue.splice(event.oldIndex, 1)[0];
+            nextModelValue.splice(event.newIndex, 0, reorderedItem);
+            context.emit('reorder', reorderedItem, event.newIndex, event.oldIndex, proxyModelValue.value = nextModelValue);
+          }
+        });
+      }
+    });
+    watch(() => props.disabled, value => {
+      sortable === null || sortable === void 0 ? void 0 : sortable.option('disabled', value);
+    });
+    // #endregion
+    // Methods
+    function addItem() {
+      context.emit('before:add', proxyModelValue.value);
+      const addedItem = props.itemFactory();
+      const nextModelValue = [...proxyModelValue.value, addedItem];
+      context.emit('add', addedItem, nextModelValue.indexOf(addedItem), proxyModelValue.value = nextModelValue);
+    }
+    function deleteItem(index) {
+      context.emit('before:delete', proxyModelValue.value);
+      const deletedItem = proxyModelValue.value[index];
+      const nextModelValue = proxyModelValue.value.filter(item => item !== deletedItem);
+      context.emit('delete', deletedItem, index, proxyModelValue.value = nextModelValue);
+    }
+    // Handlers
+    // function onDragStart(event: DragEvent): void {
+    //   console.log('dragstart', event);
+    // }
+    // function onDragEnter(event: DragEvent): void {
+    //   console.log('dragenter', event);
+    // }
+    // function onDragOver(event: DragEvent): void {
+    //   console.log('dragover', event);
+    // }
+    // function onDragLeave(event: DragEvent): void {
+    //   console.log('dragleave', event);
+    // }
+    // function onDragEnd(event: DragEvent): void {
+    //   console.log('dragend', event);
+    // }
+    // function onDrop(event: DragEvent): void {
+    //   console.log('drop', event);
+    // }
+    return {
+      root,
+      content,
+      rootStyles,
+      contentStyles,
+      proxyModelValue,
+      addItem,
+      deleteItem,
+      // onDragStart,
+      // onDragEnter,
+      // onDragOver,
+      // onDragLeave,
+      // onDragEnd,
+      // onDrop,
+      uuid: v4
+    };
+  }
+});
+
+export { script$1 as a, script as s };