@onereach/ui-components 4.1.1-beta.2541.0 → 4.1.1

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/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 '../OrCheckboxV3/styles.js';
@@ -210,6 +210,8 @@ var script = defineComponent({
       } else {
         internalSearchOptions.value = await props.searchFunction(searchText, options);
       }
+    }, {
+      deep: true
     });
     const groupedOptions = computed(() => {
       const groupBy = props.groupByFunction;

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/index.d.ts

@@ -17,13 +17,11 @@ export * from './or-collapse';
 export * from './or-color-picker';
 export * from './or-confirm';
 export * from './or-confirm-v3';
-export * from './or-date-picker-v3';
 export * from './or-date-time-picker';
-export * from './or-date-time-picker-v3';
-export * from './or-empty-state-v3';
 export * from './or-error';
 export * from './or-error-tag-v3';
 export * from './or-error-v3';
+export * from './or-empty-state-v3';
 export * from './or-expansion-panel-v3';
 export * from './or-fab-v3';
 export * from './or-floating';
@@ -37,9 +35,9 @@ export * from './or-inline-input-box-v3';
 export * from './or-inline-input-v3';
 export * from './or-inline-text-edit';
 export * from './or-inline-textarea-v3';
-export * from './or-input';
 export * from './or-input-box-v3';
 export * from './or-input-v3';
+export * from './or-input';
 export * from './or-label';
 export * from './or-label-v3';
 export * from './or-link-v3';
@@ -57,8 +55,8 @@ export * from './or-number-input';
 export * from './or-overflow-menu';
 export * from './or-overlay';
 export * from './or-overlay-v3';
-export * from './or-pagination-v3';
 export * from './or-password';
+export * from './or-pagination-v3';
 export * from './or-popover-v3';
 export * from './or-progress';
 export * from './or-progress-v3';
@@ -92,7 +90,6 @@ export * from './or-text-v3';
 export * from './or-textarea';
 export * from './or-textarea-v3';
 export * from './or-textbox';
-export * from './or-time-picker-v3';
 export * from './or-toast';
 export * from './or-toast-v3';
 export * from './or-tooltip';

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

@@ -30,16 +30,13 @@ export { amber, black, blue, blueGrey, brown, cyan, deepOrange, deepPurple, gree
 export { default as OrConfirm } from './OrConfirm/OrConfirm.js';
 export { default as OrConfirmV3 } from './OrConfirmV3/OrConfirm.js';
 export { ConfirmType } from './OrConfirmV3/props.js';
-export { default as OrDatePickerV3 } from './OrDatePickerV3/OrDatePicker.js';
-export { InputBoxSize as DatePickerSize, InputBoxSize as DateTimePickerSize, InputBoxSize, InputBoxVariant, InputBoxSize as InputSize, InputBoxSize as SearchSize, InputBoxSize as SelectSize, InputBoxSize as TextareaSize, InputBoxSize as TimePickerSize } from './OrInputBoxV3/props.js';
 export { default as OrDateTimePicker } from './OrDateTimePicker/OrDateTimePicker.js';
 export { DEFAULT_TEXT, OrDateTimePickerItemTypes, OrDateTimePickerTypes } from './OrDateTimePicker/constants.js';
-export { default as OrDateTimePickerV3 } from './OrDateTimePickerV3/OrDateTimePicker.js';
-export { default as OrEmptyStateV3 } from './OrEmptyStateV3/OrEmptyState.js';
-export { EmptyStateSize } from './OrEmptyStateV3/props.js';
 export { default as OrError } from './OrError/OrError.js';
 export { default as OrErrorTagV3 } from './OrErrorTagV3/OrErrorTag.js';
 export { default as OrErrorV3 } from './OrErrorV3/OrError.js';
+export { default as OrEmptyStateV3 } from './OrEmptyStateV3/OrEmptyState.js';
+export { EmptyStateSize } from './OrEmptyStateV3/props.js';
 export { default as OrExpansionPanelV3 } from './OrExpansionPanelV3/OrExpansionPanel.js';
 export { ExpansionPanelColor, ExpansionPanelVariant } from './OrExpansionPanelV3/props.js';
 export { default as OrFabV3 } from './OrFabV3/OrFab.js';
@@ -61,10 +58,11 @@ export { InlineInputType } from './OrInlineInputV3/props.js';
 export { default as OrInlineTextEdit } from './OrInlineTextEdit/OrInlineTextEdit.js';
 export { InlineTextEditTrimmingTypes, InlineTextEditTypes } from './OrInlineTextEdit/constants.js';
 export { default as OrInlineTextareaV3 } from './OrInlineTextareaV3/OrInlineTextarea.js';
-export { default as OrInput } from './OrInput/OrInput.js';
 export { default as OrInputBoxV3 } from './OrInputBoxV3/OrInputBox.js';
+export { InputBoxSize, InputBoxVariant, InputBoxSize as InputSize, InputBoxSize as SearchSize, InputBoxSize as SelectSize, InputBoxSize as TextareaSize } from './OrInputBoxV3/props.js';
 export { default as OrInputV3 } from './OrInputV3/OrInput.js';
 export { InputType } from './OrInputV3/props.js';
+export { default as OrInput } from './OrInput/OrInput.js';
 export { default as OrLabel } from './OrLabel/OrLabel.js';
 export { default as OrLabelV3 } from './OrLabelV3/OrLabel.js';
 export { LabelVariant } from './OrLabelV3/props.js';
@@ -91,8 +89,8 @@ export { default as OrNumberInput } from './OrNumberInput/OrNumberInput.js';
 export { default as OrOverflowMenu } from './OrOverflowMenu/OrOverflowMenu.js';
 export { default as OrOverlay } from './OrOverlay/OrOverlay.js';
 export { default as OrOverlayV3 } from './OrOverlayV3/OrOverlay.js';
-export { default as OrPaginationV3 } from './OrPaginationV3/OrPagination.js';
 export { default as OrPassword } from './OrPassword/OrPassword.js';
+export { default as OrPaginationV3 } from './OrPaginationV3/OrPagination.js';
 export { default as OrPopoverV3 } from './OrPopoverV3/OrPopover.js';
 export { default as OrProgress } from './OrProgress/OrProgress.js';
 export { OrProgressColors, OrProgressTypes } from './OrProgress/constants.js';
@@ -139,7 +137,6 @@ export { default as OrTextarea } from './OrTextarea/OrTextarea.js';
 export { default as OrTextareaV3 } from './OrTextareaV3/OrTextarea.js';
 export { default as OrTextbox } from './OrTextbox/OrTextbox.js';
 export { TextboxTypes } from './OrTextbox/constants.js';
-export { default as OrTimePickerV3 } from './OrTimePickerV3/OrTimePicker.js';
 export { default as OrToast } from './OrToast/OrToast.js';
 export { default as OrToastContainer } from './OrToastContainer/OrToastContainer.js';
 export { default as useToast } from './OrToast/composable/useToast.js';
@@ -202,22 +199,8 @@ import './OrCode/theme.js';
 import './OrColorPicker/utils/defultPalette.js';
 import '../index-63e094a0.js';
 import './OrConfirmV3/styles.js';
-import '../OrDateTimePickerMonthSelect-5aa2774a.js';
-import './OrDateTimePickerV3/hooks/useDatePlaceholder.js';
-import './OrDateTimePickerV3/hooks/useDefaultDate.js';
-import './OrDateTimePickerV3/hooks/useDefaultHours.js';
-import './OrDateTimePickerV3/hooks/useDefaultMinutes.js';
-import './OrDateTimePickerV3/hooks/useDefaultMonth.js';
-import './OrDateTimePickerV3/hooks/useDefaultYear.js';
-import '../OrDateTimePickerPopoverHeader-40001d2f.js';
-import './OrDatePickerV3/styles.js';
-import '../directives/dropdown-close.js';
-import '../directives/dropdown-open.js';
-import '../OrDateTimePickerTimeSelect-153a174a.js';
-import './OrDateTimePickerV3/hooks/useTimePlaceholder.js';
-import './OrDateTimePickerV3/styles.js';
-import './OrEmptyStateV3/styles.js';
 import './OrErrorTagV3/styles.js';
+import './OrEmptyStateV3/styles.js';
 import './OrExpansionPanelV3/styles.js';
 import './OrFabV3/styles.js';
 import './OrInlineInputBoxV3/styles.js';
@@ -227,13 +210,15 @@ import './OrLinkV3/styles.js';
 import '../v4-cf8987a3.js';
 import './OrModalV3/styles.js';
 import './OrNotificationV3/styles.js';
-import './OrPaginationV3/styles.js';
 import '../hooks/useToggle.js';
+import './OrPaginationV3/styles.js';
 import './OrProgressV3/styles.js';
 import './OrRadioV3/styles.js';
 import './OrSegmentedControlV3/styles.js';
 import './OrSelect/constants.js';
 import './OrSelectV3/styles.js';
+import '../directives/dropdown-close.js';
+import '../directives/dropdown-open.js';
 import '../hooks/useOverflow.js';
 import './OrTagV3/styles.js';
 import './OrSidebarV3/styles.js';
@@ -244,7 +229,6 @@ import './OrTabV3/styles.js';
 import './OrTabsV3/styles.js';
 import './OrTextV3/styles.js';
 import './OrTextareaV3/styles.js';
-import './OrTimePickerV3/styles.js';
 import './OrToast/composable/useToastEventBus.js';
 import './OrToast/Timer.js';
 import './OrToastV3/styles.js';

package/dist/bundled/v2/directives/dropdown-close.js

@@ -3,7 +3,6 @@ import { isVue3 } from 'vue-demi';
 const created = (element, binding) => {
   element.addEventListener('keydown', event => {
     event.preventDefault();
-    event.stopPropagation();
     if (['Escape'].includes(event.key)) {
       binding.value(event);
     }

package/dist/bundled/v2/directives/dropdown-open.js

@@ -3,16 +3,11 @@ import { isVue3 } from 'vue-demi';
 const created = (element, binding) => {
   element.addEventListener('keydown', event => {
     event.preventDefault();
-    event.stopPropagation();
     if (['Enter', ' '].includes(event.key)) {
       binding.value(event);
     }
   });
-  element.addEventListener('click', event => {
-    event.preventDefault();
-    event.stopPropagation();
-    binding.value(event);
-  });
+  element.addEventListener('click', binding.value);
 };
 const DropdownOpen = {
   [isVue3 ? 'created' : 'bind']: created