@onereach/ui-components 8.22.1 → 8.22.2

package/dist/esm/v3/{OrTags-b5c62b28.js → OrTags-b5aea0be.js}

@@ -7,7 +7,7 @@ import { s as script$1 } from './OrButton-9ca0dc8e.js';
 import { s as script$2 } from './OrPopover-1c87b4ed.js';
 import './dom-aecadd9a.js';
 import { s as script$3 } from './OrTag-1b111af7.js';
-import { resolveComponent, openBlock, createElementBlock, normalizeClass, Fragment, renderList, createBlock, mergeProps, withCtx, createTextVNode, toDisplayString, renderSlot, createCommentVNode, createVNode, withModifiers, createElementVNode } from 'vue';
+import { resolveComponent, openBlock, createElementBlock, normalizeClass, Fragment, renderList, createBlock, mergeProps, withCtx, renderSlot, createTextVNode, toDisplayString, createCommentVNode, createVNode, withModifiers, createElementVNode } from 'vue';
 
 var TagsOverflow;
 (function (TagsOverflow) {
@@ -195,7 +195,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
       class: ['max-w-full'],
       onReset: $event => _ctx.$emit('reset', item.value)
     }), {
-      default: withCtx(() => [createTextVNode(toDisplayString(item.label), 1 /* TEXT */)]),
+      default: withCtx(() => [renderSlot(_ctx.$slots, "tag", {
+        item: item
+      }, () => [createTextVNode(toDisplayString(item.label), 1 /* TEXT */)])]),
 
       _: 2 /* DYNAMIC */
     }, 1040 /* FULL_PROPS, DYNAMIC_SLOTS */, ["onReset"]);
@@ -231,13 +233,15 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         key: item.value,
         onReset: $event => _ctx.$emit('reset', item.value)
       }), {
-        default: withCtx(() => [createTextVNode(toDisplayString(item.label), 1 /* TEXT */)]),
+        default: withCtx(() => [renderSlot(_ctx.$slots, "tag", {
+          item: item
+        }, () => [createTextVNode(toDisplayString(item.label), 1 /* TEXT */)])]),
 
         _: 2 /* DYNAMIC */
       }, 1040 /* FULL_PROPS, DYNAMIC_SLOTS */, ["onReset"]);
     }), 128 /* KEYED_FRAGMENT */))], 2 /* CLASS */)]),
 
-    _: 1 /* STABLE */
+    _: 3 /* FORWARDED */
   }, 8 /* PROPS */, ["class", "custom-styles", "trigger"])], 64 /* STABLE_FRAGMENT */)) : createCommentVNode("v-if", true), _ctx.localOverflow != 'wrap' || _ctx.items.length === 0 ? renderSlot(_ctx.$slots, "tail", {
     key: 2
   }) : createCommentVNode("v-if", true)], 2 /* CLASS */);

package/dist/esm/v3/{color-6b0fc765.js → color-911f1122.js}

