@onereach/ui-components 2.67.8 → 2.67.9-beta.2030.0

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

@@ -1,8 +1,8 @@
-export { s as OrSwitchV3 } from '../../OrSwitch-ec454b76.js';
+export { s as OrSwitchV3 } from '../../OrSwitch-5415978d.js';
 import 'vue-demi';
 import '../../useClassAttribute-47fdb016.js';
 import '@vueuse/core';
 import '../../OrLabel-7d4fe80b.js';
 import 'vue';
-import '../../OrLoader-60943812.js';
+import '../../OrLoader-35e5dfaf.js';
 import '../../style-inject.es-4c6f2515.js';

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

@@ -1,4 +1,4 @@
-export { a as OrToastContainerV3, s as OrToastV3, t as TypesV3 } from '../../types-652ae29f.js';
+export { a as OrToastContainerV3, s as OrToastV3, t as TypesV3 } from '../../types-977d9680.js';
 export { p as PropsV3, a as useQueueV3, u as useToastV3 } from '../../useToast-0665462d.js';
 import '@vueuse/core';
 import 'vue-demi';
@@ -14,5 +14,5 @@ import '../../useElevation-31bfe1f6.js';
 import '../../useResponsive-a02e95b7.js';
 import '../../OrBottomSheet-0eb33b18.js';
 import '../../OrOverlay-738a44d5.js';
-import '../../OrLoader-60943812.js';
+import '../../OrLoader-35e5dfaf.js';
 import '../../style-inject.es-4c6f2515.js';

package/dist/esm/v3/index.js

@@ -3,7 +3,7 @@ export { a as AvatarColor, A as AvatarSize, s as OrAvatarV3 } from './OrAvatar-e
 export { s as OrBottomSheetV3 } from './OrBottomSheet-0eb33b18.js';
 export { s as OrButton, a as OrButtonColors, b as OrButtonSizes, O as OrButtonViews } from './OrButton-fca9019a.js';
 export { b as BUTTON_COLOR, d as BUTTON_LOADER_TYPE, c as BUTTON_SIZE, B as BUTTON_TYPE, I as ICON_BUTTON_TYPE, s as OrButtonV2, a as OrIconButton } from './OrIconButton-8be9c89f.js';
-export { a as ButtonColor, b as ButtonType, B as ButtonVariant, s as OrButtonV3 } from './OrButton-4d0c2edd.js';
+export { a as ButtonColor, b as ButtonType, B as ButtonVariant, s as OrButtonV3 } from './OrButton-9021f9c8.js';
 export { s as OrCard } from './OrCard-e3a5aea4.js';
 export { C as CARD_COLLECTION_LAYOUT, s as OrCardCollection } from './OrCardCollection-a5e326ef.js';
 export { C as CardCollectionView, s as OrCardCollectionV3 } from './OrCardCollection-34aa611e.js';
@@ -16,7 +16,7 @@ export { s as OrCode, O as OrCodeLanguages } from './OrCode-ee19a5e6.js';
 export { s as OrCollapse } from './OrCollapse-445141ab.js';
 export { s as OrColorPicker, h as amber, n as black, b as blue, m as blueGrey, k as brown, c as cyan, j as deepOrange, d as deepPurple, g as green, i as indigo, l as lightBlue, e as lightGreen, f as lime, o as orange, p as pink, a as purple, r as red, t as teal, w as white, y as yellow } from './OrColorPicker-189cb097.js';
 export { s as OrConfirm } from './OrConfirm-f39bd784.js';
-export { C as ConfirmType, s as OrConfirmV3 } from './OrConfirm-a77d9812.js';
+export { C as ConfirmType, s as OrConfirmV3 } from './OrConfirm-b090a158.js';
 export { D as DEFAULT_TEXT, s as OrDateTimePicker, a as OrDateTimePickerItemTypes, O as OrDateTimePickerTypes } from './OrDateTimePicker-f2e08564.js';
 export { s as OrError } from './OrError-f90296db.js';
 export { s as OrErrorTagV3 } from './OrErrorTag-bbfd3ca6.js';
@@ -42,7 +42,7 @@ export { L as LinkColor, s as OrLinkV3 } from './OrLink-338db3ca.js';
 export { s as OrList } from './OrList-b740d13e.js';
 export { s as OrListOfInputs } from './OrListOfInputs-7a67440f.js';
 export { L as LoaderViews, s as OrLoader } from './OrLoader-15174477.js';
