@onereach/ui-components 2.74.8-beta.2336.0 → 2.74.8-beta.2338.0

package/dist/bundled/v3/{OrCheckbox.vue_vue_type_script_lang-08f64a02.js → OrCheckbox.vue_vue_type_script_lang-fc067611.js}

@@ -10,7 +10,7 @@ const CheckboxRoot = [
 'gap-sm+ md:gap-sm'];
 const CheckboxControl = [
 // Layout
-'layout-row justify-center', 'shrink-0',
+'layout-row justify-center',
 // Box
 'w-md+ md:w-md', 'h-md+ md:h-md',
 // Shape

package/dist/bundled/v3/{OrSelect.vue_vue_type_script_lang-44a4968b.js → OrSelect.vue_vue_type_script_lang-b50634d8.js}

@@ -1,5 +1,5 @@
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, withDirectives, createElementVNode, mergeProps, vModelDynamic, createBlock, withCtx, renderSlot, createTextVNode, toDisplayString, createCommentVNode, withModifiers, createVNode, vShow, defineComponent, getCurrentInstance, ref, computed, onMounted, watch } from 'vue';
-import { s as script$1 } from './OrCheckbox.vue_vue_type_script_lang-08f64a02.js';
+import { s as script$1 } from './OrCheckbox.vue_vue_type_script_lang-fc067611.js';
 import { s as styleInject } from './style-inject.es-4c6f2515.js';
 import './OrHint-5d5e4d99.js';
 import { s as script$2 } from './OrExpansionPanel.vue_vue_type_script_lang-cd3b6d36.js';
@@ -9,7 +9,7 @@ import './OrInputBox-358d4856.js';
 import './OrLabel-c556887e.js';
 import './OrMenuItem-1917f51a.js';
 import './OrPopover-f9a1d5d7.js';
-import { s as script$3 } from './OrTag.vue_vue_type_script_lang-2f138d1a.js';
+import { s as script$3 } from './OrTag.vue_vue_type_script_lang-4fe7e19f.js';
 import { D as DropdownClose, a as DropdownOpen } from './dropdown-open-293d2de2.js';
 import { u as useOverflow } from './useOverflow-6dce216b.js';
 import { s as script$4 } from './OrError.vue_vue_type_script_lang-53648a65.js';
@@ -64,7 +64,7 @@ const _hoisted_1$1 = ["disabled"];
 const _hoisted_2$1 = {
   class: /*#__PURE__*/normalizeClass(['layout-row', 'justify-between'])
 };
-const _hoisted_3$1 = ["tabindex", "disabled"];
+const _hoisted_3 = ["tabindex", "disabled"];
 function render$1(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_OrIcon = resolveComponent("OrIcon");
   return openBlock(), createElementBlock("div", {
@@ -80,7 +80,7 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
     class: normalizeClass([_ctx.expanded ? 'rotate-0' : 'rotate-[-90deg]']),
     icon: 'expand_more',
     variant: 'filled-bold'
-  }, null, 8 /* PROPS */, ["class"]), createTextVNode(" " + toDisplayString(_ctx.label), 1 /* TEXT */)], 10 /* CLASS, PROPS */, _hoisted_3$1), createElementVNode("div", {
+  }, null, 8 /* PROPS */, ["class"]), createTextVNode(" " + toDisplayString(_ctx.label), 1 /* TEXT */)], 10 /* CLASS, PROPS */, _hoisted_3), createElementVNode("div", {
     class: normalizeClass(_ctx.addonStyles)
   }, [renderSlot(_ctx.$slots, "addon")], 2 /* CLASS */)]), withDirectives(createElementVNode("div", null, [renderSlot(_ctx.$slots, "default")], 512 /* NEED_PATCH */), [[vShow, _ctx.expanded]])], 10 /* CLASS, PROPS */, _hoisted_1$1);
 }
@@ -90,9 +90,6 @@ script$2.__file = "src/components/or-expansion-panel-v3/OrExpansionPanel.vue";
 
 const _hoisted_1 = ["tabindex", "disabled"];
 const _hoisted_2 = {
-  class: "truncate"
-};
-const _hoisted_3 = {
   key: 0,
   class: /*#__PURE__*/normalizeClass(['layout-row', 'm-[-4px] md:m-[-2px]'])
 };
