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

package/dist/bundled/v2/components/OrDateTimePickerV3/OrDateTimePicker.vue.d.ts

@@ -0,0 +1,236 @@
+import { PropType } from 'vue-demi';
+import { DateTimePickerSize } from './props';
+import { FilterFunction } from './types';
+declare const _default: import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<{
+    root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
+    inputBox: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
+        [x: string]: ((...args: any[]) => any) | null;
+    } | string[], {} & {}, {
+        [x: number]: string;
+    } | {}, true> | undefined>;
+    inputBoxRoot: import("@vue/composition-api").ComputedRef<undefined>;
+    datePopover: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
+        [x: string]: ((...args: any[]) => any) | null;
+    } | string[], {} & {}, {
+        [x: number]: string;
+    } | {}, true> | undefined>;
+    datePopoverState: import("@vue/composition-api").ComputedRef<undefined>;
+    timePopover: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
+        [x: string]: ((...args: any[]) => any) | null;
+    } | string[], {} & {}, {
+        [x: number]: string;
+    } | {}, true> | undefined>;
+    timePopoverState: import("@vue/composition-api").ComputedRef<undefined>;
+    rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
+    datePopoverStyles: import("@vue/composition-api").ComputedRef<string[]>;
+    timePopoverStyles: import("@vue/composition-api").ComputedRef<string[]>;
+    initialModelValue: Date;
+    proxyModelValue: import("@vue/composition-api").WritableComputedRef<Date>;
+    draftModelValue: import("@vue/composition-api").Ref<Date | undefined>;
+    apply: () => void;
+    reset: () => void;
+    toggleDatePopover: () => void;
+    toggleTimePopover: () => void;
+    closeDatePopover: () => void;
+    closeTimePopover: () => void;
+    formatDateAlt: (value?: Date) => string;
+    formatTimeAlt: (value?: Date) => string;
+}> & import("@vue/composition-api").Data, {}, {}, {
+    modelValue: {
+        type: DateConstructor;
+        default: undefined;
+    };
+    yearFilter: {
+        type: PropType<FilterFunction>;
+        default: undefined;
+    };
+    monthFilter: {
+        type: PropType<FilterFunction>;
+        default: undefined;
+    };
+    dateFilter: {
+        type: PropType<FilterFunction>;
+        default: undefined;
+    };
+    hoursFilter: {
+        type: PropType<FilterFunction>;
+        default: undefined;
+    };
+    minutesFilter: {
+        type: PropType<FilterFunction>;
+        default: undefined;
+    };
+    size: {
+        type: PropType<DateTimePickerSize>;
+        default: DateTimePickerSize;
+    };
+    label: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    hint: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    error: {
+        type: (BooleanConstructor | StringConstructor)[];
+        default: undefined;
+    };
+    required: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    readonly: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    disableDefaultStyles: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}, import("@vue/composition-api").ExtractPropTypes<{
+    modelValue: {
+        type: DateConstructor;
+        default: undefined;
+    };
+    yearFilter: {
+        type: PropType<FilterFunction>;
+        default: undefined;
+    };
+    monthFilter: {
+        type: PropType<FilterFunction>;
+        default: undefined;
+    };
+    dateFilter: {
+        type: PropType<FilterFunction>;
+        default: undefined;
+    };
+    hoursFilter: {
+        type: PropType<FilterFunction>;
+        default: undefined;
+    };
+    minutesFilter: {
+        type: PropType<FilterFunction>;
+        default: undefined;
+    };
+    size: {
+        type: PropType<DateTimePickerSize>;
+        default: DateTimePickerSize;
+    };
+    label: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    hint: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    error: {
+        type: (BooleanConstructor | StringConstructor)[];
+        default: undefined;
+    };
+    required: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    readonly: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    disableDefaultStyles: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
+    modelValue: Date;
+    yearFilter: FilterFunction;
+    monthFilter: FilterFunction;
+    dateFilter: FilterFunction;
+    hoursFilter: FilterFunction;
+    minutesFilter: FilterFunction;
+    size: DateTimePickerSize;
+    label: string;
+    hint: string;
+    error: string | boolean;
+    required: boolean;
+    readonly: boolean;
+    disabled: boolean;
+    disableDefaultStyles: boolean;
+} & {} & {
+    [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
+}, import("@vue/composition-api").ShallowUnwrapRef<{
+    root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
+    inputBox: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
+        [x: string]: ((...args: any[]) => any) | null;
+    } | string[], {} & {}, {
+        [x: number]: string;
+    } | {}, true> | undefined>;
+    inputBoxRoot: import("@vue/composition-api").ComputedRef<undefined>;
+    datePopover: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
+        [x: string]: ((...args: any[]) => any) | null;
+    } | string[], {} & {}, {
+        [x: number]: string;
+    } | {}, true> | undefined>;
+    datePopoverState: import("@vue/composition-api").ComputedRef<undefined>;
+    timePopover: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
+        [x: string]: ((...args: any[]) => any) | null;
+    } | string[], {} & {}, {
+        [x: number]: string;
+    } | {}, true> | undefined>;
+    timePopoverState: import("@vue/composition-api").ComputedRef<undefined>;
+    rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
+    datePopoverStyles: import("@vue/composition-api").ComputedRef<string[]>;
+    timePopoverStyles: import("@vue/composition-api").ComputedRef<string[]>;
+    initialModelValue: Date;
+    proxyModelValue: import("@vue/composition-api").WritableComputedRef<Date>;
+    draftModelValue: import("@vue/composition-api").Ref<Date | undefined>;
+    apply: () => void;
+    reset: () => void;
+    toggleDatePopover: () => void;
+    toggleTimePopover: () => void;
+    closeDatePopover: () => void;
+    closeTimePopover: () => void;
+    formatDateAlt: (value?: Date) => string;
+    formatTimeAlt: (value?: Date) => string;
+}>, import("@vue/composition-api").Data, {}, {}, {}, {}, string[], {
+    modelValue: Date;
+    yearFilter: FilterFunction;
+    monthFilter: FilterFunction;
+    dateFilter: FilterFunction;
+    hoursFilter: FilterFunction;
+    minutesFilter: FilterFunction;
+    size: DateTimePickerSize;
+    label: string;
+    hint: string;
+    error: string | boolean;
+    required: boolean;
+    readonly: boolean;
+    disabled: boolean;
+    disableDefaultStyles: boolean;
+} & {} & {
+    [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
+}, {
+    modelValue: Date;
+    yearFilter: FilterFunction;
+    monthFilter: FilterFunction;
+    dateFilter: FilterFunction;
+    hoursFilter: FilterFunction;
+    minutesFilter: FilterFunction;
+    size: DateTimePickerSize;
+    label: string;
+    hint: string;
+    error: string | boolean;
+    required: boolean;
+    readonly: boolean;
+    disabled: boolean;
+    disableDefaultStyles: boolean;
+}, true>);
+export default _default;

