@onereach/ui-components 4.2.6-beta.2604.0 → 4.2.6-beta.2605.0

package/dist/bundled/v2/components/OrBottomSheetV3/OrBottomSheet.js

@@ -15,8 +15,8 @@ var script = defineComponent({
     OrOverlay: __vue_component__$1
   },
   inheritAttrs: false,
-  emits: ['update:state', 'update:state:open', 'update:state:fullscreen', 'update:state:closed', 'update:state:closed-automatically'],
-  expose: ['root', 'state', 'isOpen', 'isFullscreen', 'isClosed', 'open', 'close'],
+  emits: ['update:state'],
+  expose: ['root', 'open', 'close'],
   setup(props, context) {
     // Refs
     const root = ref();
@@ -26,40 +26,23 @@ var script = defineComponent({
     const headerStyles = computed(() => [...BottomSheetHeader]);
     // State
     const state = ref('closed');
-    const isOpen = computed(() => state.value === 'open');
-    const isFullscreen = computed(() => state.value === 'fullscreen');
-    const isClosed = computed(() => state.value === 'closed');
     // Events
     watch(state, value => {
       context.emit('update:state', value);
-      switch (value) {
-        case 'open':
-          context.emit('update:state:open');
-          break;
-        case 'fullscreen':
-          context.emit('update:state:fullscreen');
-          break;
-        case 'closed':
-          context.emit('update:state:closed');
-          break;
-      }
     });
     // Methods
     function open() {
       state.value = 'open';
     }
-    function close(auto = false) {
+    function close() {
       state.value = 'closed';
-      if (auto) {
-        context.emit('update:state:closed-automatically');
-      }
     }
     // Handlers
     function onSwipeUp() {
-      state.value = 'fullscreen';
+      state.value = 'full-open';
     }
     function onSwipeDown() {
-      state.value = state.value === 'fullscreen' ? 'open' : 'closed';
+      state.value = state.value === 'full-open' ? 'open' : 'closed';
     }
     // Effects
     // #region Swipe
@@ -103,7 +86,7 @@ var script = defineComponent({
       if (!path.some(({
         classList
       }) => (classList === null || classList === void 0 ? void 0 : classList.contains('or-popover-v3')) || (classList === null || classList === void 0 ? void 0 : classList.contains('or-bottom-sheet-v3')))) {
-        close(true);
+        close();
       }
     });
     // #endregion
@@ -113,9 +96,6 @@ var script = defineComponent({
       handleStyles,
       headerStyles,
       state,
-      isOpen,
-      isFullscreen,
-      isClosed,
       open,
       close
     };
@@ -132,7 +112,7 @@ var __vue_render__ = function () {
   var _c = _vm._self._c || _h;
   return _vm.state !== 'closed' ? _c('OrOverlay', {
     attrs: {
-      "fullscreen": _vm.state === 'fullscreen'
+      "fullscreen": _vm.state === 'full-open'
     }
   }, [_c('div', _vm._b({
     ref: "root",
@@ -142,7 +122,7 @@ var __vue_render__ = function () {
   }), _vm._v(" "), _c('div', {
     class: _vm.headerStyles
   }, [_vm._t("header")], 2), _vm._v(" "), _c('div', {
-    class: [_vm.state === 'fullscreen' ? 'overflow-y-auto' : 'overflow-hidden']
+    class: [_vm.state === 'full-open' ? 'overflow-y-auto' : 'overflow-hidden']
   }, [_vm._t("default")], 2)])]) : _vm._e();
 };
 var __vue_staticRenderFns__ = [];

package/dist/bundled/v2/components/OrBottomSheetV3/OrBottomSheet.vue.d.ts

@@ -3,12 +3,9 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
     handleStyles: import("@vue/composition-api").ComputedRef<string[]>;
     headerStyles: import("@vue/composition-api").ComputedRef<string[]>;
-    state: import("@vue/composition-api").Ref<"open" | "fullscreen" | "closed">;
-    isOpen: import("@vue/composition-api").ComputedRef<boolean>;
-    isFullscreen: import("@vue/composition-api").ComputedRef<boolean>;
-    isClosed: import("@vue/composition-api").ComputedRef<boolean>;
+    state: import("@vue/composition-api").Ref<"open" | "full-open" | "closed">;
     open: () => void;
-    close: (auto?: boolean) => void;
+    close: () => void;
 }> & import("@vue/composition-api").Data, {}, {}, {}, import("@vue/composition-api").ExtractPropTypes<{}>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{} & {} & {
     [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
 }, import("@vue/composition-api").ShallowUnwrapRef<{
@@ -16,12 +13,9 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
     handleStyles: import("@vue/composition-api").ComputedRef<string[]>;
     headerStyles: import("@vue/composition-api").ComputedRef<string[]>;
-    state: import("@vue/composition-api").Ref<"open" | "fullscreen" | "closed">;
-    isOpen: import("@vue/composition-api").ComputedRef<boolean>;
-    isFullscreen: import("@vue/composition-api").ComputedRef<boolean>;
-    isClosed: import("@vue/composition-api").ComputedRef<boolean>;
+    state: import("@vue/composition-api").Ref<"open" | "full-open" | "closed">;
     open: () => void;
-    close: (auto?: boolean) => void;
+    close: () => void;
 }>, import("@vue/composition-api").Data, {}, {}, {}, {}, string[], {} & {} & {
     [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
 }, {}, true>);

package/dist/bundled/v2/components/OrButtonV3/OrButton.vue.d.ts

@@ -6,15 +6,15 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     isVue3: boolean;
 }> & import("@vue/composition-api").Data, {}, {}, {
     type: {
-        type: PropType<"button" | "submit" | "reset">;
+        type: PropType<ButtonType>;
         default: ButtonType;
     };
     variant: {
-        type: PropType<"contained" | "outlined" | "text" | "link">;
+        type: PropType<ButtonVariant>;
         default: ButtonVariant;
     };
     color: {
-        type: PropType<"primary" | "danger" | "inherit">;
+        type: PropType<ButtonColor>;
         default: ButtonColor;
     };
     activated: {
@@ -35,15 +35,15 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     };
 }, import("@vue/composition-api").ExtractPropTypes<{
     type: {
-        type: PropType<"button" | "submit" | "reset">;
+        type: PropType<ButtonType>;
         default: ButtonType;
     };
     variant: {
-        type: PropType<"contained" | "outlined" | "text" | "link">;
+        type: PropType<ButtonVariant>;
         default: ButtonVariant;
     };
     color: {
-        type: PropType<"primary" | "danger" | "inherit">;
+        type: PropType<ButtonColor>;
         default: ButtonColor;
     };
     activated: {
@@ -64,9 +64,9 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     };
 }>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
     activated: boolean;
-    type: "button" | "submit" | "reset";
-    variant: "contained" | "outlined" | "text" | "link";
-    color: "primary" | "danger" | "inherit";
+    type: ButtonType;
+    variant: ButtonVariant;
+    color: ButtonColor;
     disabled: boolean;
     loading: boolean;
     loadingText: string;
@@ -78,9 +78,9 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     isVue3: boolean;
 }>, import("@vue/composition-api").Data, {}, {}, {}, {}, string[], {
     activated: boolean;
-    type: "button" | "submit" | "reset";
-    variant: "contained" | "outlined" | "text" | "link";
-    color: "primary" | "danger" | "inherit";
+    type: ButtonType;
+    variant: ButtonVariant;
+    color: ButtonColor;
     disabled: boolean;
     loading: boolean;
     loadingText: string;
@@ -88,9 +88,9 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
 }, {
     activated: boolean;
-    type: "button" | "submit" | "reset";
-    variant: "contained" | "outlined" | "text" | "link";
-    color: "primary" | "danger" | "inherit";
+    type: ButtonType;
+    variant: ButtonVariant;
+    color: ButtonColor;
     disabled: boolean;
     loading: boolean;
     loadingText: string;

package/dist/bundled/v2/components/OrButtonV3/styles.js

@@ -52,9 +52,7 @@ const ButtonRootColors = {
   'danger-text': [
   // Theme
   'theme-preset-4-error', 'dark:theme-preset-4-error-dark'],
-  'inherit-text': [
-  // Theme
-  'theme-foreground-inherit', 'dark:theme-foreground-inherit-dark'],
+  'inherit-text': [],
   'primary-link': [
   // Theme
   'theme-preset-4-primary', 'dark:theme-preset-4-primary-dark'],

package/dist/bundled/v2/components/OrCheckboxV3/styles.js

@@ -17,7 +17,7 @@ const CheckboxControl = [
 // Theme
 'theme-preset-3-primary', 'dark:theme-preset-3-primary-dark', 'theme-background-default', 'dark:theme-background-default-dark', 'theme-border-1-outline', 'dark:theme-border-1-outline-dark',
 // Theme (focus)
-'focus:theme-outline-2-primary', 'dark:focus:theme-outline-2-primary-dark',
+'focus:theme-outline-primary', 'dark:focus:theme-outline-primary-dark',
 // Theme (checked)
 'checked:theme-preset-1-primary', 'dark:checked:theme-preset-1-primary-dark',
 // Theme (indeterminate)

package/dist/bundled/v2/components/OrInputBoxV3/styles.js

@@ -10,15 +10,15 @@ const InputBoxRoot = [
 const InputBoxRootVariants = {
   'styled': [
   // Theme
-  'theme-preset-3-primary', 'dark:theme-preset-3-primary-dark', 'theme-foreground-default', 'dark:theme-foreground-default-dark', 'theme-border-1-outline', 'dark:theme-border-1-outline-dark', 'theme-outline-2-transparent', 'dark:theme-outline-2-transparent',
+  'theme-preset-3-primary', 'dark:theme-preset-3-primary-dark', 'theme-foreground-default', 'dark:theme-foreground-default-dark', 'theme-border-1-outline', 'dark:theme-border-1-outline-dark', 'theme-outline-transparent', 'dark:theme-outline-transparent',
   // Theme (focus)
-  'focus-within:theme-background-primary-translucent', 'dark:focus-within:theme-background-primary-translucent-dark', 'focus-within:theme-border-1-primary', 'dark:focus-within:theme-border-1-primary-dark', 'focus-within:theme-outline-2-primary', 'dark:focus-within:theme-outline-2-primary-dark',
+  'focus-within:theme-background-primary-opacity', 'dark:focus-within:theme-background-primary-opacity-dark', 'focus-within:theme-border-1-primary', 'dark:focus-within:theme-border-1-primary-dark', 'focus-within:theme-outline-primary', 'dark:focus-within:theme-outline-primary-dark',
   // Theme (read-only)
-  'read-only:theme-background-primary-translucent', 'dark:read-only:theme-background-primary-translucent-dark', 'read-only:!border-transparent', 'dark:read-only:!border-transparent',
+  'read-only:bg-primary-opacity-0-08', 'dark:read-only:bg-primary-opacity-0-08-dark', 'read-only:!border-transparent', 'dark:read-only:!border-transparent',
   // Theme (invalid)
-  'invalid:theme-preset-3-error', 'dark:invalid:theme-preset-3-error-dark', 'invalid:theme-background-error-translucent', 'dark:invalid:theme-background-error-translucent-dark', 'invalid:theme-foreground-default', 'dark:invalid:theme-foreground-default-dark', 'invalid:theme-border-1-error', 'dark:invalid:theme-border-1-error-dark', 'invalid:theme-outline-2-transparent', 'dark:invalid:theme-outline-2-transparent',
+  'invalid:theme-preset-3-error', 'dark:invalid:theme-preset-3-error-dark', 'invalid:theme-background-error-opacity', 'dark:invalid:theme-background-error-opacity-dark', 'invalid:theme-foreground-default', 'dark:invalid:theme-foreground-default-dark', 'invalid:theme-border-1-error', 'dark:invalid:theme-border-1-error-dark', 'invalid:theme-outline-transparent', 'dark:invalid:theme-outline-transparent',
   // Theme (invalid, focus)
-  'invalid:focus-within:theme-background-error-translucent', 'dark:invalid:focus-within:theme-background-error-translucent-dark', 'invalid:focus-within:theme-border-1-error', 'dark:invalid:focus-within:theme-border-1-error-dark', 'invalid:focus-within:theme-outline-2-error', 'dark:invalid:focus-within:theme-outline-2-error-dark',
+  'invalid:focus-within:theme-background-error-opacity', 'dark:invalid:focus-within:theme-background-error-opacity-dark', 'invalid:focus-within:theme-border-1-error', 'dark:invalid:focus-within:theme-border-1-error-dark', 'invalid:focus-within:theme-outline-error', 'dark:invalid:focus-within:theme-outline-error-dark',
   // Theme (invalid, read-only)
   'invalid:read-only:bg-error-opacity-0-08', 'dark:invalid:read-only:bg-error-opacity-0-08-dark', 'invalid:read-only:!border-transparent', 'dark:invalid:read-only:!border-transparent'],
   'unstyled': [
@@ -30,14 +30,14 @@ const InputBoxRootSizes = {
   // Box
   'children:min-h-[46px] children:md:min-h-[34px]',
   // Spacing
-  'first-child:ml-md first-child:md:ml-sm+', 'last-child:mr-md last-child:md:mr-sm+', 'gap-sm+ md:gap-sm',
+  'first-child:pl-md first-child:md:pl-sm+', 'last-child:pr-md last-child:md:pr-sm+', 'gap-sm+ md:gap-sm',
   // Typography
   'typography-body-2-regular'],
   's': [
   // Box
   'children:min-h-[30px]',
   // Spacing
-  'first-child:ml-md first-child:md:ml-sm+', 'last-child:mr-md last-child:md:mr-sm+', 'gap-[6px]',
+  'first-child:pl-md first-child:md:pl-sm+', 'last-child:pr-md last-child:md:pr-sm+', 'gap-[6px]',
   // Typography
   'typography-caption-regular']
 };

package/dist/bundled/v2/components/OrMenuV3/OrMenu.js

@@ -33,7 +33,7 @@ var script = defineComponent({
     }
   },
   emits: ['update:state'],
-  expose: ['root', 'state', 'isOpen', 'open', 'close', 'toggle'],
+  expose: ['root', 'isOpen', 'open', 'close', 'toggle'],
   setup() {
     // Refs
     const root = ref();
@@ -42,10 +42,6 @@ var script = defineComponent({
       var _a;
       return (_a = popover.value) === null || _a === void 0 ? void 0 : _a.root;
     });
-    const popoverState = computed(() => {
-      var _a;
-      return (_a = popover.value) === null || _a === void 0 ? void 0 : _a.state;
-    });
     // Styles
     const rootStyles = computed(() => ['or-menu-v3', ...MenuRoot]);
     // State
@@ -85,7 +81,6 @@ var script = defineComponent({
       root,
       popover,
       popoverRoot,
-      state: popoverState,
       rootStyles,
       isOpen,
       open,

package/dist/bundled/v2/components/OrMenuV3/OrMenu.vue.d.ts

@@ -8,7 +8,6 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         [x: number]: string;
     } | {}, true> | undefined>;
     popoverRoot: import("@vue/composition-api").ComputedRef<undefined>;
-    state: import("@vue/composition-api").ComputedRef<undefined>;
     rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
     isOpen: import("@vue/composition-api").ComputedRef<undefined>;
     open: () => void;
@@ -52,7 +51,6 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         [x: number]: string;
     } | {}, true> | undefined>;
     popoverRoot: import("@vue/composition-api").ComputedRef<undefined>;
-    state: import("@vue/composition-api").ComputedRef<undefined>;
     rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
     isOpen: import("@vue/composition-api").ComputedRef<undefined>;
     open: () => void;

package/dist/bundled/v2/components/OrPopoverV3/OrPopover.js

@@ -47,8 +47,8 @@ var script = defineComponent({
       default: false
     }
   },
-  emits: ['update:state', 'update:state:open', 'update:state:fullscreen', 'update:state:closed', 'update:state:closed-automatically'],
-  expose: ['root', 'state', 'isOpen', 'isFullscreen', 'isClosed', 'open', 'close'],
+  emits: ['update:state'],
+  expose: ['root', 'state', 'isOpen', 'open', 'close'],
   setup(props, context) {
     const {
       isDesktop,
@@ -67,22 +67,9 @@ var script = defineComponent({
     // State
     const state = ref('closed');
     const isOpen = computed(() => state.value === 'open');
-    const isFullscreen = computed(() => state.value === 'fullscreen');
-    const isClosed = computed(() => state.value === 'closed');
     // Events
     watch(state, value => {
       context.emit('update:state', value);
-      switch (value) {
-        case 'open':
-          context.emit('update:state:open');
-          break;
-        case 'fullscreen':
-          context.emit('update:state:fullscreen');
-          break;
-        case 'closed':
-          context.emit('update:state:closed');
-          break;
-      }
     });
     // Methods
     function open() {
@@ -110,7 +97,7 @@ var script = defineComponent({
           break;
       }
     }
-    function close(auto = false) {
+    function close() {
       state.value = 'closed';
       switch (props.variant) {
         case PopoverVariant.Auto:
@@ -134,9 +121,6 @@ var script = defineComponent({
           });
           break;
       }
-      if (auto) {
-        context.emit('update:state:closed-automatically');
-      }
     }
     // Handlers
     function handleBottomSheetState(bottomSheetState) {
@@ -181,7 +165,7 @@ var script = defineComponent({
       if (!path.some(({
         classList
       }) => (classList === null || classList === void 0 ? void 0 : classList.contains('or-popover-v3')) || (classList === null || classList === void 0 ? void 0 : classList.contains('or-bottom-sheet-v3')))) {
-        close(true);
+        close();
       }
     }, {
       ignore: [trigger]
@@ -201,8 +185,6 @@ var script = defineComponent({
       bodyStyles,
       state,
       isOpen,
-      isFullscreen,
-      isClosed,
       open,
       close
     };
@@ -233,12 +215,7 @@ var __vue_render__ = function () {
   }, [_vm._t("default")], 2)]], 2)] : _vm._e(), _vm._v(" "), _vm.isMobile && _vm.variant === 'auto' || _vm.variant === 'bottom-sheet' ? [_c('OrBottomSheet', {
     ref: "bottomSheet",
     on: {
-      "update:state": function ($event) {
-        _vm.state = $event;
-      },
-      "update:state:closed-automatically": function ($event) {
-        return _vm.$emit('update:state:closed-automatically');
-      }
+      "update:state": _vm.handleBottomSheetState
     }
   }, [_vm._t("default")], 2)] : _vm._e()], 2)]);
 };

package/dist/bundled/v2/components/OrPopoverV3/OrPopover.vue.d.ts

@@ -13,15 +13,13 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     handleBottomSheetState: (bottomSheetState: string) => void;
     rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
     bodyStyles: import("@vue/composition-api").ComputedRef<string[]>;
-    state: import("@vue/composition-api").Ref<"open" | "fullscreen" | "closed">;
+    state: import("@vue/composition-api").Ref<"open" | "closed">;
     isOpen: import("@vue/composition-api").ComputedRef<boolean>;
-    isFullscreen: import("@vue/composition-api").ComputedRef<boolean>;
-    isClosed: import("@vue/composition-api").ComputedRef<boolean>;
     open: () => void;
-    close: (auto?: boolean) => void;
+    close: () => void;
 }> & import("@vue/composition-api").Data, {}, {}, {
     variant: {
-        type: PropType<"auto" | "popover" | "bottom-sheet">;
+        type: PropType<PopoverVariant>;
         default: PopoverVariant;
     };
     trigger: {
@@ -32,7 +30,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         default: undefined;
     };
     placement: {
-        type: PropType<"top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end">;
+        type: PropType<PopoverPlacement>;
         default: PopoverPlacement;
     };
     fullWidth: {
@@ -49,7 +47,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     };
 }, import("@vue/composition-api").ExtractPropTypes<{
     variant: {
-        type: PropType<"auto" | "popover" | "bottom-sheet">;
+        type: PropType<PopoverVariant>;
         default: PopoverVariant;
     };
     trigger: {
@@ -60,7 +58,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         default: undefined;
     };
     placement: {
-        type: PropType<"top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end">;
+        type: PropType<PopoverPlacement>;
         default: PopoverPlacement;
     };
     fullWidth: {
@@ -76,9 +74,9 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         default: boolean;
     };
 }>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
-    variant: "auto" | "popover" | "bottom-sheet";
+    variant: PopoverVariant;
     trigger: HTMLElement;
-    placement: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end";
+    placement: PopoverPlacement;
     fullWidth: boolean;
     customStyles: string[];
     disableDefaultStyles: boolean;
@@ -97,25 +95,23 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     handleBottomSheetState: (bottomSheetState: string) => void;
     rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
     bodyStyles: import("@vue/composition-api").ComputedRef<string[]>;
-    state: import("@vue/composition-api").Ref<"open" | "fullscreen" | "closed">;
+    state: import("@vue/composition-api").Ref<"open" | "closed">;
     isOpen: import("@vue/composition-api").ComputedRef<boolean>;
-    isFullscreen: import("@vue/composition-api").ComputedRef<boolean>;
-    isClosed: import("@vue/composition-api").ComputedRef<boolean>;
     open: () => void;
-    close: (auto?: boolean) => void;
+    close: () => void;
 }>, import("@vue/composition-api").Data, {}, {}, {}, {}, string[], {
-    variant: "auto" | "popover" | "bottom-sheet";
+    variant: PopoverVariant;
     trigger: HTMLElement;
-    placement: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end";
+    placement: PopoverPlacement;
     fullWidth: boolean;
     customStyles: string[];
     disableDefaultStyles: boolean;
 } & {} & {
     [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
 }, {
-    variant: "auto" | "popover" | "bottom-sheet";
+    variant: PopoverVariant;
     trigger: HTMLElement;
-    placement: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end";
+    placement: PopoverPlacement;
     fullWidth: boolean;
     customStyles: string[];
     disableDefaultStyles: boolean;

package/dist/bundled/v2/components/OrRadioV3/styles.js

@@ -15,7 +15,7 @@ const RadioControl = [
 // Theme
 'theme-preset-3-primary', 'dark:theme-preset-3-primary-dark', 'theme-background-default', 'dark:theme-background-default-dark', 'theme-border-1-outline', 'dark:theme-border-1-outline-dark',
 // Theme (focus)
-'focus:theme-outline-2-primary', 'dark:focus:theme-outline-2-primary-dark',
+'focus:theme-outline-primary', 'dark:focus:theme-outline-primary-dark',
 // Theme (checked)
 'checked:theme-preset-1-primary', 'dark:checked:theme-preset-1-primary-dark'];
 const RadioControlHandle = [

package/dist/bundled/v2/components/OrSelectV3/OrSelect.js

@@ -11,9 +11,9 @@ import __vue_component__$8 from '../OrLabelV3/OrLabel.js';
 import __vue_component__$9 from '../OrMenuItemV3/OrMenuItem.js';
 import __vue_component__$a from '../OrPopoverV3/OrPopover.js';
 import __vue_component__$b from '../OrTagV3/OrTag.js';
-import { useOverflow } from '../../hooks/useOverflow.js';
 import { DropdownClose } from '../../directives/dropdown-close.js';
 import { DropdownOpen } from '../../directives/dropdown-open.js';
+import { useOverflow } from '../../hooks/useOverflow.js';
 import { InputBoxSize } from '../OrInputBoxV3/props.js';
 import { n as normalizeComponent } from '../../normalize-component-6e8e3d80.js';
 import '@vueuse/core';

package/dist/bundled/v2/components/OrSelectV3/index.js

@@ -54,6 +54,6 @@ import '../OrMenuItemV3/styles.js';
 import '../OrTagV3/OrTag.js';
 import '../OrTagV3/props.js';
 import '../OrTagV3/styles.js';
-import '../../hooks/useOverflow.js';
 import '../../directives/dropdown-close.js';
 import '../../directives/dropdown-open.js';
+import '../../hooks/useOverflow.js';

package/dist/bundled/v2/components/OrSwitchV3/styles.js

@@ -19,7 +19,7 @@ const SwitchControl = [
 // Theme
 'theme-preset-3-primary', 'dark:theme-preset-3-primary-dark', 'theme-background-default', 'dark:theme-background-default-dark', 'theme-border-1-outline', 'dark:theme-border-1-outline-dark',
 // Theme (focus)
-'focus:theme-outline-2-primary', 'dark:focus:theme-outline-2-primary-dark',
+'focus:theme-outline-primary', 'dark:focus:theme-outline-primary-dark',
 // Theme (checked)
 'checked:theme-preset-1-primary', 'dark:checked:theme-preset-1-primary-dark'];
 const SwitchControlHandle = [

package/dist/bundled/v2/components/OrTabV3/styles.js

@@ -8,12 +8,12 @@ const TabRoot = [
 // Typography
 'typography-body-2-bold',
 // Theme
-'theme-foreground-secondary', 'dark:theme-foreground-secondary-dark', 'theme-border-2-transparent', 'dark:theme-border-2-transparent', 'theme-border-underline',
+'theme-foreground-secondary', 'dark:theme-foreground-secondary-dark', 'theme-border-2-transparent', 'dark:theme-border-2-transparent', 'theme-border-underline', 'dark:theme-border-underline',
 // Theme (hover)
 'hover:theme-foreground-default', 'dark:hover:theme-foreground-default-dark',
 // Theme (active)
-'active:theme-foreground-default', 'dark:active:theme-foreground-default-dark', 'active:theme-border-2-current', 'dark:active:theme-border-2-current', 'active:theme-border-underline',
+'active:theme-foreground-default', 'dark:active:theme-foreground-default-dark', 'active:theme-border-2-current', 'dark:active:theme-border-2-current', 'active:theme-border-underline', 'dark:active:theme-border-underline',
 // Theme (selected)
-'selected:theme-foreground-default', 'dark:selected:theme-foreground-default-dark', 'selected:theme-border-2-current', 'dark:selected:theme-border-2-current', 'selected:theme-border-underline'];
+'selected:theme-foreground-default', 'dark:selected:theme-foreground-default-dark', 'selected:theme-border-2-current', 'dark:selected:theme-border-2-current', 'selected:theme-border-underline', 'dark:selected:theme-border-underline'];
 
 export { TabRoot };

package/dist/bundled/v2/components/OrTabsV3/styles.js

@@ -6,7 +6,7 @@ const TabsRoot = [
 // Spacing
 'gap-md',
 // Theme
-'theme-border-1-outline', 'dark:theme-border-1-outline', 'theme-border-underline'];
+'theme-border-1-outline', 'dark:theme-border-1-outline', 'theme-border-underline', 'dark:theme-border-underline'];
 const TabsRootVariants = {
   'default': [
   // Layout

package/dist/bundled/v2/components/OrToastContainerV3/OrToastContainer.js

@@ -1,11 +1,12 @@
 import { useToggle } from '@vueuse/core';
-import { defineComponent, computed, onBeforeMount, onBeforeUnmount, nextTick } from 'vue-demi';
+import { defineComponent, ref, computed, onBeforeMount, onBeforeUnmount, nextTick } from 'vue-demi';
 import useQueue from '../OrToastV3/composable/useQueue.js';
 import useToastEventBus from '../OrToastV3/composable/useToastEventBus.js';
 import __vue_component__$2 from '../OrToastV3/OrToast.js';
 import { P as PositionsX, a as PositionsY, T as TransitionType } from '../../props-7be029c7.js';
 import { ToastContainer, ToastContainerPositions } from '../OrToastV3/styles.js';
 import __vue_component__$1 from '../OrTeleportV3/OrTeleport.js';
+import { useElevation } from '../../hooks/useElevation.js';
 import { s as styleInject } from '../../style-inject.es-4c6f2515.js';
 import { n as normalizeComponent } from '../../normalize-component-6e8e3d80.js';
 import '../OrIconButtonV3/OrIconButton.js';
@@ -24,13 +25,12 @@ import '../OrBottomSheetV3/OrBottomSheet.js';
 import '../OrBottomSheetV3/styles.js';
 import '../OrOverlayV3/OrOverlay.js';
 import '../OrOverlayV3/styles.js';
-import '../../hooks/useElevation.js';
-import '../../utils/isVisible.js';
 import '../../hooks/useResponsive/useResponsive.js';
 import '../OrLoaderV3/OrLoader.js';
 import '../OrLoaderV3/props.js';
 import '../OrLoaderV3/styles.js';
 import 'portal-vue';
+import '../../utils/isVisible.js';
 
 var script = defineComponent({
   name: 'OrToastContainer',
@@ -56,6 +56,8 @@ var script = defineComponent({
     }
   },
   setup(props) {
+    // Refs
+    const root = ref();
     const {
       on,
       off
@@ -145,6 +147,7 @@ var script = defineComponent({
       off('toastUpdate', toastUpdate);
       off('toastCloseAll', clearAll);
     });
+    useElevation(root, isActive);
     return {
       on,
       off,
@@ -157,6 +160,7 @@ var script = defineComponent({
       clearAll,
       getItem,
       queue,
+      root,
       createToast,
       toastUpdate,
       toastRemove,
@@ -168,7 +172,7 @@ var script = defineComponent({
   }
 });
 
-var css_248z = ".or-toast-container[data-v-0eb6626c]{z-index:26}.or-toast--transition-slide-enter-active[data-v-0eb6626c],.or-toast--transition-slide-leave-active[data-v-0eb6626c]{transition:transform .4s ease}.or-toast--transition-slide-enter-from.or-toast--position-right[data-v-0eb6626c],.or-toast--transition-slide-leave-to.or-toast--position-right[data-v-0eb6626c]{transform:translateX(999px)}.or-toast--transition-slide-enter-from.or-toast--position-left[data-v-0eb6626c],.or-toast--transition-slide-leave-to.or-toast--position-left[data-v-0eb6626c]{transform:translateX(-999px)}.or-toast--transition-fade-enter-active[data-v-0eb6626c],.or-toast--transition-fade-leave-active[data-v-0eb6626c]{transition:opacity .4s ease}.or-toast--transition-fade-enter-from[data-v-0eb6626c],.or-toast--transition-fade-leave-to[data-v-0eb6626c]{opacity:0}";
+var css_248z = ".or-toast--transition-slide-enter-active[data-v-9c5633de],.or-toast--transition-slide-leave-active[data-v-9c5633de]{transition:transform .4s ease}.or-toast--transition-slide-enter-from.or-toast--position-right[data-v-9c5633de],.or-toast--transition-slide-leave-to.or-toast--position-right[data-v-9c5633de]{transform:translateX(999px)}.or-toast--transition-slide-enter-from.or-toast--position-left[data-v-9c5633de],.or-toast--transition-slide-leave-to.or-toast--position-left[data-v-9c5633de]{transform:translateX(-999px)}.or-toast--transition-fade-enter-active[data-v-9c5633de],.or-toast--transition-fade-leave-active[data-v-9c5633de]{transition:opacity .4s ease}.or-toast--transition-fade-enter-from[data-v-9c5633de],.or-toast--transition-fade-leave-to[data-v-9c5633de]{opacity:0}";
 styleInject(css_248z);
 
 /* script */
@@ -178,10 +182,14 @@ var __vue_render__ = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
-  return _vm.isActive ? _c('OrTeleport', [_c('div', {
+  return _c('OrTeleport', {
+    attrs: {
+      "disabled": _vm.isActive
+    }
+  }, [_c('div', {
+    ref: "root",
     class: _vm.classes
   }, [_c('TransitionGroup', {
-    class: ['contents'],
     attrs: {
       "name": _vm.transitionName
     },
@@ -206,14 +214,14 @@ var __vue_render__ = function () {
         }
       }
     }, 'OrToast', toastConfiguration.toastProps, false));
-  }), 1)], 1)]) : _vm._e();
+  }), 1)], 1)]);
 };
 var __vue_staticRenderFns__ = [];
 
 /* style */
 const __vue_inject_styles__ = undefined;
 /* scoped */
-const __vue_scope_id__ = "data-v-0eb6626c";
+const __vue_scope_id__ = "data-v-9c5633de";
 /* module identifier */
 const __vue_module_identifier__ = undefined;
 /* functional template */