-export { a as LoaderColor, b as LoaderSize, L as LoaderVariant, s as OrLoaderV3 } from './OrLoader-60943812.js';
+export { a as LoaderColor, b as LoaderSize, L as LoaderVariant, s as OrLoaderV3 } from './OrLoader-35e5dfaf.js';
 export { s as OrMenuItemV3 } from './OrMenuItem-d001f0f6.js';
 export { s as OrMenuV3 } from './OrMenu-d9e12030.js';
 export { P as MenuPlacement, s as OrPopoverV3, P as PopoverPlacement, a as PopoverVariant, P as TooltipPlacement } from './OrPopover-94a8f21d.js';
@@ -70,7 +70,7 @@ export { s as OrSlider } from './OrSlider-87e2da8c.js';
 export { s as OrSortHeaderV3 } from './OrSortHeader-9d645226.js';
 export { s as OrStepper } from './OrStepper-f19b4eac.js';
 export { s as OrSwitch } from './OrSwitch-c333ee32.js';
-export { s as OrSwitchV3 } from './OrSwitch-ec454b76.js';
+export { s as OrSwitchV3 } from './OrSwitch-5415978d.js';
 export { s as OrTab } from './OrTab-bc98be02.js';
 export { s as OrTabHeaderItem } from './OrTabHeaderItem-d668cc59.js';
 export { s as OrTabV3 } from './OrTab-97044946.js';
@@ -85,7 +85,7 @@ export { s as OrTextareaV3 } from './OrTextarea-98895b2a.js';
 export { s as OrTextbox, T as TextboxTypes } from './OrTextbox-2f33e9c3.js';
 export { s as OrToast, a as OrToastContainer } from './OrToastContainer-40c4c1c8.js';
 export { P as PositionsX, b as PositionsY, c as ToastType, T as TransitionType, a as useQueue, u as useToast } from './useToast-4fbe0e5a.js';
-export { a as OrToastContainerV3, s as OrToastV3, t as TypesV3 } from './types-652ae29f.js';
+export { a as OrToastContainerV3, s as OrToastV3, t as TypesV3 } from './types-977d9680.js';
 export { p as PropsV3, a as useQueueV3, u as useToastV3 } from './useToast-0665462d.js';
 export { s as OrTooltip, a as OrTooltipContent } from './OrTooltip-78cd7f6b.js';
 export { s as OrTooltipV3 } from './OrTooltip-6412166a.js';

package/dist/esm/v3/{types-652ae29f.js → types-977d9680.js}

@@ -3,7 +3,7 @@ import { defineComponent, ref, computed, onBeforeMount, onBeforeUnmount, nextTic
 import { s as script$4 } from './OrTeleport.vue3-8099178c.js';
 import { T as ToastType, P as PositionsX, b as PositionsY, c as TransitionType, d as useToastEventBus, a as useQueue } from './useToast-0665462d.js';
 import { s as script$2 } from './OrIconButton-1d78453b.js';
-import { s as script$3 } from './OrLoader-60943812.js';
+import { s as script$3 } from './OrLoader-35e5dfaf.js';
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, renderSlot, createCommentVNode, createVNode, toDisplayString, createElementVNode, createBlock, withModifiers, withCtx, TransitionGroup, Fragment, renderList, mergeProps } from 'vue';
 import { s as styleInject } from './style-inject.es-4c6f2515.js';
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@onereach/ui-components",
-  "version": "2.67.8",
+  "version": "2.67.9-beta.2030.0",
   "description": "Vue components library for v2/3",
   "sideEffects": false,
   "main": "./dist/auto/index.js",
@@ -123,6 +123,5 @@
       "default": "./dist/bundled/v3/components/*/index.js"
     },
     "./package.json": "./package.json"
-  },
-  "gitHead": "49b48309886592f29f6ca713127893cf0525aa5b"
+  }
 }

package/src/components/or-loader-v3/OrLoader.docs.mdx

@@ -9,4 +9,6 @@ import { OrLoaderV3 as OrLoader } from '@onereach/ui-components';
 ## Migration Guide from V1
   - added properties `color` and `size`
   - property `type` renamed to `variant`
-  - removed properties `linearTitle`, `linearDescription`, and `textTypeLabel`
+  - property `linearTitle` renamed to `title`
+  - property `linearDescription` renamed to `description`
+  - removed properties: `textTypeLabel`

package/src/components/or-loader-v3/OrLoader.stories3.ts

@@ -23,6 +23,14 @@ export default {
       control: { type: 'select' },
       options: Object.values(LoaderSize),
     },