package/dist/bundled/v2/components/OrDateTimePickerV3/hooks/useCurrentDate.d.ts

@@ -0,0 +1 @@
+export declare function useCurrentDate(): Date;

package/dist/bundled/v2/components/OrDateTimePickerV3/hooks/useCurrentDate.js

@@ -0,0 +1,6 @@
+function useCurrentDate() {
+  const currentDate = new Date();
+  return new Date(Date.UTC(currentDate.getUTCFullYear(), currentDate.getUTCMonth(), currentDate.getUTCDate()));
+}
+
+export { useCurrentDate };

package/dist/bundled/v2/components/OrDateTimePickerV3/hooks/useDatePlaceholder.d.ts

@@ -0,0 +1 @@
+export declare function useDatePlaceholder(): string;

package/dist/bundled/v2/components/OrDateTimePickerV3/hooks/useDatePlaceholder.js

@@ -0,0 +1,9 @@
+function useDatePlaceholder() {
+  const sample = new Date(Date.UTC(1111, 1, 3, 4, 5)).toLocaleString(navigator.language, {
+    dateStyle: 'short',
+    timeZone: 'UTC'
+  });
+  return sample.replace(/1/g, 'Y').replace(/02/, 'MM').replace(/2/, 'M').replace(/03/g, 'DD').replace(/3/, 'D');
+}
+
+export { useDatePlaceholder };

package/dist/bundled/v2/components/OrDateTimePickerV3/hooks/useTimePlaceholder.d.ts

@@ -0,0 +1 @@
+export declare function useTimePlaceholder(): string;

package/dist/bundled/v2/components/OrDateTimePickerV3/hooks/useTimePlaceholder.js

@@ -0,0 +1,9 @@
+function useTimePlaceholder() {
+  const sample = new Date(Date.UTC(1, 1, 3, 4, 5)).toLocaleString(navigator.language, {
+    timeStyle: 'short',
+    timeZone: 'UTC'
+  });
+  return sample.replace(/04/, 'HH').replace(/4/, 'H').replace(/05/, 'MM').replace(/5/, 'M').replace(/AM|PM/, 'A');
+}
+
+export { useTimePlaceholder };

package/dist/bundled/v2/components/OrDateTimePickerV3/index.d.ts

@@ -0,0 +1,3 @@
+export { default as OrDateTimePickerV3 } from './OrDateTimePicker.vue';
+export * from './props';
+export * from './types';

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