@@ -106,7 +103,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     onClick: _cache[1] || (_cache[1] = $event => _ctx.$emit('click', $event)),
     onFocus: _cache[2] || (_cache[2] = $event => _ctx.$emit('focus', $event)),
     onBlur: _cache[3] || (_cache[3] = $event => _ctx.$emit('blur', $event))
-  }, [createElementVNode("div", _hoisted_2, [renderSlot(_ctx.$slots, "default")]), _ctx.variant === 'reset' ? (openBlock(), createElementBlock("div", _hoisted_3, [createVNode(_component_OrIconButton, {
+  }, [renderSlot(_ctx.$slots, "default"), _ctx.variant === 'reset' ? (openBlock(), createElementBlock("div", _hoisted_2, [createVNode(_component_OrIconButton, {
     icon: 'close',
     color: _ctx.custom ? 'inherit' : _ctx.color,
     disabled: _ctx.disabled,
@@ -135,9 +132,7 @@ const SelectPlaceholder = [
 // Theme
 'theme-foreground-outline', 'dark:theme-foreground-outline-dark',
 // Interactivity
-'select-none',
-// Typography
-'truncate'];
+'select-none'];
 const SelectDropdown = [
 // Overflow
 'overflow-y-auto',

package/dist/bundled/v3/{OrTag.vue_vue_type_script_lang-2f138d1a.js → OrTag.vue_vue_type_script_lang-4fe7e19f.js}

@@ -18,7 +18,7 @@ const TagRoot = [
 // Layout
 'layout-inline-row',
 // Box
-'w-fit', 'max-w-full',
+'max-w-fit',
 // Shape
 'rounded-full',
 // Spacing

package/dist/bundled/v3/OrText.vue_vue_type_script_lang-e93438ea.js

@@ -0,0 +1,93 @@
+import { defineComponent, ref, computed } from 'vue';
+
+const TextRoot = [
+// Layout
+'inline-flex',
+// Box
+'max-w-full',
+// Typography
+'whitespace-nowrap'];
+const MainText = [
+// Layout
+'overflow-hidden',
+// Typography
+'text-ellipsis'];
+const RestText = [
+// Layout
+'shrink'];
+
+/**
+ * Use `OrText` component to crop un-wrapped single-line text with ellipsis inside narrow containers.
+ * Ellipsis can be placed in the end or in the middle of the text. Convenient for displaying long labels,
+ * that have same beginning and differ in the ending part.
+ */
+var script = defineComponent({
+  name: 'OrText',
+  props: {
+    /**
+     * Text to crop.
+     */
+    text: {
+      type: String,
+      required: true
+    },
+    /**
+     * The index counted from the end of the string where ellipsis will be placed.
+     * Defines how many ending characters will remain visible.
+     * By default, ellipsis is placed in the end of the line.
+     *
+     * Note: Negative values behave same as corresponding positives still counting from the end of the line.
+     */
+    sliceIndex: {
+      type: Number,
+      default: 0
+    }
+  },
+  expose: ['root'],
+  setup(props) {
+    // Refs
+    const root = ref();
+    // Styles
+    const rootStyles = computed(() => ['or-text', ...TextRoot]);
+    const mainTextStyles = computed(() => [...MainText]);
+    const restTextStyles = computed(() => [...RestText]);
+    /**
+     * Preserves whitespace at the last position as <code>&nbsp;</code>
+     * @param str A string to escape
+     */
+    const escapeLast = str => str && str.slice(0, -1) + '\xa0';
+    /**
+     * Preserves whitespace at the first position as <code>&nbsp;</code>
+     * @param str A string to escape
+     */
+    const escapeFirst = str => str && '\xa0' + str.slice(1);
+    // State
+    const mainText = computed(() => {
+      if (props.sliceIndex) {
+        let mainPart = props.text.slice(0, -Math.abs(props.sliceIndex));
+        if (mainPart[mainPart.length - 1] === ' ') {
+          mainPart = escapeLast(mainPart);
+        }
+        return mainPart;
+      }
+      return props.text;
+    });
+    const restText = computed(() => {
+      let restPart = props.text.slice(mainText.value.length);
+      if (restPart[0] === ' ') {
+        restPart = escapeFirst(restPart);
+      }
+      return restPart;
+    });
+    return {
+      root,
+      rootStyles,
+      mainTextStyles,
+      restTextStyles,
+      mainText,
+      restText
+    };
+  }
+});
+
+export { script as s };

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

@@ -12,7 +12,7 @@ export { D as DefaultCardCollectionViews, s as OrCardCollectionV3, d as defaultV
 export { s as OrCardV3 } from '../OrCard.vue_vue_type_script_lang-b6685a34.js';
 export { a as OrCarousel, s as OrCarouselItem } from '../OrCarouselItem.vue_vue_type_script_lang-ef9fec58.js';
 export { s as OrCheckbox } from '../OrCheckbox.vue_vue_type_script_lang-00e3371f.js';
-export { s as OrCheckboxV3 } from '../OrCheckbox.vue_vue_type_script_lang-08f64a02.js';
+export { s as OrCheckboxV3 } from '../OrCheckbox.vue_vue_type_script_lang-fc067611.js';
 export { s as OrChip } from '../OrChip-7324118c.js';
 export { s as OrChips } from '../OrChips.vue_vue_type_script_lang-54842d4d.js';
 export { s as OrCode, O as OrCodeLanguages } from '../OrCode.vue_vue_type_script_lang-fb43d35a.js';
@@ -69,7 +69,7 @@ export { s as OrSearch } from '../OrSearch.vue_vue_type_script_lang-b39b93b8.js'
 export { s as OrSearchV3 } from '../OrSearch.vue_vue_type_script_lang-409490d8.js';
 export { s as OrSegmentedControlV3, S as SegmentedControlSize } from '../OrSegmentedControl.vue_vue_type_script_lang-38a00b68.js';
 export { s as OrSelect } from '../OrSelect.vue_vue_type_script_lang-131ba34b.js';
-export { s as OrSelectV3 } from '../OrSelect.vue_vue_type_script_lang-44a4968b.js';
+export { s as OrSelectV3 } from '../OrSelect.vue_vue_type_script_lang-b50634d8.js';
 export { s as OrSidebar, O as OrSidebarSide } from '../OrSidebar.vue_vue_type_script_lang-7c55ac0a.js';
 export { s as OrSidebarV3 } from '../OrSidebar.vue_vue_type_script_lang-b5adff07.js';
 export { O as OrSidebarPlacement } from '../OrSidebarCollapseButton.vue_vue_type_script_lang-ddb36366.js';
@@ -86,10 +86,10 @@ export { s as OrTabV3 } from '../OrTab.vue_vue_type_script_lang-f791efa0.js';
 export { s as OrTabs } from '../OrTabs.vue_vue_type_script_lang-40e2a6e9.js';
 export { s as OrTabsV3, T as TabsVariant } from '../OrTabs.vue_vue_type_script_lang-7a2b137a.js';
 export { s as OrTag } from '../OrTag.vue_vue_type_script_lang-823edbfe.js';
-export { s as OrTagV3, a as TagColor, T as TagVariant } from '../OrTag.vue_vue_type_script_lang-2f138d1a.js';
+export { s as OrTagV3, a as TagColor, T as TagVariant } from '../OrTag.vue_vue_type_script_lang-4fe7e19f.js';
 export { s as OrTeleport } from '../OrTeleport.vue3-12636ac0.js';
 export { s as OrTeleportV3 } from '../OrTeleport.vue3.vue_vue_type_script_lang-4dc70cf1.js';
-export { s as OrTextV3 } from '../OrText.vue_vue_type_script_lang-271fb345.js';
+export { s as OrTextV3 } from '../OrText.vue_vue_type_script_lang-e93438ea.js';
 export { s as OrTextarea } from '../OrTextarea.vue_vue_type_script_lang-69ea22e9.js';
 export { s as OrTextareaV3 } from '../OrTextarea.vue_vue_type_script_lang-de99a858.js';
 export { s as OrTextbox, T as TextboxTypes } from '../OrTextbox.vue_vue_type_script_lang-245d8bf2.js';

package/dist/bundled/v3/components/or-checkbox-v3/index.js

@@ -1,4 +1,4 @@
-export { s as OrCheckboxV3 } from '../../OrCheckbox.vue_vue_type_script_lang-08f64a02.js';
+export { s as OrCheckboxV3 } from '../../OrCheckbox.vue_vue_type_script_lang-fc067611.js';
 import 'vue';
 import '../../OrLabel-c556887e.js';
 import '../../OrLabel.vue_vue_type_script_lang-191d2304.js';

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

@@ -1,7 +1,7 @@
-export { s as OrSelectV3 } from '../../OrSelect.vue_vue_type_script_lang-44a4968b.js';
+export { s as OrSelectV3 } from '../../OrSelect.vue_vue_type_script_lang-b50634d8.js';
 export { a as SelectSize } from '../../OrInputBox.vue_vue_type_script_lang-b387d4ba.js';
 import 'vue';
-import '../../OrCheckbox.vue_vue_type_script_lang-08f64a02.js';
+import '../../OrCheckbox.vue_vue_type_script_lang-fc067611.js';
 import '../../OrLabel-c556887e.js';
 import '../../OrLabel.vue_vue_type_script_lang-191d2304.js';
 import '../../useIdAttribute-b2e42f31.js';
@@ -32,6 +32,6 @@ import '../../OrLoader.vue_vue_type_script_lang-8fc03499.js';
 import '../../useValidationAttributes-5428d8fa.js';
 import '../../OrMenuItem-1917f51a.js';
 import '../../OrMenuItem.vue_vue_type_script_lang-0b643c00.js';
-import '../../OrTag.vue_vue_type_script_lang-2f138d1a.js';
+import '../../OrTag.vue_vue_type_script_lang-4fe7e19f.js';
 import '../../dropdown-open-293d2de2.js';
 import '../../useOverflow-6dce216b.js';

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

@@ -1,4 +1,4 @@
-export { s as OrTagV3, a as TagColor, T as TagVariant } from '../../OrTag.vue_vue_type_script_lang-2f138d1a.js';
+export { s as OrTagV3, a as TagColor, T as TagVariant } from '../../OrTag.vue_vue_type_script_lang-4fe7e19f.js';
 import 'vue';
 import '../../OrIconButton-a2091425.js';
 import '../../OrIconButton.vue_vue_type_script_lang-14871105.js';

package/dist/bundled/v3/components/or-text-v3/OrText.vue.d.ts

@@ -6,22 +6,42 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     mainText: import("@vue/composition-api").ComputedRef<string>;
     restText: import("@vue/composition-api").ComputedRef<string>;
 }> & import("@vue/composition-api").Data, {}, {}, {
+    /**
+     * Text to crop.
+     */
     text: {
         type: StringConstructor;
         required: true;
     };
+    /**
+     * The index counted from the end of the string where ellipsis will be placed.
+     * Defines how many ending characters will remain visible.
+     * By default, ellipsis is placed in the end of the line.
+     *
+     * Note: Negative values behave same as corresponding positives still counting from the end of the line.
+     */
     sliceIndex: {
         type: NumberConstructor;
-        default: undefined;
+        default: number;
     };
 }, import("@vue/composition-api").ExtractPropTypes<{
+    /**
+     * Text to crop.
+     */
     text: {
         type: StringConstructor;
         required: true;
     };
+    /**
+     * The index counted from the end of the string where ellipsis will be placed.
+     * Defines how many ending characters will remain visible.
+     * By default, ellipsis is placed in the end of the line.
+     *
+     * Note: Negative values behave same as corresponding positives still counting from the end of the line.
+     */
     sliceIndex: {
         type: NumberConstructor;
-        default: undefined;
+        default: number;
     };
 }>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
     text: string;
@@ -39,4 +59,9 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
 } & {}, {
     sliceIndex: number;
 }, true>);
+/**
+ * Use `OrText` component to crop un-wrapped single-line text with ellipsis inside narrow containers.
+ * Ellipsis can be placed in the end or in the middle of the text. Convenient for displaying long labels,
+ * that have same beginning and differ in the ending part.
+ */
 export default _default;

package/dist/bundled/v3/components/or-text-v3/index.js

@@ -1,2 +1,2 @@
-export { s as OrTextV3 } from '../../OrText.vue_vue_type_script_lang-271fb345.js';
+export { s as OrTextV3 } from '../../OrText.vue_vue_type_script_lang-e93438ea.js';
 import 'vue';