+
+    title: {
+      control: { type: 'string' },
+    },
+
+    description: {
+      control: { type: 'string' },
+    },
   },
 
   parameters: {
@@ -51,4 +59,16 @@ const Template: StoryFn<typeof OrLoader> = (args) => ({
   template: '<OrLoader v-bind="args" />',
 });
 
-export const Loader = Template.bind({});
+export const Default = Template.bind({});
+
+export const Linear = Template.bind({});
+Linear.args = {
+  variant: 'linear',
+};
+
+export const LinearWithText = Template.bind({});
+LinearWithText.args = {
+  title: 'Loading',
+  variant: 'linear',
+  description: 'Promptly retrieving your data from the cloud',
+};

package/src/components/or-loader-v3/OrLoader.vue

@@ -4,6 +4,11 @@
     v-bind="$attrs"
     :class="rootStyles"
   >
+    <template v-if="title">
+      <div class="typography-headline-2 text-center	text-on-background dark:text-on-background-dark">
+        {{ title }}
+      </div>
+    </template>
     <template v-if="variant === 'circular'">
       <svg
         viewBox="0 0 16 16"
@@ -67,6 +72,11 @@
         </g>
       </svg>
     </template>
+    <template v-if="description">
+      <div class="typography-body-2-regular text-center	text-outline dark:text-outline-dark">
+        {{ description }}
+      </div>
+    </template>
   </div>
 </template>
 
@@ -96,6 +106,16 @@ export default defineComponent({
       type: String as PropType<LoaderSize>,
       default: LoaderSize.M,
     },
+
+    title: {
+      type: String,
+      default: undefined,
+    },
+
+    description: {
+      type: String,
+      default: undefined,
+    },
   },
 
   expose: [

package/src/components/or-loader-v3/styles.ts

@@ -3,6 +3,9 @@ import { LoaderColor } from './props';
 export const LoaderRoot: string[] = [
   // Layout
   'contents',
+  'flex',
+  'flex-col',
+  'space-y-md',
 ];
 
 export const LoaderRootColors: Record<LoaderColor, string[]> = {

package/dist/bundled/v3/OrLoader-65868e73.js

@@ -1,56 +0,0 @@
-import { s as script } from './OrLoader.vue_vue_type_script_lang-edd1b404.js';
-import { openBlock, createElementBlock, mergeProps, createElementVNode, normalizeClass, createCommentVNode } from 'vue';
-
-const _hoisted_1 = ["width", "height"];
-const _hoisted_2 = {
-  fill: "none",
-  "stroke-width": "2",
-  "stroke-linecap": "round"
-};
-const _hoisted_3 = ["stroke"];
-const _hoisted_4 = {
-  key: 1,
-  width: "100%",
-  height: "4"
-};
-const _hoisted_5 = {
-  fill: "none",
-  "stroke-width": "4",
-  "stroke-linecap": "round"
-};
-const _hoisted_6 = /*#__PURE__*/createElementVNode("line", {
-  class: /*#__PURE__*/normalizeClass(['stroke-surface-variant', 'dark:stroke-surface-variant-dark']),
-  x1: "2",
-  y1: "50%",
-  x2: "calc(100% - 2px)",
-  y2: "50%"
-}, null, -1 /* HOISTED */);
-const _hoisted_7 = ["stroke"];
-function render(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("div", mergeProps({
-    ref: "root"
-  }, _ctx.$attrs, {
-    class: _ctx.rootStyles
-  }), [_ctx.variant === 'circular' ? (openBlock(), createElementBlock("svg", {
-    key: 0,
-    viewBox: "0 0 16 16",
-    width: _ctx.computedSize,
-    height: _ctx.computedSize
-  }, [createElementVNode("g", _hoisted_2, [createElementVNode("circle", {
-    class: normalizeClass(['animate-circular-loader', 'origin-center']),
-    cx: "50%",
-    cy: "50%",
-    r: "7",
-    stroke: _ctx.color === 'inherit' ? 'currentColor' : 'inherit'
-  }, null, 8 /* PROPS */, _hoisted_3)])], 8 /* PROPS */, _hoisted_1)) : createCommentVNode("v-if", true), _ctx.variant === 'linear' ? (openBlock(), createElementBlock("svg", _hoisted_4, [createElementVNode("g", _hoisted_5, [_hoisted_6, createElementVNode("line", {
-    class: normalizeClass(['animate-linear-loader', 'origin-center']),
-    x1: "2",
-    y1: "50%",
-    x2: "calc(100% - 2px)",
-    y2: "50%",
-    stroke: _ctx.color === 'inherit' ? 'currentColor' : 'inherit'
-  }, null, 8 /* PROPS */, _hoisted_7)])])) : createCommentVNode("v-if", true)], 16 /* FULL_PROPS */);
-}
-
-script.render = render;
-script.__file = "src/components/or-loader-v3/OrLoader.vue";