@@ -0,0 +1,54 @@
+export { default as OrDateTimePickerV3 } from './OrDateTimePicker.js';
+export { InputBoxSize as DateTimePickerSize } from '../OrInputBoxV3/props.js';
+import 'vue-demi';
+import './hooks/useCurrentDate.js';
+import '../../OrDateTimePickerMonthSelect-e20fd8dc.js';
+import './hooks/useDatePlaceholder.js';
+import '../../normalize-component-6e8e3d80.js';
+import '../OrButtonV3/OrButton.js';
+import '../OrButtonV3/props.js';
+import '../OrButtonV3/styles.js';
+import '../OrLoaderV3/OrLoader.js';
+import '@vueuse/core';
+import '../OrLoaderV3/props.js';
+import '../OrLoaderV3/styles.js';
+import '../OrIconV3/OrIcon.js';
+import '../OrIconV3/props.js';
+import '../OrIconV3/styles.js';
+import '../OrIconButtonV3/OrIconButton.js';
+import '../OrIconButtonV3/props.js';
+import '../OrIconButtonV3/styles.js';
+import '../OrTooltipV3/OrTooltip.js';
+import '../OrTooltipV3/styles.js';
+import '../OrPopoverV3/OrPopover.js';
+import '../../floating-ui.dom.esm-83eba816.js';
+import '../OrPopoverV3/props.js';
+import '../OrPopoverV3/styles.js';
+import '../OrBottomSheetV3/OrBottomSheet.js';
+import '../OrBottomSheetV3/styles.js';
+import '../OrOverlayV3/OrOverlay.js';
+import '../OrOverlayV3/styles.js';
+import '../OrTeleportV3/OrTeleport.js';
+import 'portal-vue';
+import '../../hooks/useElevation.js';
+import '../../utils/isVisible.js';
+import '../../hooks/useResponsive/useResponsive.js';
+import '../OrMenuV3/OrMenu.js';
+import '../OrMenuV3/styles.js';
+import '../OrMenuItemV3/OrMenuItem.js';
+import '../OrMenuItemV3/styles.js';
+import '../../OrDateTimePickerPopoverHeader-7c87f38a.js';
+import '../OrLabelV3/OrLabel.js';
+import '../OrLabelV3/props.js';
+import '../OrLabelV3/styles.js';
+import '../../OrDateTimePickerTimeSelect-aa60911c.js';
+import './hooks/useTimePlaceholder.js';
+import './styles.js';
+import '../OrErrorV3/OrError.js';
+import '../OrErrorV3/styles.js';
+import '../OrHintV3/OrHint.js';
+import '../OrHintV3/styles.js';
+import '../OrInputBoxV3/OrInputBox.js';
+import '../OrInputBoxV3/styles.js';
+import '../../directives/dropdown-close.js';
+import '../../directives/dropdown-open.js';

package/dist/bundled/v2/components/OrDateTimePickerV3/props.d.ts

@@ -0,0 +1 @@
+export { InputBoxSize as DateTimePickerSize } from '../or-input-box-v3';

package/dist/bundled/v2/components/OrDateTimePickerV3/props.js

@@ -0,0 +1 @@
+export { InputBoxSize as DateTimePickerSize } from '../OrInputBoxV3/props.js';

package/dist/bundled/v2/components/OrDateTimePickerV3/styles.d.ts

@@ -0,0 +1,3 @@
+export declare const DateTimePicker: string[];
+export declare const DateTimePickerDatePopover: string[];
+export declare const DateTimePickerTimePopover: string[];

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

@@ -0,0 +1,13 @@
+const DateTimePicker = [
+// Layout
+'layout-column',
+// Spacing
+'gap-xs'];
+const DateTimePickerDatePopover = [
+// Box
+'w-[298px]'];
+const DateTimePickerTimePopover = [
+// Box
+'w-[224px]'];
+
+export { DateTimePicker, DateTimePickerDatePopover, DateTimePickerTimePopover };

package/dist/bundled/v2/components/OrDateTimePickerV3/types.d.ts

@@ -0,0 +1,3 @@
+export interface FilterFunction {
+    (value: Date): boolean;
+}

package/dist/bundled/v2/components/OrDateTimePickerV3/types.js

@@ -0,0 +1 @@
+

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-transparent', 'dark:theme-outline-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-2-transparent', 'dark:theme-outline-2-transparent',
   // Theme (focus)
-  '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',
+  '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',
   // Theme (read-only)
-  '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',
+  'read-only:theme-background-primary-translucent', 'dark:read-only:theme-background-primary-translucent-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-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',
+  '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',
   // Theme (invalid, focus)
-  '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',
+  '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',
   // 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:pl-md first-child:md:pl-sm+', 'last-child:pr-md last-child:md:pr-sm+', 'gap-sm+ md:gap-sm',