@@ -102,5 +102,9 @@ function generateHslFromString(str) {
 function hslToColorString(hsl) {
   return `hsl(${hsl.h}, ${hsl.s}%, ${hsl.l}%)`;
 }
+function generateColorFromString(str) {
+  let limits = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : HSL_LIMITS;
+  return hslToColorString(generateHslFromString(str, limits));
+}
 
-export { RX_QUERY_START as A, RX_SHORT_COLOR as B, RX_LONG_COLOR as C, hexToRgb as D, rgbToHex as E, generateHslFromString as F, hslToColorString as G, HSL_LIMITS as H, getHashOfString as I, normalize as J, RX_ARRAY_NOTATION as R, RX_BV_PREFIX as a, RX_DIGITS as b, RX_EXTENSION as c, RX_HASH as d, RX_HASH_ID as e, RX_HTML_TAGS as f, RX_HYPHENATE as g, RX_LOWER_UPPER as h, RX_NUMBER as i, RX_PLUS as j, RX_REGEXP_REPLACE as k, RX_SPACES as l, RX_SPACE_SPLIT as m, RX_STAR as n, RX_START_SPACE_WORD as o, RX_TRIM_LEFT as p, RX_TRIM_RIGHT as q, RX_UNDERSCORE as r, RX_UN_KEBAB as s, RX_ABBREVIATION_FROM_STRING as t, RX_DATE as u, RX_DATE_SPLIT as v, RX_TIME as w, RX_HREF as x, RX_ENCODED_COMMA as y, RX_ENCODE_REVERSE as z };
+export { RX_QUERY_START as A, RX_SHORT_COLOR as B, RX_LONG_COLOR as C, hexToRgb as D, rgbToHex as E, generateHslFromString as F, hslToColorString as G, HSL_LIMITS as H, generateColorFromString as I, getHashOfString as J, normalize as K, RX_ARRAY_NOTATION as R, RX_BV_PREFIX as a, RX_DIGITS as b, RX_EXTENSION as c, RX_HASH as d, RX_HASH_ID as e, RX_HTML_TAGS as f, RX_HYPHENATE as g, RX_LOWER_UPPER as h, RX_NUMBER as i, RX_PLUS as j, RX_REGEXP_REPLACE as k, RX_SPACES as l, RX_SPACE_SPLIT as m, RX_STAR as n, RX_START_SPACE_WORD as o, RX_TRIM_LEFT as p, RX_TRIM_RIGHT as q, RX_UNDERSCORE as r, RX_UN_KEBAB as s, RX_ABBREVIATION_FROM_STRING as t, RX_DATE as u, RX_DATE_SPLIT as v, RX_TIME as w, RX_HREF as x, RX_ENCODED_COMMA as y, RX_ENCODE_REVERSE as z };

package/dist/esm/v3/components/index.js

@@ -1,5 +1,5 @@
 export { O as OR_AVATAR_SIZE, s as OrAvatar } from '../OrAvatar-e79f6f21.js';
-export { a as AvatarColor, A as AvatarSize, s as OrAvatarV3 } from '../OrAvatar-b0179873.js';
+export { a as AvatarColor, A as AvatarSize, s as OrAvatarV3 } from '../OrAvatar-ae032fe2.js';
 export { B as BottomSheetVariant, s as OrBottomSheetV3 } from '../OrBottomSheet-e33d1de9.js';
 export { s as OrButton, a as OrButtonColors, b as OrButtonSizes, O as OrButtonViews } from '../OrButton-e5f925bb.js';
 export { s as OrButtonGroupV3 } from '../OrButtonGroup-2583d1d0.js';
@@ -101,7 +101,7 @@ export { s as OrSearch } from '../OrSearch-54a642d3.js';
 export { s as OrSearchV3 } from '../OrSearch-44810f4c.js';
 export { s as OrSegmentedControlV3, S as SegmentedControlSize } from '../OrSegmentedControl-08992fc7.js';
 export { s as OrSelect } from '../OrSelect-c87b9c23.js';
-export { s as OrSelectV3 } from '../OrSelect-7e9a8fa9.js';
+export { s as OrSelectV3 } from '../OrSelect-78a9da6c.js';
 export { s as OrSidebar, O as OrSidebarSide } from '../OrSidebar-4ab42b93.js';
 export { S as OrSidebarPlacement, s as OrSidebarV3, S as SidebarPlacement } from '../OrSidebar-a6d3d1be.js';
 export { s as OrSkeletonCircle } from '../OrSkeletonCircle-66e175a0.js';
@@ -122,10 +122,10 @@ export { s as OrTabHeaderItem } from '../OrTabHeaderItem-c2af7ca3.js';
 export { s as OrTabV3 } from '../OrTab-42be32d1.js';
 export { s as OrTabs } from '../OrTabs-3da3ea89.js';
 export { s as OrTabsV3, T as TabsVariant } from '../OrTabs-b0c9d2a5.js';
-export { s as OrTag } from '../OrTag-bc8177a4.js';
-export { s as OrTagInputV3 } from '../OrTagInput-c9eefc97.js';
+export { s as OrTag } from '../OrTag-04abf6a7.js';
+export { s as OrTagInputV3 } from '../OrTagInput-dfa119ea.js';
 export { s as OrTagV3, a as TagColor, T as TagVariant } from '../OrTag-1b111af7.js';
-export { s as OrTagsV3, T as TagsOverflow } from '../OrTags-b5c62b28.js';
+export { s as OrTagsV3, T as TagsOverflow } from '../OrTags-b5aea0be.js';
 export { s as OrTeleport } from '../OrTeleport.vue3-9bce0c02.js';
 export { s as OrTeleportV3 } from '../OrTeleport.vue3-bf77eed4.js';
 export { s as OrTextV3 } from '../OrText-d54c951d.js';
@@ -146,7 +146,7 @@ export { s as OrTreeV3, T as TreeNodeDropPosition } from '../OrTree-82c3b90e.js'
 import 'vue-demi';
 import 'vue';
 import '../style-inject.es-4c6f2515.js';
-import '../color-6b0fc765.js';
+import '../color-911f1122.js';
 import '@vueuse/core';
 import '../dom-aecadd9a.js';
 import 'lodash/isElement';
@@ -203,7 +203,7 @@ import '../codemirrorView-020fe885.js';
 import 'prosemirror-state';
 import 'prosemirror-commands';
 import 'lodash/keyBy';
-import '../OrSelectMultipleControl-6476e58b.js';
+import '../OrSelectMultipleControl-9d33a012.js';
 import '../isEqualValue-f8bf73d9.js';
 import '../OrSelectControlInput-266e9375.js';
 import '../OrSelectPlaceholder-fc5a2dbf.js';

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

@@ -1,5 +1,5 @@
-export { a as AvatarColor, A as AvatarSize, s as OrAvatarV3 } from '../../OrAvatar-b0179873.js';
+export { a as AvatarColor, A as AvatarSize, s as OrAvatarV3 } from '../../OrAvatar-ae032fe2.js';
 import 'vue-demi';
-import '../../color-6b0fc765.js';
+import '../../color-911f1122.js';
 import '../../OrIcon-b2e2d0aa.js';
 import 'vue';

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

@@ -1,4 +1,4 @@
-export { s as OrSelectV3 } from '../../OrSelect-7e9a8fa9.js';
+export { s as OrSelectV3 } from '../../OrSelect-78a9da6c.js';
 export { I as SelectSize } from '../../OrInputBox-be83fe16.js';
 import 'vue-demi';
 import '../../dropdown-open-06d651cf.js';
@@ -36,11 +36,11 @@ import '../../OrInput-c92be458.js';
 import '../../useValidationAttributes-d1abbe34.js';
 import '../../OrLoader-b7d415dd.js';
 import '../../OrMenuItem-2928ba60.js';
-import '../../OrTags-b5c62b28.js';
+import '../../OrTags-b5aea0be.js';
 import '../../useOverflow-e91d2314.js';
 import '../../OrButton-9ca0dc8e.js';
 import '../../OrTag-1b111af7.js';
-import '../../OrSelectMultipleControl-6476e58b.js';
+import '../../OrSelectMultipleControl-9d33a012.js';
 import '../../isEqualValue-f8bf73d9.js';
 import '../../OrSelectControlInput-266e9375.js';
 import '../../OrSelectPlaceholder-fc5a2dbf.js';

package/dist/esm/v3/components/or-select-v3/partials/index.js

@@ -1,4 +1,4 @@
-export { s as OrSelectMultipleControl } from '../../../OrSelectMultipleControl-6476e58b.js';
+export { s as OrSelectMultipleControl } from '../../../OrSelectMultipleControl-9d33a012.js';
 export { s as OrSelectSingleControl } from '../../../OrSelectSingleControl-384d4b45.js';
 export { s as OrSelectPlaceholder } from '../../../OrSelectPlaceholder-fc5a2dbf.js';
 import 'vue-demi';
@@ -10,7 +10,7 @@ import '../../../isEqualValue-f8bf73d9.js';
 import '../../../useProxyModelValue-940010d2.js';
 import '@onereach/styles/tailwind/plugins/core';
 import '@onereach/styles/tailwind.config.json';
-import '../../../OrTags-b5c62b28.js';
+import '../../../OrTags-b5aea0be.js';
 import '../../../useOverflow-e91d2314.js';
 import '../../../OrButton-9ca0dc8e.js';
 import '../../../OrLoader-b7d415dd.js';

package/dist/esm/v3/components/or-select-v3/partials/or-select-multiple-control/index.js

@@ -1,4 +1,4 @@
-export { s as OrSelectMultipleControl } from '../../../../OrSelectMultipleControl-6476e58b.js';
+export { s as OrSelectMultipleControl } from '../../../../OrSelectMultipleControl-9d33a012.js';
 import 'vue-demi';
 import '@vueuse/core';
 import '../../../../dom-aecadd9a.js';
@@ -8,7 +8,7 @@ import '../../../../isEqualValue-f8bf73d9.js';
 import '../../../../useProxyModelValue-940010d2.js';
 import '@onereach/styles/tailwind/plugins/core';
 import '@onereach/styles/tailwind.config.json';
-import '../../../../OrTags-b5c62b28.js';
+import '../../../../OrTags-b5aea0be.js';
 import '../../../../useOverflow-e91d2314.js';
 import '../../../../OrButton-9ca0dc8e.js';
 import '../../../../OrLoader-b7d415dd.js';

package/dist/esm/v3/components/or-select-v3/utils/castToMultipleValue.d.ts

@@ -0,0 +1,2 @@
+import { SelectValue } from '../types';
+export declare function castToMultipleValue(value: SelectValue): SelectValue[];

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

@@ -1,4 +1,4 @@
-export { s as OrTag } from '../../OrTag-bc8177a4.js';
+export { s as OrTag } from '../../OrTag-04abf6a7.js';
 import 'vue-demi';
 import '../../OrIcon-eb0a5aa2.js';
 import '../../OrTooltip-ac7736a3.js';
@@ -13,4 +13,4 @@ import '../../dom-aecadd9a.js';
 import 'lodash/isElement';
 import 'lodash/get';
 import '../../px-to-rem-0b26b83e.js';
-import '../../color-6b0fc765.js';
+import '../../color-911f1122.js';

package/dist/esm/v3/components/or-tag-input-v3/OrTagInput.vue.d.ts

@@ -4,7 +4,7 @@ import { TagObject } from '../or-tags-v3/types';
 declare const _default: import("vue-demi").DefineComponent<{
     modelValue: {
         type: PropType<string[]>;
-        default: () => never[];
+        default: () => [];
     };
     label: {
         type: StringConstructor;
@@ -95,7 +95,7 @@ declare const _default: import("vue-demi").DefineComponent<{
 }, unknown, {}, {}, import("vue-demi").ComponentOptionsMixin, import("vue-demi").ComponentOptionsMixin, ("update:modelValue" | "keydown" | "keyup" | "focus" | "blur" | "reset")[], "update:modelValue" | "keydown" | "keyup" | "focus" | "blur" | "reset", import("vue-demi").VNodeProps & import("vue-demi").AllowedComponentProps & import("vue-demi").ComponentCustomProps, Readonly<import("vue-demi").ExtractPropTypes<{
     modelValue: {
         type: PropType<string[]>;
-        default: () => never[];
+        default: () => [];
     };
     label: {
         type: StringConstructor;

package/dist/esm/v3/components/or-tag-input-v3/index.js

@@ -1,4 +1,4 @@
-export { s as OrTagInputV3 } from '../../OrTagInput-c9eefc97.js';
+export { s as OrTagInputV3 } from '../../OrTagInput-dfa119ea.js';
 export { I as TagInputSize } from '../../OrInputBox-be83fe16.js';
 import '@vueuse/core';
 import 'vue-demi';
@@ -29,7 +29,7 @@ import '../../isPrevented-6994b101.js';
 import '../../isAncestor-9acec98b.js';
 import '../../OrLabel-6c83afe4.js';
 import '../../OrTag-1b111af7.js';
-import '../../OrTags-b5c62b28.js';
+import '../../OrTags-b5aea0be.js';
 import '../../useOverflow-e91d2314.js';
 import '../../OrButton-9ca0dc8e.js';
 import '../../OrLoader-b7d415dd.js';

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

@@ -1,4 +1,4 @@
-export { s as OrTagsV3, T as TagsOverflow } from '../../OrTags-b5c62b28.js';
+export { s as OrTagsV3, T as TagsOverflow } from '../../OrTags-b5aea0be.js';
 import 'vue-demi';
 import '../../useOverflow-e91d2314.js';
 import '@vueuse/core';

package/dist/esm/v3/index.js

@@ -1,5 +1,5 @@
 export { O as OR_AVATAR_SIZE, s as OrAvatar } from './OrAvatar-e79f6f21.js';
-export { a as AvatarColor, A as AvatarSize, s as OrAvatarV3 } from './OrAvatar-b0179873.js';
+export { a as AvatarColor, A as AvatarSize, s as OrAvatarV3 } from './OrAvatar-ae032fe2.js';
 export { B as BottomSheetVariant, s as OrBottomSheetV3 } from './OrBottomSheet-e33d1de9.js';
 export { s as OrButton, a as OrButtonColors, b as OrButtonSizes, O as OrButtonViews } from './OrButton-e5f925bb.js';
 export { s as OrButtonGroupV3 } from './OrButtonGroup-2583d1d0.js';
@@ -101,7 +101,7 @@ export { s as OrSearch } from './OrSearch-54a642d3.js';
 export { s as OrSearchV3 } from './OrSearch-44810f4c.js';
 export { s as OrSegmentedControlV3, S as SegmentedControlSize } from './OrSegmentedControl-08992fc7.js';
 export { s as OrSelect } from './OrSelect-c87b9c23.js';
-export { s as OrSelectV3 } from './OrSelect-7e9a8fa9.js';
+export { s as OrSelectV3 } from './OrSelect-78a9da6c.js';
 export { s as OrSidebar, O as OrSidebarSide } from './OrSidebar-4ab42b93.js';
 export { S as OrSidebarPlacement, s as OrSidebarV3, S as SidebarPlacement } from './OrSidebar-a6d3d1be.js';
 export { s as OrSkeletonCircle } from './OrSkeletonCircle-66e175a0.js';
@@ -122,10 +122,10 @@ export { s as OrTabHeaderItem } from './OrTabHeaderItem-c2af7ca3.js';
 export { s as OrTabV3 } from './OrTab-42be32d1.js';
 export { s as OrTabs } from './OrTabs-3da3ea89.js';
 export { s as OrTabsV3, T as TabsVariant } from './OrTabs-b0c9d2a5.js';
-export { s as OrTag } from './OrTag-bc8177a4.js';
-export { s as OrTagInputV3 } from './OrTagInput-c9eefc97.js';
+export { s as OrTag } from './OrTag-04abf6a7.js';
+export { s as OrTagInputV3 } from './OrTagInput-dfa119ea.js';
 export { s as OrTagV3, a as TagColor, T as TagVariant } from './OrTag-1b111af7.js';
-export { s as OrTagsV3, T as TagsOverflow } from './OrTags-b5c62b28.js';
+export { s as OrTagsV3, T as TagsOverflow } from './OrTags-b5aea0be.js';
 export { s as OrTeleport } from './OrTeleport.vue3-9bce0c02.js';
 export { s as OrTeleportV3 } from './OrTeleport.vue3-bf77eed4.js';
 export { s as OrTextV3 } from './OrText-d54c951d.js';
@@ -153,8 +153,8 @@ export { u as useResponsive } from './useResponsive-1baf3485.js';
 export { u as useTheme } from './useTheme-0ef25778.js';
 export { u as useToggle } from './useToggle-c04fc920.js';
 export { u as useValidationAttributes } from './useValidationAttributes-d1abbe34.js';
-export { H as HSL_LIMITS, t as RX_ABBREVIATION_FROM_STRING, R as RX_ARRAY_NOTATION, a as RX_BV_PREFIX, u as RX_DATE, v as RX_DATE_SPLIT, b as RX_DIGITS, y as RX_ENCODED_COMMA, z as RX_ENCODE_REVERSE, c as RX_EXTENSION, d as RX_HASH, e as RX_HASH_ID, x as RX_HREF, f as RX_HTML_TAGS, g as RX_HYPHENATE, C as RX_LONG_COLOR, h as RX_LOWER_UPPER, i as RX_NUMBER, j as RX_PLUS, A as RX_QUERY_START, k as RX_REGEXP_REPLACE, B as RX_SHORT_COLOR, l as RX_SPACES, m as RX_SPACE_SPLIT, n as RX_STAR, o as RX_START_SPACE_WORD, w as RX_TIME, p as RX_TRIM_LEFT, q as RX_TRIM_RIGHT, r as RX_UNDERSCORE, s as RX_UN_KEBAB, F as generateHslFromString, I as getHashOfString, D as hexToRgb, G as hslToColorString, J as normalize, E as rgbToHex } from './color-6b0fc765.js';
-export { C as CODE_BACKSPACE, a as CODE_BREAK, b as CODE_DELETE, c as CODE_DOWN, d as CODE_END, e as CODE_ENTER, f as CODE_ESC, g as CODE_HOME, h as CODE_LEFT, i as CODE_PAGEDOWN, j as CODE_PAGEUP, k as CODE_RIGHT, l as CODE_SPACE, m as CODE_UP, p as PLACEMENT_BOTTOM_END, o as PLACEMENT_BOTTOM_START, t as PLACEMENT_LEFT_END, s as PLACEMENT_LEFT_START, r as PLACEMENT_RIGHT_END, q as PLACEMENT_RIGHT_START, n as PLACEMENT_TOP_END, P as PLACEMENT_TOP_START, u as getAbbreviation, v as isDescendant } from './isDescendant-61c67ccc.js';
+export { H as HSL_LIMITS, t as RX_ABBREVIATION_FROM_STRING, R as RX_ARRAY_NOTATION, a as RX_BV_PREFIX, u as RX_DATE, v as RX_DATE_SPLIT, b as RX_DIGITS, y as RX_ENCODED_COMMA, z as RX_ENCODE_REVERSE, c as RX_EXTENSION, d as RX_HASH, e as RX_HASH_ID, x as RX_HREF, f as RX_HTML_TAGS, g as RX_HYPHENATE, C as RX_LONG_COLOR, h as RX_LOWER_UPPER, i as RX_NUMBER, j as RX_PLUS, A as RX_QUERY_START, k as RX_REGEXP_REPLACE, B as RX_SHORT_COLOR, l as RX_SPACES, m as RX_SPACE_SPLIT, n as RX_STAR, o as RX_START_SPACE_WORD, w as RX_TIME, p as RX_TRIM_LEFT, q as RX_TRIM_RIGHT, r as RX_UNDERSCORE, s as RX_UN_KEBAB, I as generateColorFromString, F as generateHslFromString, J as getHashOfString, D as hexToRgb, G as hslToColorString, K as normalize, E as rgbToHex } from './color-911f1122.js';
+export { C as CODE_BACKSPACE, a as CODE_BREAK, b as CODE_DELETE, c as CODE_DOWN, d as CODE_END, e as CODE_ENTER, f as CODE_ESC, g as CODE_HOME, h as CODE_LEFT, i as CODE_PAGEDOWN, j as CODE_PAGEUP, k as CODE_RIGHT, l as CODE_SPACE, m as CODE_UP, p as PLACEMENT_BOTTOM_END, o as PLACEMENT_BOTTOM_START, t as PLACEMENT_LEFT_END, s as PLACEMENT_LEFT_START, r as PLACEMENT_RIGHT_END, q as PLACEMENT_RIGHT_START, n as PLACEMENT_TOP_END, P as PLACEMENT_TOP_START, u as getAbbreviation, v as isDescendant } from './isDescendant-4434a968.js';
 export { M as MutationObs, f as addClass, c as cancelAF, e as contains, m as getAttr, t as getBCR, g as getById, u as getCS, x as getMaxZIndex, q as getStyle, n as hasAttr, j as hasClass, i as isVisible, v as offset, w as position, b as reflow, l as removeAttr, h as removeClass, a as removeNode, p as removeStyle, r as requestAF, d as select, s as selectAll, k as setAttr, o as setStyle } from './dom-aecadd9a.js';
 export { p as pxToRem } from './px-to-rem-0b26b83e.js';
 export { i as isAncestor } from './isAncestor-9acec98b.js';
@@ -205,7 +205,7 @@ import './codemirrorView-020fe885.js';
 import 'prosemirror-state';
 import 'prosemirror-commands';
 import 'lodash/keyBy';
-import './OrSelectMultipleControl-6476e58b.js';
+import './OrSelectMultipleControl-9d33a012.js';
 import './OrSelectControlInput-266e9375.js';
 import './OrSelectPlaceholder-fc5a2dbf.js';
 import './OrSelectSingleControl-384d4b45.js';

package/dist/esm/v3/{isDescendant-61c67ccc.js → isDescendant-4434a968.js}

@@ -1,4 +1,4 @@
-import { t as RX_ABBREVIATION_FROM_STRING } from './color-6b0fc765.js';
+import { t as RX_ABBREVIATION_FROM_STRING } from './color-911f1122.js';
 
 const CODE_BACKSPACE = 8;
 const CODE_BREAK = 19;

package/dist/esm/v3/utils/functions/color.d.ts

@@ -17,3 +17,7 @@ export declare function hslToColorString(hsl: {
     s: number;
     l: number;
 }): string;
+export declare function generateColorFromString(str: string, limits?: Partial<Record<'h' | 's' | 'l', {
+    min: number;
+    max: number;
+}>>): string;

package/dist/esm/v3/utils/index.js

@@ -1,5 +1,5 @@
-export { H as HSL_LIMITS, t as RX_ABBREVIATION_FROM_STRING, R as RX_ARRAY_NOTATION, a as RX_BV_PREFIX, u as RX_DATE, v as RX_DATE_SPLIT, b as RX_DIGITS, y as RX_ENCODED_COMMA, z as RX_ENCODE_REVERSE, c as RX_EXTENSION, d as RX_HASH, e as RX_HASH_ID, x as RX_HREF, f as RX_HTML_TAGS, g as RX_HYPHENATE, C as RX_LONG_COLOR, h as RX_LOWER_UPPER, i as RX_NUMBER, j as RX_PLUS, A as RX_QUERY_START, k as RX_REGEXP_REPLACE, B as RX_SHORT_COLOR, l as RX_SPACES, m as RX_SPACE_SPLIT, n as RX_STAR, o as RX_START_SPACE_WORD, w as RX_TIME, p as RX_TRIM_LEFT, q as RX_TRIM_RIGHT, r as RX_UNDERSCORE, s as RX_UN_KEBAB, F as generateHslFromString, I as getHashOfString, D as hexToRgb, G as hslToColorString, J as normalize, E as rgbToHex } from '../color-6b0fc765.js';
-export { C as CODE_BACKSPACE, a as CODE_BREAK, b as CODE_DELETE, c as CODE_DOWN, d as CODE_END, e as CODE_ENTER, f as CODE_ESC, g as CODE_HOME, h as CODE_LEFT, i as CODE_PAGEDOWN, j as CODE_PAGEUP, k as CODE_RIGHT, l as CODE_SPACE, m as CODE_UP, p as PLACEMENT_BOTTOM_END, o as PLACEMENT_BOTTOM_START, t as PLACEMENT_LEFT_END, s as PLACEMENT_LEFT_START, r as PLACEMENT_RIGHT_END, q as PLACEMENT_RIGHT_START, n as PLACEMENT_TOP_END, P as PLACEMENT_TOP_START, u as getAbbreviation, v as isDescendant } from '../isDescendant-61c67ccc.js';
+export { H as HSL_LIMITS, t as RX_ABBREVIATION_FROM_STRING, R as RX_ARRAY_NOTATION, a as RX_BV_PREFIX, u as RX_DATE, v as RX_DATE_SPLIT, b as RX_DIGITS, y as RX_ENCODED_COMMA, z as RX_ENCODE_REVERSE, c as RX_EXTENSION, d as RX_HASH, e as RX_HASH_ID, x as RX_HREF, f as RX_HTML_TAGS, g as RX_HYPHENATE, C as RX_LONG_COLOR, h as RX_LOWER_UPPER, i as RX_NUMBER, j as RX_PLUS, A as RX_QUERY_START, k as RX_REGEXP_REPLACE, B as RX_SHORT_COLOR, l as RX_SPACES, m as RX_SPACE_SPLIT, n as RX_STAR, o as RX_START_SPACE_WORD, w as RX_TIME, p as RX_TRIM_LEFT, q as RX_TRIM_RIGHT, r as RX_UNDERSCORE, s as RX_UN_KEBAB, I as generateColorFromString, F as generateHslFromString, J as getHashOfString, D as hexToRgb, G as hslToColorString, K as normalize, E as rgbToHex } from '../color-911f1122.js';
+export { C as CODE_BACKSPACE, a as CODE_BREAK, b as CODE_DELETE, c as CODE_DOWN, d as CODE_END, e as CODE_ENTER, f as CODE_ESC, g as CODE_HOME, h as CODE_LEFT, i as CODE_PAGEDOWN, j as CODE_PAGEUP, k as CODE_RIGHT, l as CODE_SPACE, m as CODE_UP, p as PLACEMENT_BOTTOM_END, o as PLACEMENT_BOTTOM_START, t as PLACEMENT_LEFT_END, s as PLACEMENT_LEFT_START, r as PLACEMENT_RIGHT_END, q as PLACEMENT_RIGHT_START, n as PLACEMENT_TOP_END, P as PLACEMENT_TOP_START, u as getAbbreviation, v as isDescendant } from '../isDescendant-4434a968.js';
 export { M as MutationObs, f as addClass, c as cancelAF, e as contains, m as getAttr, t as getBCR, g as getById, u as getCS, x as getMaxZIndex, q as getStyle, n as hasAttr, j as hasClass, i as isVisible, v as offset, w as position, b as reflow, l as removeAttr, h as removeClass, a as removeNode, p as removeStyle, r as requestAF, d as select, s as selectAll, k as setAttr, o as setStyle } from '../dom-aecadd9a.js';
 export { p as pxToRem } from '../px-to-rem-0b26b83e.js';
 export { i as isAncestor } from '../isAncestor-9acec98b.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@onereach/ui-components",
-  "version": "8.22.1",
+  "version": "8.22.2",
   "npmUnpacked": "4.15.2",
   "description": "Vue components library for v2/3",
   "sideEffects": false,
@@ -178,5 +178,5 @@
     },
     "./package.json": "./package.json"
   },
-  "gitHead": "da548c85e24619a2279ad2a5c73051c1ec4c30bd"
+  "gitHead": "e25654439cc46123247a6d0f70a117015a8a8274"
 }

package/src/components/or-select-v3/OrSelect.vue

@@ -55,7 +55,14 @@
               :enable-search="enableSearch"
               :is-open="popoverState === 'open'"
               @reset="deselect"
-            />
+            >
+              <template v-slot:tag="{item}">
+                <slot
+                  name="tag"
+                  :item="item"
+                />
+              </template>
+            </OrSelectMultipleControl>
           </template>
 
           <template v-else>
@@ -248,7 +255,7 @@
 </template>
 
 <script lang="ts">
-import { computed, defineComponent, getCurrentInstance, onMounted, PropType, ref, toRefs, watch } from 'vue-demi';
+import { computed, defineComponent, getCurrentInstance, PropType, ref, toRefs, watch } from 'vue-demi';
 import { DropdownClose, DropdownOpen } from '../../directives';
 import { useProxyModelValue, useResponsive } from '../../hooks';
 import { isEmptyValue } from '../../utils';
@@ -268,6 +275,7 @@ import { OrSelectMultipleControl, OrSelectSingleControl } from './partials';
 import { SelectSize } from './props';
 import { Select, SelectControl, SelectDropdown, SelectDropdownDefault, SelectDropdownFlipped, SelectDropdownItem, SelectNoSearchResults, SelectSearchControl } from './styles';
 import { RawValue, SelectGroupByFunction, SelectOption, SelectSearchFunction, SelectValue } from './types';
+import { castToMultipleValue } from './utils/castToMultipleValue';
 
 export default defineComponent({
   components: {
@@ -474,11 +482,6 @@ export default defineComponent({
       return enableClear.value && !isEmptyModelValue.value;
     });
 
-    onMounted(() => {
-      if (!proxyModelValue.value && props.multiple) {
-        proxyModelValue.value = [];
-      }
-    });
 
     const focused = computed(() => {
       if (multiple.value) {
@@ -592,11 +595,11 @@ export default defineComponent({
     function toggleOption(option: RawValue): void {
       const modelValue = proxyModelValue.value;
 
-      if (Array.isArray(modelValue)) {
-        if (modelValue.includes(option)) {
+      if (multiple.value) {
+        if (modelValue && Array.isArray(modelValue) && modelValue.includes(option)) {
           deselect(option);
         } else {
-          proxyModelValue.value = [...modelValue, option];
+          proxyModelValue.value = [...castToMultipleValue(modelValue), option];
         }
       } else {
         proxyModelValue.value = option;

package/src/components/or-select-v3/partials/or-select-multiple-control/OrSelectMultipleControl.vue

@@ -16,6 +16,16 @@
       :overflow="overflow"
       @reset="$emit('reset', $event)"
     >
+      <template
+        v-slot:tag="{item}"
+      >
+        <slot
+          name="tag"
+          :item="item"
+        >
+          {{ item.label }}
+        </slot>
+      </template>
       <template
         v-if="enableSearch"
         v-slot:tail
@@ -49,7 +59,7 @@ import { SelectOption, SelectValue } from '../../types';
 import { OrSelectControlInput } from '../or-select-control-input';
 import OrSelectPlaceholder from '../or-select-placeholder/OrSelectPlaceholder.vue';
 import { SelectMultipleControlRoot } from './styles';
-import { castToMultipleValue } from './utils/castToMultipleModel';
+import { castToMultipleValue } from '../../utils/castToMultipleValue';
 
 export default defineComponent({
   components: {

package/src/components/or-select-v3/{partials/or-select-multiple-control/utils/castToMultipleModel.ts → utils/castToMultipleValue.ts}

@@ -1,5 +1,5 @@
-import { SelectValue } from '../../../types';
-import { isEmptyValue } from '../../../../../utils';
+import { SelectValue } from '../types';
+import { isEmptyValue } from '../../../utils';
 
 export function castToMultipleValue(value: SelectValue): SelectValue[] {
   if (Array.isArray(value)) {

package/src/components/or-tag-input-v3/OrTagInput.vue

@@ -38,6 +38,14 @@
         :overflow="overflow"
         @reset="remove($event)"
       >
+        <template v-slot:tag="{item}">
+          <slot
+            name="tag"
+            :item="item"
+          >
+            {{ item.label }}
+          </slot>
+        </template>
         <template
           v-if="showControl"
           v-slot:tail
@@ -148,7 +156,7 @@ export default defineComponent({
   props: {
     modelValue: {
       type: Array as PropType<string[]>,
-      default: () => [],
+      default: (): [] => [],
     },
 
     label: {

package/src/components/or-tags-v3/OrTags.vue

@@ -15,7 +15,12 @@
         :class="['max-w-full']"
         @reset="$emit('reset', item.value)"
       >
-        {{ item.label }}
+        <slot
+          name="tag"
+          :item="item"
+        >
+          {{ item.label }}
+        </slot>
       </OrTag>
 
       <slot
@@ -50,7 +55,12 @@
             :key="item.value"
             @reset="$emit('reset', item.value)"
           >
-            {{ item.label }}
+            <slot
+              name="tag"
+              :item="item"
+            >
+              {{ item.label }}
+            </slot>
           </OrTag>
         </div>
       </OrPopover>

package/src/utils/functions/color.ts

@@ -46,3 +46,10 @@ export function generateHslFromString(
 export function hslToColorString(hsl: { h: number; s: number; l: number; }): string {
   return `hsl(${hsl.h}, ${hsl.s}%, ${hsl.l}%)`;
 }
+
+export function generateColorFromString(
+  str: string,
+  limits: Partial<Record<'h'|'s'|'l', { min: number; max: number; }>> = HSL_LIMITS,
+): string {
+  return hslToColorString(generateHslFromString(str, limits));
+}