@onereach/ui-components 2.70.0-beta.2185.0 → 2.70.0-beta.2206.0

package/dist/bundled/v3/{OrCollapse.vue_vue_type_script_lang-76b28b03.js → OrCollapse.vue_vue_type_script_lang-e22b5a76.js}

@@ -1,6 +1,6 @@
 import { defineComponent, ref, computed, onBeforeUnmount, watch } from 'vue-demi';
-import { p as pxToRem } from './px-to-rem-0b26b83e.js';
-import { s as setStyle, r as requestAF, b as reflow, d as removeStyle, c as cancelAF, e as getBCR } from './dom-a98e78cb.js';
+import { pxToRem } from './utils/functions/px-to-rem.js';
+import { setStyle, requestAF, reflow, removeStyle, cancelAF, getBCR } from './utils/functions/dom.js';
 import _ from 'lodash';
 
 var script = defineComponent({

package/dist/bundled/v3/OrColorPicker.vue_vue_type_script_lang-7987074d.js

@@ -0,0 +1,58 @@
+import Palette from './components/OrColorPicker/constants.js';
+import { defineComponent, ref } from 'vue-demi';
+import { useToggle, onClickOutside } from '@vueuse/core';
+import defaultPalette from './components/OrColorPicker/defultPalette.js';
+import './components/OrFloating/OrFloating.js';
+import { s as script$1 } from './OrFloating.vue_vue_type_script_lang-66ce28ae.js';
+import { OrFloatingPlacements } from './components/OrFloating/constants.js';
+
+var script = defineComponent({
+  name: 'OrColorPicker',
+  components: {
+    OrFloating: script$1
+  },
+  props: {
+    palette: {
+      type: Object,
+      default: defaultPalette
+    },
+    defaultColor: {
+      type: String,
+      default: '#fff'
+    },
+    placement: {
+      type: String,
+      required: false,
+      default: OrFloatingPlacements.BOTTOM_START
+    }
+  },
+  emits: ['select'],
+  setup() {
+    const selected = ref(null);
+    const [isActive, toggle] = useToggle(false);
+    const trigger = ref(null);
+    onClickOutside(trigger, () => {
+      if (isActive.value) toggle();
+    });
+    return {
+      trigger,
+      toggle,
+      isActive,
+      selected
+    };
+  },
+  computed: {},
+  methods: {
+    getClass(tone) {
+      return ['or-color-picker-color-it', {
+        'or-color-picker-color--white': tone === Palette.white.default
+      }];
+    },
+    handlerClick(color) {
+      this.selected = color;
+      this.$emit('select', color);
+    }
+  }
+});
+
+export { script as s };

package/dist/bundled/v3/{OrConfirm.vue_vue_type_script_lang-9367f23b.js → OrConfirm.vue_vue_type_script_lang-96d0eb06.js}

@@ -2,11 +2,12 @@ import { defineComponent, ref, computed } from 'vue-demi';
 import { useMagicKeys, useActiveElement, whenever } from '@vueuse/core';
 import { l as logicAnd } from './index-63e094a0.js';
 import './components/OrButtonV2/OrButtonV2.js';
-import { s as script$1 } from './OrButton.vue_vue_type_script_lang-aa34ef87.js';
+import { s as script$1 } from './OrButton.vue_vue_type_script_lang-b48cc1bf.js';
 import './components/OrModal/OrModal.js';
 import script$3 from './components/OrInput/OrInput.js';
-import { a as BUTTON_COLOR } from './constants-c5d1139f.js';
-import { s as script$2, O as OrModalSizes } from './OrModal.vue_vue_type_script_lang-a988003c.js';
+import { BUTTON_COLOR } from './components/OrButtonV2/constants.js';
+import { OrModalSizes } from './components/OrModal/constants.js';
+import { s as script$2 } from './OrModal.vue_vue_type_script_lang-ee130ace.js';
 
 var script = defineComponent({
   name: 'OrConfirm',

package/dist/bundled/v3/{OrConfirm.vue_vue_type_script_lang-642b8f83.js → OrConfirm.vue_vue_type_script_lang-9f31c964.js}

@@ -1,60 +1,15 @@
 import { defineComponent, ref, computed, watch } from 'vue-demi';
 import { useMagicKeys, whenever } from '@vueuse/core';
 import { l as logicAnd } from './index-63e094a0.js';
+import { ConfirmType } from './components/OrConfirmV3/props.js';
+import { ConfirmRoot, ConfirmHeader, ConfirmInput, ConfirmFooter, ConfirmFooterTypes, ConfirmFooterButtons } from './components/OrConfirmV3/styles.js';
 import './components/OrOverlayV3/OrOverlayV3.js';
 import './components/OrButtonV3/OrButtonV3.js';
 import './components/OrInputV3/OrInputV3.js';
-import { s as script$2, B as ButtonColor } from './OrButton.vue_vue_type_script_lang-65924b87.js';
-import { s as script$1 } from './OrOverlay.vue_vue_type_script_lang-f2bdd70b.js';
-import { s as script$3 } from './OrInput.vue_vue_type_script_lang-e970f1b2.js';
-
-var ConfirmType;
-(function (ConfirmType) {
-  ConfirmType["D"] = "d";
-  ConfirmType["C"] = "c";
-})(ConfirmType || (ConfirmType = {}));
-
-const ConfirmRoot = [
-// Layout
-'layout-column',
-// Box
-'w-[320px]',
-// Shape
-'rounded-md',
-// Spacing
-'px-lg', 'py-lg', 'gap-md',
-// Typography
-'typography-body-2-regular',
-// Theme
-'theme-background-default', 'dark:theme-background-default-dark', 'theme-foreground-default', 'dark:theme-foreground-default-dark',
-// Elevation
-'shadow-modal', 'dark:shadow-modal-dark'];
-const ConfirmHeader = [
-// Layout
-'flex', 'items-center', 'justify-between',
-// Typography
-'typography-headline-3'];
-const ConfirmInput = [
-// Box
-'w-full',
-// Spacing
-'mt-md'];
-const ConfirmFooter = [
-// Layout
-'flex', 'items-center', 'justify-between',
-// Spacing
-'gap-md'];
-const ConfirmFooterTypes = {
-  [ConfirmType.C]: [
-  // Layout
-  'flex-row'],
-  [ConfirmType.D]: [
-  // Layout
-  'flex-row-reverse']
-};
-const ConfirmFooterButtons = [
-// Box
-'w-[128px]'];
+import { ButtonColor } from './components/OrButtonV3/props.js';
+import { s as script$1 } from './OrOverlay.vue_vue_type_script_lang-5e5b5fac.js';
+import { s as script$2 } from './OrButton.vue_vue_type_script_lang-76ff19e0.js';
+import { s as script$3 } from './OrInput.vue_vue_type_script_lang-d1c06414.js';
 
 var script = defineComponent({
   name: 'OrConfirm',
@@ -222,4 +177,4 @@ var script = defineComponent({
   }
 });
 
-export { ConfirmType as C, script as s };
+export { script as s };

package/dist/bundled/v3/{OrDateTimePicker.vue_vue_type_script_lang-09a33c8a.js → OrDateTimePicker.vue_vue_type_script_lang-a3b3aac4.js}

@@ -1,21 +1,22 @@
 import _ from 'lodash';
 import { defineComponent, ref, getCurrentInstance } from 'vue-demi';
 import { onClickOutside } from '@vueuse/core';
-import { s as setStyle, r as requestAF, a as getCS, b as reflow, c as cancelAF } from './dom-a98e78cb.js';
-import { p as pxToRem } from './px-to-rem-0b26b83e.js';
-import { s as script$1, O as OrDateTimePickerTypes, D as DEFAULT_TEXT } from './OrDateTimePickerCalendarItem-6c38b593.js';
+import { setStyle, requestAF, getCS, reflow, cancelAF } from './utils/functions/dom.js';
+import { pxToRem } from './utils/functions/px-to-rem.js';
+import { OrDateTimePickerTypes, DEFAULT_TEXT } from './components/OrDateTimePicker/constants.js';
+import script$1 from './components/OrDateTimePickerCalendarItem/OrDateTimePickerCalendarItem.js';
 import './components/OrFloating/OrFloating.js';
 import './components/OrLabel/OrLabel.js';
 import './components/OrError/OrError.js';
 import './components/OrHint/OrHint.js';
 import './components/OrCollapse/OrCollapse.js';
 import './components/OrIconButtonV2/OrIconButtonV2.js';
-import { s as script$2 } from './OrFloating.vue_vue_type_script_lang-d29049e5.js';
+import { s as script$2 } from './OrFloating.vue_vue_type_script_lang-66ce28ae.js';
 import { s as script$3 } from './OrLabel.vue_vue_type_script_lang-95601b40.js';
 import { s as script$4 } from './OrError.vue_vue_type_script_lang-450321b8.js';
 import { s as script$5 } from './OrHint.vue_vue_type_script_lang-5d628c6c.js';
-import { s as script$6 } from './OrCollapse.vue_vue_type_script_lang-76b28b03.js';
-import { s as script$7 } from './OrIconButton.vue_vue_type_script_lang-71dd403b.js';
+import { s as script$6 } from './OrCollapse.vue_vue_type_script_lang-e22b5a76.js';
+import { s as script$7 } from './OrIconButton.vue_vue_type_script_lang-721e0c2f.js';
 
 const MINUTE = 1000 * 60;
 const HOUR = MINUTE * 60;

package/dist/bundled/v3/{OrEmptyState.vue_vue_type_script_lang-8392055c.js → OrEmptyState.vue_vue_type_script_lang-4c5ad2a9.js}

@@ -1,53 +1,6 @@
 import { defineComponent, ref, computed } from 'vue-demi';
-
-var EmptyStateSize;
-(function (EmptyStateSize) {
-  EmptyStateSize["L"] = "l";
-  EmptyStateSize["M"] = "m";
-})(EmptyStateSize || (EmptyStateSize = {}));
-
-const EmptyStateRoot = [
-// Layout
-'grow', 'flex', 'flex-col', 'justify-center', 'items-center',
-// Box
-'w-full',
-// Sizing
-'gap-sm'];
-const EmptyStateImage = [
-// Sizing
-'mb-sm'];
-const EmptyStateImageSizes = {
-  [EmptyStateSize.L]: [
-  // Box
-  'h-3xl'],
-  [EmptyStateSize.M]: [
-  // Box
-  'h-2xl']
-};
-const EmptyStateHeading = [
-// Theme
-'theme-foreground-default', 'dark:theme-foreground-default-dark'];
-const EmptyStateHeadingSizes = {
-  [EmptyStateSize.L]: [
-  // Typography
-  'typography-headline-2'],
-  [EmptyStateSize.M]: [
-  // Typography
-  'typography-headline-4']
-};
-const EmptyStateText = ['text-center',
-// Theme
-'text-outline', 'dark:text-outline-dark'];
-const EmptyStateContent = EmptyStateText;
-const EmptyStateTextSizes = {
-  [EmptyStateSize.L]: [
-  // Typography
-  'typography-body-2-regular'],
-  [EmptyStateSize.M]: [
-  // Typography
-  'typography-caption-regular']
-};
-const EmptyStateContentSizes = EmptyStateTextSizes;
+import { EmptyStateSize } from './components/OrEmptyStateV3/props.js';
+import { EmptyStateRoot, EmptyStateImage, EmptyStateImageSizes, EmptyStateHeading, EmptyStateHeadingSizes, EmptyStateText, EmptyStateTextSizes, EmptyStateContent, EmptyStateContentSizes } from './components/OrEmptyStateV3/styles.js';
 
 /**
  * The component to display when there is no content on a page,
@@ -108,4 +61,4 @@ var script = defineComponent({
   }
 });
 
-export { EmptyStateSize as E, script as s };
+export { script as s };

package/dist/bundled/v3/{OrError.vue_vue_type_script_lang-6954e9de.js → OrError.vue_vue_type_script_lang-98601766.js}

@@ -1,25 +1,6 @@
 import { defineComponent, ref, computed } from 'vue-demi';
-import { u as useClassAttribute } from './useClassAttribute-47fdb016.js';
-
-const ErrorRoot = [
-// Layout
-'layout-row !items-start justify-between',
-// Spacing
-'gap-sm',
-// Typography
-'typography-caption-regular',
-// Theme
-'theme-foreground-error', 'dark:theme-foreground-error-dark'];
-const ErrorText = [
-// Layout
-'grow',
-// Interactivity
-'interactivity-none'];
-const ErrorAddon = [
-// Layout
-'layout-row empty:hidden',
-// Typography
-'whitespace-nowrap'];
+import { ErrorRoot, ErrorText, ErrorAddon } from './components/OrErrorV3/styles.js';
+import { useClassAttribute } from './hooks/useClassAttribute.js';
 
 var script = defineComponent({
   name: 'OrError',

package/dist/bundled/v3/{OrErrorTag.vue_vue_type_script_lang-4fd7c0f4.js → OrErrorTag.vue_vue_type_script_lang-05e8460d.js}

@@ -1,23 +1,8 @@
 import { defineComponent, ref, computed } from 'vue-demi';
+import { ErrorTagRoot } from './components/OrErrorTagV3/styles.js';
 import './components/OrIconV3/OrIconV3.js';
-import { u as useClassAttribute } from './useClassAttribute-47fdb016.js';
-import { s as script$1 } from './OrIcon.vue_vue_type_script_lang-c13ec0ac.js';
-
-const ErrorTagRoot = [
-// Layout
-'layout-inline-row',
-// Box
-'max-w-fit',
-// Shape
-'rounded-full',
-// Spacing
-'px-sm+ md:px-sm', 'py-sm md:py-xs', 'gap-sm+ md:gap-sm',
-// Interactivity
-'interactivity-none',
-// Typography
-'typography-caption-regular whitespace-nowrap',
-// Theme
-'theme-preset-1-error', 'dark:theme-preset-1-error-dark'];
+import { useClassAttribute } from './hooks/useClassAttribute.js';
+import { s as script$1 } from './OrIcon.vue_vue_type_script_lang-1cb537ef.js';
 
 var script = defineComponent({
   name: 'OrTag',

package/dist/bundled/v3/OrExpansionPanel.vue_vue_type_script_lang-c908e8be.js

@@ -0,0 +1,53 @@
+import { defineComponent, ref, computed } from 'vue-demi';
+import { ExpansionPanelVariant, ExpansionPanelColor } from './components/OrExpansionPanelV3/props.js';
+import { ExpansionPanelRoot, ExpansionPanelRootVariants, ExpansionPanelHeader, ExpansionPanelHeaderColors, ExpansionPanelAddon } from './components/OrExpansionPanelV3/styles.js';
+import './components/OrIconV3/OrIconV3.js';
+import { useClassAttribute } from './hooks/useClassAttribute.js';
+import { s as script$1 } from './OrIcon.vue_vue_type_script_lang-1cb537ef.js';
+
+var script = defineComponent({
+  name: 'OrExpansionPanel',
+  components: {
+    OrIcon: script$1
+  },
+  inheritAttrs: false,
+  props: {
+    label: {
+      type: String,
+      required: true
+    },
+    variant: {
+      type: String,
+      default: ExpansionPanelVariant.Default
+    },
+    color: {
+      type: String,
+      default: ExpansionPanelColor.Default
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    }
+  },
+  expose: ['root'],
+  setup(props) {
+    // Refs
+    const root = ref();
+    // Styles
+    const classAttribute = useClassAttribute();
+    const rootStyles = computed(() => ['or-expansion-panel', ...ExpansionPanelRoot, ...ExpansionPanelRootVariants[props.variant], classAttribute.value]);
+    const headerStyles = computed(() => [...ExpansionPanelHeader, ...ExpansionPanelHeaderColors[props.color]]);
+    const addonStyles = computed(() => [...ExpansionPanelAddon]);
+    // State
+    const expanded = ref(false);
+    return {
+      root,
+      rootStyles,
+      headerStyles,
+      addonStyles,
+      expanded
+    };
+  }
+});
+
+export { script as s };

package/dist/bundled/v3/{OrFab.vue_vue_type_script_lang-2fd2bd45.js → OrFab.vue_vue_type_script_lang-e0018fef.js}

@@ -1,30 +1,8 @@
 import { defineComponent, ref, computed } from 'vue-demi';
+import { FabColor } from './components/OrFabV3/props.js';
+import { FabRoot, FabRootColors } from './components/OrFabV3/styles.js';
 import './components/OrIconV3/OrIconV3.js';
-import { s as script$1 } from './OrIcon.vue_vue_type_script_lang-c13ec0ac.js';
-
-var FabColor;
-(function (FabColor) {
-  FabColor["Primary"] = "primary";
-  FabColor["Danger"] = "danger";
-})(FabColor || (FabColor = {}));
-
-const FabRoot = [
-// Layout
-'layout-inline-row justify-center',
-// Shape
-'rounded-full',
-// Box
-'w-[56px]', 'h-[56px]',
-// Elevation
-'enabled:shadow-button', 'dark:enabled:shadow-button-dark'];
-const FabRootColors = {
-  'primary': [
-  // Theme
-  'theme-preset-1-primary', 'dark:theme-preset-1-primary-dark'],
-  'danger': [
-  // Theme
-  'theme-preset-1-error', 'dark:theme-preset-1-error-dark']
-};
+import { s as script$1 } from './OrIcon.vue_vue_type_script_lang-1cb537ef.js';
 
 var script = defineComponent({
   name: 'OrFab',
@@ -58,4 +36,4 @@ var script = defineComponent({
   }
 });
 
-export { FabColor as F, script as s };
+export { script as s };

package/dist/bundled/v3/{OrFloating.vue_vue_type_script_lang-d29049e5.js → OrFloating.vue_vue_type_script_lang-66ce28ae.js}

@@ -1,28 +1,8 @@
 import { defineComponent, ref, nextTick } from 'vue-demi';
 import { a as autoUpdate, c as computePosition, o as offset, h as hide, f as flip, s as shift } from './floating-ui.dom.esm-83eba816.js';
 import script$1 from './components/OrTeleportVue3/OrTeleportVue3.js';
-import { g as getMaxZIndex, a as getCS } from './dom-a98e78cb.js';
-
-var OrFloatingPlacements;
-(function (OrFloatingPlacements) {
-  OrFloatingPlacements["TOP_START"] = "top-start";
-  OrFloatingPlacements["RIGHT_START"] = "right-start";
-  OrFloatingPlacements["BOTTOM_START"] = "bottom-start";
-  OrFloatingPlacements["LEFT_START"] = "left-start";
-  OrFloatingPlacements["TOP"] = "top";
-  OrFloatingPlacements["RIGHT"] = "right";
-  OrFloatingPlacements["BOTTOM"] = "bottom";
-  OrFloatingPlacements["LEFT"] = "left";
-  OrFloatingPlacements["TOP_END"] = "top-end";
-  OrFloatingPlacements["RIGHT_END"] = "right-end";
-  OrFloatingPlacements["BOTTOM_END"] = "bottom-end";
-  OrFloatingPlacements["LEFT_END"] = "left-end";
-})(OrFloatingPlacements || (OrFloatingPlacements = {}));
-var OrFloatingHideStrategy;
-(function (OrFloatingHideStrategy) {
-  OrFloatingHideStrategy["REFERENCE_HIDDEN"] = "referenceHidden";
-  OrFloatingHideStrategy["ESCAPED"] = "escaped";
-})(OrFloatingHideStrategy || (OrFloatingHideStrategy = {}));
+import { OrFloatingPlacements, OrFloatingHideStrategy } from './components/OrFloating/constants.js';
+import { getMaxZIndex, getCS } from './utils/functions/dom.js';
 
 var script = defineComponent({
   name: 'OrFloating',
@@ -165,4 +145,4 @@ var script = defineComponent({
   }
 });
 
-export { OrFloatingPlacements as O, OrFloatingHideStrategy as a, script as s };
+export { script as s };

package/dist/bundled/v3/{OrHint.vue_vue_type_script_lang-7dc58eba.js → OrHint.vue_vue_type_script_lang-e5ffd5fa.js}

@@ -1,25 +1,6 @@
 import { defineComponent, ref, computed } from 'vue-demi';
-import { u as useClassAttribute } from './useClassAttribute-47fdb016.js';
-
-const HintRoot = [
-// Layout
-'layout-row !items-start justify-between',
-// Spacing
-'gap-sm',
-// Typography
-'typography-caption-regular',
-// Theme
-'theme-foreground-outline', 'dark:theme-foreground-outline-dark'];
-const HintText = [
-// Layout
-'grow',
-// Interactivity
-'interactivity-none'];
-const HintAddon = [
-// Layout
-'layout-row empty:hidden',
-// Typography
-'whitespace-nowrap'];
+import { HintRoot, HintText, HintAddon } from './components/OrHintV3/styles.js';
+import { useClassAttribute } from './hooks/useClassAttribute.js';
 
 var script = defineComponent({
   name: 'OrHint',

package/dist/bundled/v3/OrIcon.vue_vue_type_script_lang-1cb537ef.js

@@ -0,0 +1,37 @@
+import { defineComponent, ref, computed } from 'vue-demi';
+import { IconVariant, IconSize } from './components/OrIconV3/props.js';
+import { IconRoot, IconRootVariants, IconRootSizes } from './components/OrIconV3/styles.js';
+import { useClassAttribute } from './hooks/useClassAttribute.js';
+
+var script = defineComponent({
+  name: 'OrIcon',
+  inheritAttrs: false,
+  props: {
+    icon: {
+      type: String,
+      required: true
+    },
+    variant: {
+      type: String,
+      default: IconVariant.Outlined
+    },
+    size: {
+      type: String,
+      default: IconSize.M
+    }
+  },
+  expose: ['root'],
+  setup(props) {
+    // Refs
+    const root = ref();
+    // Styles
+    const classAttribute = useClassAttribute();
+    const rootStyles = computed(() => ['or-icon', ...IconRoot, ...IconRootVariants[props.variant], ...IconRootSizes[props.size], classAttribute.value]);
+    return {
+      root,
+      rootStyles
+    };
+  }
+});
+
+export { script as s };

package/dist/bundled/v3/{OrIcon.vue_vue_type_script_lang-d4254862.js → OrIcon.vue_vue_type_script_lang-aadbcbe3.js}

@@ -1,32 +1,11 @@
 import { defineComponent, ref } from 'vue-demi';
 import _ from 'lodash';
-import { p as pxToRem } from './px-to-rem-0b26b83e.js';
+import { OrIconType } from './components/OrIcon/constants.js';
+import { pxToRem } from './utils/functions/px-to-rem.js';
 import script$1 from './components/OrTooltipContent/OrTooltipContent.js';
 import './components/OrFloating/OrFloating.js';
-import { s as script$2, O as OrFloatingPlacements } from './OrFloating.vue_vue_type_script_lang-d29049e5.js';
-
-var OrIconColors;
-(function (OrIconColors) {
-  OrIconColors["primary"] = "primary";
-  OrIconColors["error"] = "error";
-  OrIconColors["warning"] = "warning";
-  OrIconColors["success"] = "success";
-  OrIconColors["neutral-0"] = "neutral-0";
-  OrIconColors["neutral-1"] = "neutral-1";
-  OrIconColors["neutral-2"] = "neutral-2";
-  OrIconColors["neutral-3"] = "neutral-3";
-  OrIconColors["neutral-4"] = "neutral-4";
-  OrIconColors["neutral-5"] = "neutral-5";
-  OrIconColors["neutral-6"] = "neutral-6";
-})(OrIconColors || (OrIconColors = {}));
-var OrIconType;
-(function (OrIconType) {
-  OrIconType["outline"] = "outlined";
-  OrIconType["filled"] = "filled";
-  OrIconType["rounded"] = "round";
-  OrIconType["sharp"] = "sharp";
-  OrIconType["two-tone"] = "two-tone";
-})(OrIconType || (OrIconType = {}));
+import { s as script$2 } from './OrFloating.vue_vue_type_script_lang-66ce28ae.js';
+import { OrFloatingPlacements } from './components/OrFloating/constants.js';
 
 var script = defineComponent({
   name: 'OrIcon',
@@ -112,4 +91,4 @@ var script = defineComponent({
   }
 });
 
-export { OrIconColors as O, OrIconType as a, script as s };
+export { script as s };

package/dist/bundled/v3/{OrIconButton.vue_vue_type_script_lang-71dd403b.js → OrIconButton.vue_vue_type_script_lang-721e0c2f.js}

@@ -1,11 +1,11 @@
 import { defineComponent } from 'vue-demi';
 import script$3 from './components/OrTooltipWrapperV2/OrTooltipWrapperV2.js';
-import { I as ICON_BUTTON_TYPE, H as HTML_BUTTON_TYPE, b as BUTTON_SIZE, a as BUTTON_COLOR } from './constants-c5d1139f.js';
+import { ICON_BUTTON_TYPE, HTML_BUTTON_TYPE, BUTTON_SIZE, BUTTON_COLOR } from './components/OrButtonV2/constants.js';
 import './components/OrIcon/OrIcon.js';
 import './components/OrLoader/OrLoader.js';
-import { s as script$1 } from './OrIcon.vue_vue_type_script_lang-d4254862.js';
-import { s as script$2 } from './OrLoader.vue_vue_type_script_lang-352f1432.js';
-import { O as OrFloatingPlacements } from './OrFloating.vue_vue_type_script_lang-d29049e5.js';
+import { s as script$1 } from './OrIcon.vue_vue_type_script_lang-aadbcbe3.js';
+import { s as script$2 } from './OrLoader.vue_vue_type_script_lang-b48715a3.js';
+import { OrFloatingPlacements } from './components/OrFloating/constants.js';
 
 var script = defineComponent({
   name: 'OrIconButton',

package/dist/bundled/v3/OrIconButton.vue_vue_type_script_lang-da74839d.js

@@ -0,0 +1,55 @@
+import { defineComponent, ref, computed } from 'vue-demi';
+import { IconButtonColor } from './components/OrIconButtonV3/props.js';
+import { IconButtonRoot, IconButtonRootColors } from './components/OrIconButtonV3/styles.js';
+import './components/OrIconV3/OrIconV3.js';
+import './components/OrTooltipV3/OrTooltipV3.js';
+import { s as script$2 } from './OrTooltip.vue_vue_type_script_lang-1e610987.js';
+import { IconSize } from './components/OrIconV3/props.js';
+import { useClassAttribute } from './hooks/useClassAttribute.js';
+import { s as script$1 } from './OrIcon.vue_vue_type_script_lang-1cb537ef.js';
+
+var script = defineComponent({
+  name: 'OrIconButton',
+  components: {
+    OrIcon: script$1,
+    OrTooltip: script$2
+  },
+  inheritAttrs: false,
+  props: {
+    icon: {
+      type: [String, Object],
+      required: true
+    },
+    color: {
+      type: String,
+      default: IconButtonColor.Inherit
+    },
+    size: {
+      type: String,
+      default: IconSize.M
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    tooltip: {
+      type: [String, Object],
+      default: undefined
+    }
+  },
+  emits: ['click', 'focus', 'blur'],
+  expose: ['root'],
+  setup(props) {
+    // Refs
+    const root = ref();
+    // Styles
+    const classAttribute = useClassAttribute();
+    const rootStyles = computed(() => ['or-icon-button', ...IconButtonRoot, ...IconButtonRootColors[props.color], classAttribute.value]);
+    return {
+      root,
+      rootStyles
+    };
+  }
+});
+
+export { script as s };