+  'first-child:ml-md first-child:md:ml-sm+', 'last-child:mr-md last-child:md:mr-sm+', 'gap-sm+ md:gap-sm',
   // Typography
   'typography-body-2-regular'],
   's': [
   // Box
   'children:min-h-[30px]',
   // Spacing
-  'first-child:pl-md first-child:md:pl-sm+', 'last-child:pr-md last-child:md:pr-sm+', 'gap-[6px]',
+  'first-child:ml-md first-child:md:ml-sm+', 'last-child:mr-md last-child:md:mr-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', 'isOpen', 'open', 'close', 'toggle'],
+  expose: ['root', 'state', 'isOpen', 'open', 'close', 'toggle'],
   setup() {
     // Refs
     const root = ref();
@@ -42,6 +42,10 @@ 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
@@ -81,6 +85,7 @@ var script = defineComponent({
       root,
       popover,
       popoverRoot,
+      state: popoverState,
       rootStyles,
       isOpen,
       open,

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

@@ -8,6 +8,7 @@ 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;
@@ -51,6 +52,7 @@ 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'],
-  expose: ['root', 'state', 'isOpen', 'open', 'close'],
+  emits: ['update:state', 'update:state:open', 'update:state:fullscreen', 'update:state:closed', 'update:state:closed-automatically'],
+  expose: ['root', 'state', 'isOpen', 'isFullscreen', 'isClosed', 'open', 'close'],
   setup(props, context) {
     const {
       isDesktop,
@@ -67,9 +67,22 @@ 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() {
@@ -97,7 +110,7 @@ var script = defineComponent({
           break;
       }
     }
-    function close() {
+    function close(auto = false) {
       state.value = 'closed';
       switch (props.variant) {
         case PopoverVariant.Auto:
@@ -121,6 +134,9 @@ var script = defineComponent({
           });
           break;
       }
+      if (auto) {
+        context.emit('update:state:closed-automatically');
+      }
     }
     // Handlers
     function handleBottomSheetState(bottomSheetState) {
@@ -165,7 +181,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();
+        close(true);
       }
     }, {
       ignore: [trigger]
@@ -185,6 +201,8 @@ var script = defineComponent({
       bodyStyles,
       state,
       isOpen,
+      isFullscreen,
+      isClosed,
       open,
       close
     };
@@ -215,7 +233,12 @@ 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": _vm.handleBottomSheetState
+      "update:state": function ($event) {
+        _vm.state = $event;
+      },
+      "update:state:closed-automatically": function ($event) {
+        return _vm.$emit('update:state:closed-automatically');
+      }
     }
   }, [_vm._t("default")], 2)] : _vm._e()], 2)]);
 };

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

@@ -13,13 +13,15 @@ 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" | "closed">;
+    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>;
     open: () => void;
-    close: () => void;
+    close: (auto?: boolean) => void;
 }> & import("@vue/composition-api").Data, {}, {}, {
     variant: {
-        type: PropType<PopoverVariant>;
+        type: PropType<"auto" | "popover" | "bottom-sheet">;
         default: PopoverVariant;
     };
     trigger: {
@@ -30,7 +32,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         default: undefined;
     };
     placement: {
-        type: PropType<PopoverPlacement>;
+        type: PropType<"top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end">;
         default: PopoverPlacement;
     };
     fullWidth: {
@@ -47,7 +49,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     };
 }, import("@vue/composition-api").ExtractPropTypes<{
     variant: {
-        type: PropType<PopoverVariant>;
+        type: PropType<"auto" | "popover" | "bottom-sheet">;
         default: PopoverVariant;
     };
     trigger: {
@@ -58,7 +60,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         default: undefined;
     };
     placement: {
-        type: PropType<PopoverPlacement>;
+        type: PropType<"top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end">;
         default: PopoverPlacement;
     };
     fullWidth: {
@@ -74,9 +76,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: PopoverVariant;
+    variant: "auto" | "popover" | "bottom-sheet";
     trigger: HTMLElement;
-    placement: PopoverPlacement;
+    placement: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end";
     fullWidth: boolean;
     customStyles: string[];
     disableDefaultStyles: boolean;
@@ -95,23 +97,25 @@ 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" | "closed">;
+    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>;
     open: () => void;
-    close: () => void;
+    close: (auto?: boolean) => void;
 }>, import("@vue/composition-api").Data, {}, {}, {}, {}, string[], {
-    variant: PopoverVariant;
+    variant: "auto" | "popover" | "bottom-sheet";
     trigger: HTMLElement;
-    placement: PopoverPlacement;
+    placement: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end";
     fullWidth: boolean;
     customStyles: string[];
     disableDefaultStyles: boolean;
 } & {} & {
     [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
 }, {
-    variant: PopoverVariant;
+    variant: "auto" | "popover" | "bottom-sheet";
     trigger: HTMLElement;
-    placement: PopoverPlacement;
+    placement: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end";
     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-primary', 'dark:focus:theme-outline-primary-dark',
+'focus:theme-outline-2-primary', 'dark:focus:theme-outline-2-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';