@onereach/ui-components 25.3.2 → 25.3.3-beta.5799.0

package/dist/esm/OrRangeSlider-Cxhafo9S.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrRangeSlider-Cxhafo9S.mjs","sources":["../../../components/or-range-slider-v3/src/styles.ts","../../../components/or-range-slider-v3/src/OrRangeSlider.vue"],"sourcesContent":["import { SliderColor, SliderOrientation } from '@onereach/ui-components.or-slider-v3';\n\nexport const RangeSlider: string[] = [\n  // Interactivity\n  'interactivity-default',\n];\n\nexport const RangeSliderOrientations: Record<SliderOrientation, string[]> = {\n  [SliderOrientation.Horizontal]: [\n    // Layout\n    'layout-column',\n\n    // Box\n    'w-full',\n  ],\n\n  [SliderOrientation.HorizontalReversed]: [\n    // Layout\n    'layout-column',\n\n    // Box\n    'w-full',\n  ],\n\n  [SliderOrientation.Vertical]: [\n    // Layout\n    'layout-row',\n\n    // Box\n    'h-full',\n  ],\n\n  [SliderOrientation.VerticalReversed]: [\n    // Layout\n    'layout-row',\n\n    // Box\n    'h-full',\n  ],\n};\n\nexport const RangeSliderRail: string[] = [\n  // Position\n  'relative',\n\n  // Interactivity\n  'interactivity-click',\n\n  // Shape\n  'rounded-full',\n\n  // Theme\n  'theme-background-disabled',\n  'dark:theme-background-disabled-dark',\n];\n\nexport const RangeSliderRailOrientations: Record<SliderOrientation, string[]> = {\n  [SliderOrientation.Horizontal]: [\n    // Layout\n    'layout-row',\n\n    // Box\n    'w-full',\n    'h-xs',\n\n    // Spacing\n    'mx-0',\n    'my-md+',\n  ],\n\n  [SliderOrientation.HorizontalReversed]: [\n    // Layout\n    'layout-row-reverse',\n\n    // Box\n    'w-full',\n    'h-xs',\n\n    // Spacing\n    'mx-0',\n    'my-md+',\n  ],\n\n  [SliderOrientation.Vertical]: [\n    // Layout\n    'layout-column-reverse items-center',\n\n    // Box\n    'w-xs',\n    'h-full',\n\n    // Spacing\n    'mx-md+',\n    'my-0',\n  ],\n\n  [SliderOrientation.VerticalReversed]: [\n    // Layout\n    'layout-column items-center',\n\n    // Box\n    'w-xs',\n    'h-full',\n\n    // Spacing\n    'mx-md+',\n    'my-0',\n  ],\n};\n\nexport const RangeSliderOffset: string[] = [];\n\nexport const RangeSliderOffsetOrientations: Record<SliderOrientation, string[]> = {\n  [SliderOrientation.Horizontal]: [\n    // Box\n    'h-full',\n  ],\n\n  [SliderOrientation.HorizontalReversed]: [\n    // Box\n    'h-full',\n  ],\n\n  [SliderOrientation.Vertical]: [\n    // Box\n    'w-full',\n  ],\n\n  [SliderOrientation.VerticalReversed]: [\n    // Box\n    'w-full',\n  ],\n};\n\nexport const RangeSliderTrack: string[] = [\n  // Shape\n  'rounded-full',\n\n  // Box\n  'w-full',\n  'h-full',\n];\n\nexport const RangeSliderTrackColors: Record<SliderColor, string[]> = {\n  [SliderColor.Primary]: [\n    // Theme\n    'theme-background-primary',\n    'dark:theme-background-primary-dark',\n  ],\n\n  [SliderColor.Secondary]: [\n    // Theme\n    'theme-background-secondary',\n    'dark:theme-background-secondary-dark',\n  ],\n};\n\nexport const RangeSliderThumb: string[] = [\n  // Layout\n  'shrink-0',\n\n  // Position\n  'z-10',\n\n  // Shape\n  'rounded-full',\n\n  // Box\n  'w-[20px]',\n  'h-[20px]',\n\n  // Spacing\n  '-mx-[10px]',\n  '-my-[10px]',\n\n  // Theme\n  'theme-background-base',\n  'dark:theme-background-base-dark',\n];\n\nexport const RangeSliderThumbColors: Record<SliderColor, string[]> = {\n  [SliderColor.Primary]: [\n    // Theme\n    'theme-border-primary border-4',\n    'dark:theme-border-primary-dark',\n\n    // Theme (hover)\n    'hover:theme-background-primary',\n    'dark:hover:theme-background-primary-dark',\n\n    // Theme (active)\n    'active:theme-background-primary',\n    'dark:active:theme-background-primary-dark',\n\n    'active:theme-outline-primary active:outline-10',\n    'dark:active:theme-outline-primary-dark',\n  ],\n\n  [SliderColor.Secondary]: [\n    // Theme\n    'theme-border-secondary border-4',\n    'dark:theme-border-secondary-dark',\n\n    // Theme (hover)\n    'hover:theme-background-secondary',\n    'dark:hover:theme-background-secondary-dark',\n\n    // Theme (active)\n    'active:theme-background-secondary',\n    'dark:active:theme-background-secondary-dark',\n\n    'active:theme-outline-secondary active:outline-10',\n    'dark:active:theme-outline-secondary-dark',\n  ],\n};\n\nexport const RangeSliderBreakpointMark: string[] = [\n  // Position\n  'absolute',\n\n  // Shape\n  'rounded-full',\n\n  // Box\n  'w-[2px]',\n  'h-[2px]',\n\n  // Spacing\n  '-mx-[1px]',\n  '-my-[1px]',\n];\n\nexport const RangeSliderBreakpointMarkColors: Record<SliderColor, string[]> = {\n  [SliderColor.Primary]: [\n    // Theme\n    'theme-background-primary',\n    'dark:theme-background-primary-dark',\n\n    // Theme (activated)\n    'activated:theme-background-primary-container',\n    'dark:activated:theme-background-primary-container-dark',\n\n    // Theme (disabled)\n    'disabled:!bg-on-disabled',\n    'dark:disabled:!bg-on-disabled-dark',\n  ],\n\n  [SliderColor.Secondary]: [\n    // Theme\n    'theme-background-secondary',\n    'dark:theme-background-secondary-dark',\n\n    // Theme (activated)\n    'activated:theme-background-secondary-container',\n    'dark:activated:theme-background-secondary-container-dark',\n\n    // Theme (disabled)\n    'disabled:!bg-on-disabled',\n    'dark:disabled:!bg-on-disabled-dark',\n  ],\n};\n\nexport const RangeSliderLabel: string[] = [\n  // Position\n  'relative',\n];\n\nexport const RangeSliderLabelOrientations: Record<SliderOrientation, string[]> = {\n  [SliderOrientation.Horizontal]: [\n    // Layout\n    'layout-row',\n\n    // Box\n    'w-full',\n  ],\n\n  [SliderOrientation.HorizontalReversed]: [\n    // Layout\n    'layout-row-reverse',\n\n    // Box\n    'w-full',\n  ],\n\n  [SliderOrientation.Vertical]: [\n    // Layout\n    'layout-column-reverse items-center',\n\n    // Box\n    'h-full',\n  ],\n\n  [SliderOrientation.VerticalReversed]: [\n    // Layout\n    'layout-column items-center',\n\n    // Box\n    'h-full',\n  ],\n};\n\nexport const RangeSliderLabelMark: string[] = [\n  // Position\n  'absolute',\n\n  // Interactivity\n  'interactivity-click',\n\n  // Typography\n  'typography-caption-regular whitespace-nowrap',\n\n  // Theme\n  'theme-foreground-outline',\n  'dark:theme-foreground-outline-dark',\n\n  // Theme (hover)\n  'hover:theme-foreground-default',\n  'dark:hover:theme-foreground-default-dark',\n];\n\nexport const RangeSliderLabelMarkOrientations: Record<SliderOrientation, string[]> = {\n  [SliderOrientation.Horizontal]: [\n    // Position\n    '-translate-x-1/2',\n    'translate-y-1/2',\n  ],\n\n  [SliderOrientation.HorizontalReversed]: [\n    // Position\n    'translate-x-1/2',\n    'translate-y-1/2',\n  ],\n\n  [SliderOrientation.Vertical]: [\n    // Position\n    'translate-x-1/2',\n    'translate-y-1/2',\n  ],\n\n  [SliderOrientation.VerticalReversed]: [\n    // Position\n    'translate-x-1/2',\n    '-translate-y-1/2',\n  ],\n};\n","<template>\n  <div\n    :ref=\"'root'\"\n    :class=\"rootStyles\"\n    :disabled=\"disabled\"\n  >\n    <div\n      :ref=\"'rail'\"\n      :class=\"railStyles\"\n      :disabled=\"disabled\"\n    >\n      <div\n        :ref=\"'offset'\"\n        :class=\"offsetStyles\"\n        :style=\"offsetInlineStyles\"\n        :disabled=\"disabled\"\n      />\n\n      <OrTooltip\n        :is-open=\"(!isDragging && (isHoveringRail || isHoveringThumbFrom)) || (isDragging && selectedControl === 'from')\"\n        :placement=\"tooltipPlacement\"\n        :offset=\"24\"\n        :external-control=\"true\"\n        v-bind=\"tooltip\"\n      >\n        <div\n          :ref=\"'thumbFrom'\"\n          :class=\"thumbStyles\"\n          :disabled=\"disabled\"\n        />\n\n        <template v-slot:content>\n          <slot\n            name=\"tooltipContent\"\n            :value=\"proxyModelValue[orientation.endsWith('-reversed') ? 1 : 0]\"\n          >\n            {{ proxyModelValue[orientation.endsWith('-reversed') ? 1 : 0] }}\n          </slot>\n        </template>\n      </OrTooltip>\n\n      <div\n        :ref=\"'track'\"\n        :class=\"trackStyles\"\n        :style=\"trackInlineStyles\"\n        :disabled=\"disabled\"\n      />\n\n      <OrTooltip\n        :is-open=\"(!isDragging && (isHoveringRail || isHoveringThumbTo)) || (isDragging && selectedControl === 'to')\"\n        :placement=\"tooltipPlacement\"\n        :offset=\"24\"\n        :external-control=\"true\"\n        v-bind=\"tooltip\"\n      >\n        <div\n          :ref=\"'thumbTo'\"\n          :class=\"thumbStyles\"\n          :disabled=\"disabled\"\n        />\n\n        <template v-slot:content>\n          <slot\n            name=\"tooltipContent\"\n            :value=\"proxyModelValue[orientation.endsWith('-reversed') ? 0 : 1]\"\n          >\n            {{ proxyModelValue[orientation.endsWith('-reversed') ? 0 : 1] }}\n          </slot>\n        </template>\n      </OrTooltip>\n\n      <div\n        :ref=\"'filler'\"\n        :class=\"['grow', ...offsetStyles]\"\n        :disabled=\"disabled\"\n      />\n\n      <template v-if=\"breakpoints.length > 0\">\n        <div\n          v-for=\"breakpoint of [minValue, ...breakpoints, maxValue]\"\n          :key=\"breakpoint\"\n          :class=\"breakpointMarkStyles\"\n          :style=\"getBreakpointMarkComputedStyles(breakpoint)\"\n          :activated=\"breakpoint >= proxyModelValue[orientation.endsWith('-reversed') ? 1 : 0] && breakpoint <= proxyModelValue[orientation.endsWith('-reversed') ? 0 : 1]\"\n          :disabled=\"disabled\"\n          @mouseenter=\"highlightedBreakpoint = breakpoint\"\n          @mouseleave=\"highlightedBreakpoint = undefined\"\n        />\n      </template>\n    </div>\n\n    <div :class=\"labelStyles\">\n      <div\n        v-for=\"breakpoint of [minValue, ...breakpoints, maxValue]\"\n        :key=\"breakpoint\"\n        :class=\"labelMarkStyles\"\n        :style=\"getBreakpointMarkComputedStyles(breakpoint)\"\n        :disabled=\"disabled\"\n        :force-state=\"highlightedBreakpoint === breakpoint ? 'hover' : undefined\"\n        @mouseenter=\"highlightedBreakpoint = breakpoint\"\n        @mouseleave=\"highlightedBreakpoint = undefined\"\n        @click=\"onClick(breakpoint)\"\n      >\n        <slot\n          :name=\"`${breakpoint}-label`\"\n          :value=\"breakpoint\"\n        >\n          {{ breakpoint }}\n        </slot>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { useProxyModelValue } from '@onereach/ui-components-common/hooks';\nimport { SliderColor, SliderOrientation } from '@onereach/ui-components.or-slider-v3';\nimport { OrTooltipV3 as OrTooltip } from '@onereach/ui-components.or-tooltip-v3';\nimport { Position, clamp, useDraggable, useElementBounding, useElementHover } from '@vueuse/core';\nimport { PropType, computed, defineComponent, ref, toRef, watch } from 'vue';\n\nimport * as Styles from './styles';\nimport { RangeSliderModelValue } from './types';\n\nexport default defineComponent({\n  name: 'OrRangeSlider',\n\n  components: {\n    OrTooltip,\n  },\n\n  model: {\n    prop: 'modelValue',\n    event: 'update:modelValue',\n  },\n\n  props: {\n    modelValue: {\n      type: undefined as unknown as PropType<RangeSliderModelValue>,\n      default: undefined,\n    },\n\n    minValue: {\n      type: Number,\n      default: 0,\n    },\n\n    maxValue: {\n      type: Number,\n      default: 100,\n    },\n\n    step: {\n      type: Number,\n      default: 1,\n    },\n\n    breakpoints: {\n      type: Array as PropType<number[]>,\n      default: () => [],\n    },\n\n    color: {\n      type: String as PropType<`${SliderColor}`>,\n      default: () => SliderColor.Primary,\n    },\n\n    orientation: {\n      type: String as PropType<`${SliderOrientation}`>,\n      default: () => SliderOrientation.Horizontal,\n    },\n\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n\n    tooltip: {\n      type: Object as PropType<Pick<InstanceType<typeof OrTooltip>['$props'], 'placement' | 'offset' | 'debounce'>>,\n      default: undefined,\n    },\n  },\n\n  emits: [\n    'update:modelValue',\n  ],\n\n  expose: [\n    'root',\n  ],\n\n  setup(props, context) {\n    // Refs & Styles\n    const root = ref<HTMLElement>();\n\n    const rootStyles = computed(() => [\n      'or-range-slider-v3',\n      ...Styles.RangeSlider,\n      ...Styles.RangeSliderOrientations[props.orientation],\n    ]);\n\n    const rail = ref<HTMLElement>();\n\n    const railStyles = computed(() => [\n      'or-range-slider-rail-v3',\n      ...Styles.RangeSliderRail,\n      ...Styles.RangeSliderRailOrientations[props.orientation],\n    ]);\n\n    const offset = ref<HTMLElement>();\n\n    const offsetStyles = computed(() => [\n      ...Styles.RangeSliderOffset,\n      ...Styles.RangeSliderOffsetOrientations[props.orientation],\n    ]);\n\n    // eslint-disable-next-line vue/return-in-computed-property\n    const offsetInlineStyles = computed(() => {\n      switch (props.orientation) {\n        case SliderOrientation.Horizontal:\n        case SliderOrientation.HorizontalReversed:\n          return { width: `${internalModelValueFrom.value * 100}%` };\n\n        case SliderOrientation.Vertical:\n        case SliderOrientation.VerticalReversed:\n          return { height: `${internalModelValueFrom.value * 100}%` };\n      }\n    });\n\n    const track = ref<HTMLElement>();\n\n    const trackStyles = computed(() => [\n      ...Styles.RangeSliderTrack,\n      ...Styles.RangeSliderTrackColors[props.color],\n    ]);\n\n    // eslint-disable-next-line vue/return-in-computed-property\n    const trackInlineStyles = computed(() => {\n      switch (props.orientation) {\n        case SliderOrientation.Horizontal:\n        case SliderOrientation.HorizontalReversed:\n          return { width: `${(internalModelValueTo.value - internalModelValueFrom.value) * 100}%` };\n\n        case SliderOrientation.Vertical:\n        case SliderOrientation.VerticalReversed:\n          return { height: `${(internalModelValueTo.value - internalModelValueFrom.value) * 100}%` };\n      }\n    });\n\n    const filler = ref<HTMLElement>();\n\n    const thumbFrom = ref<HTMLElement>();\n    const thumbTo = ref<HTMLElement>();\n\n    const thumbStyles = computed(() => [\n      'or-range-slider-thumb-v3',\n      ...Styles.RangeSliderThumb,\n      ...Styles.RangeSliderThumbColors[props.color],\n      'touch-none', // Required for proper work on mobile\n    ]);\n\n    const breakpointMarkStyles = computed(() => [\n      ...Styles.RangeSliderBreakpointMark,\n      ...Styles.RangeSliderBreakpointMarkColors[props.color],\n    ]);\n\n    const labelStyles = computed(() => [\n      ...Styles.RangeSliderLabel,\n      ...Styles.RangeSliderLabelOrientations[props.orientation],\n    ]);\n\n    const labelMarkStyles = computed(() => [\n      ...Styles.RangeSliderLabelMark,\n      ...Styles.RangeSliderLabelMarkOrientations[props.orientation],\n    ]);\n\n    // State\n    const proxyModelValue = useProxyModelValue(toRef(props, 'modelValue'), context.emit, {\n      defaultValue: computed<[number, number]>(() => [props.minValue, props.maxValue]),\n    });\n\n    watch(proxyModelValue, ([a, b]) => {\n      switch (props.orientation) {\n        case SliderOrientation.Horizontal:\n        case SliderOrientation.Vertical:\n          if (a > b) proxyModelValue.value = [b, a];\n          break;\n\n        case SliderOrientation.HorizontalReversed:\n        case SliderOrientation.VerticalReversed:\n          if (a < b) proxyModelValue.value = [b, a];\n          break;\n      }\n    });\n\n    const proxyModelValueFrom = computed({\n      get: () => {\n        switch (props.orientation) {\n          case SliderOrientation.Horizontal:\n          case SliderOrientation.Vertical:\n            return proxyModelValue.value[0];\n\n          case SliderOrientation.HorizontalReversed:\n          case SliderOrientation.VerticalReversed:\n            return proxyModelValue.value[1];\n        }\n\n        return props.minValue;\n      },\n\n      set: (value) => {\n        const draftProxyModelValue = [value ?? props.minValue, proxyModelValue.value[1]] as [number, number];\n\n        switch (props.orientation) {\n          case SliderOrientation.Horizontal:\n          case SliderOrientation.Vertical:\n            proxyModelValue.value = draftProxyModelValue;\n            break;\n\n          case SliderOrientation.HorizontalReversed:\n          case SliderOrientation.VerticalReversed:\n            proxyModelValue.value = [draftProxyModelValue[1], draftProxyModelValue[0]];\n            break;\n        }\n      },\n    });\n\n    const proxyModelValueTo = computed({\n      get: () => {\n        switch (props.orientation) {\n          case SliderOrientation.Horizontal:\n          case SliderOrientation.Vertical:\n            return proxyModelValue.value[1];\n\n          case SliderOrientation.HorizontalReversed:\n          case SliderOrientation.VerticalReversed:\n            return proxyModelValue.value[0];\n        }\n\n        return props.maxValue;\n      },\n\n      set: (value) => {\n        const draftProxyModelValue = [proxyModelValue.value[0], value ?? props.maxValue] as [number, number];\n\n        switch (props.orientation) {\n          case SliderOrientation.Horizontal:\n          case SliderOrientation.Vertical:\n            proxyModelValue.value = draftProxyModelValue;\n            break;\n\n          case SliderOrientation.HorizontalReversed:\n          case SliderOrientation.VerticalReversed:\n            proxyModelValue.value = [draftProxyModelValue[1], draftProxyModelValue[0]];\n            break;\n        }\n      },\n    });\n\n    const internalModelValueFrom = computed({\n      get: () => (proxyModelValueFrom.value - props.minValue) / (props.maxValue - props.minValue),\n\n      set: (value) => {\n        const modelValue = value * (props.maxValue - props.minValue) + props.minValue;\n\n        const draftProxyModelValue = [\n          internalBreakpoints.value.reduce((a, b) => {\n            return Math.abs(a - modelValue) < Math.abs(b - modelValue) ? a : b;\n          }),\n\n          internalModelValueTo.value * (props.maxValue - props.minValue) + props.minValue,\n        ] as [number, number];\n\n        switch (props.orientation) {\n          case SliderOrientation.Horizontal:\n          case SliderOrientation.Vertical:\n            proxyModelValue.value = draftProxyModelValue;\n            break;\n\n          case SliderOrientation.HorizontalReversed:\n          case SliderOrientation.VerticalReversed:\n            proxyModelValue.value = [draftProxyModelValue[1], draftProxyModelValue[0]];\n            break;\n        }\n      },\n    });\n\n    const internalModelValueTo = computed({\n      get: () => (proxyModelValueTo.value - props.minValue) / (props.maxValue - props.minValue),\n\n      set: (value) => {\n        const modelValue = value * (props.maxValue - props.minValue) + props.minValue;\n\n        const draftProxyModelValue = [\n          internalModelValueFrom.value * (props.maxValue - props.minValue) + props.minValue,\n\n          internalBreakpoints.value.reduce((a, b) => {\n            return Math.abs(a - modelValue) < Math.abs(b - modelValue) ? a : b;\n          }),\n        ] as [number, number];\n\n        switch (props.orientation) {\n          case SliderOrientation.Horizontal:\n          case SliderOrientation.Vertical:\n            proxyModelValue.value = draftProxyModelValue;\n            break;\n\n          case SliderOrientation.HorizontalReversed:\n          case SliderOrientation.VerticalReversed:\n            proxyModelValue.value = [draftProxyModelValue[1], draftProxyModelValue[0]];\n            break;\n        }\n      },\n    });\n\n    const internalBreakpoints = computed(() => {\n      if (!props.step) {\n        return [props.minValue, ...props.breakpoints, props.maxValue];\n      }\n\n      return Array(Math.ceil(Math.abs(props.maxValue - props.minValue) / props.step))\n        .fill(undefined)\n        .map((value, index) => Math.floor((props.minValue + props.step * index) * 1000) / 1000)\n        .concat(...props.breakpoints, props.maxValue)\n        .sort((a, b) => a - b);\n    });\n\n    // eslint-disable-next-line vue/return-in-computed-property\n    const tooltipPlacement = computed(() => {\n      switch (props.orientation) {\n        case SliderOrientation.Horizontal:\n        case SliderOrientation.HorizontalReversed:\n          return 'top';\n\n        case SliderOrientation.Vertical:\n        case SliderOrientation.VerticalReversed:\n          return 'right';\n      }\n    });\n\n    const highlightedBreakpoint = ref<number>();\n    const selectedControl = ref<'from' | 'to'>();\n\n    const railBoundingBox = useElementBounding(rail);\n\n    // Handlers\n    function onDrag(position: Position, event: MouseEvent | PointerEvent): void {\n      if (props.disabled) {\n        return;\n      }\n\n      const totalWidth = railBoundingBox.width.value;\n      const totalHeight = railBoundingBox.height.value;\n\n      if (selectedControl.value === 'from') {\n        switch (props.orientation) {\n          case SliderOrientation.Horizontal:\n            internalModelValueFrom.value = clamp(event.clientX - railBoundingBox.left.value, 0, internalModelValueTo.value * totalWidth) / totalWidth;\n            break;\n\n          case SliderOrientation.HorizontalReversed:\n            internalModelValueFrom.value = clamp(railBoundingBox.right.value - event.clientX, 0, internalModelValueTo.value * totalWidth) / totalWidth;\n            break;\n\n          case SliderOrientation.Vertical:\n            internalModelValueFrom.value = clamp(totalHeight - (event.clientY - railBoundingBox.top.value), 0, internalModelValueTo.value * totalHeight) / totalHeight;\n            break;\n\n          case SliderOrientation.VerticalReversed:\n            internalModelValueFrom.value = clamp(totalHeight - (railBoundingBox.bottom.value - event.clientY), 0, internalModelValueTo.value * totalHeight) / totalHeight;\n            break;\n        }\n      } else {\n        switch (props.orientation) {\n          case SliderOrientation.Horizontal:\n            internalModelValueTo.value = clamp(event.clientX - railBoundingBox.left.value, internalModelValueFrom.value * totalWidth, totalWidth) / totalWidth;\n            break;\n\n          case SliderOrientation.HorizontalReversed:\n            internalModelValueTo.value = clamp(railBoundingBox.right.value - event.clientX, internalModelValueFrom.value * totalWidth, totalWidth) / totalWidth;\n            break;\n\n          case SliderOrientation.Vertical:\n            internalModelValueTo.value = clamp(totalHeight - (event.clientY - railBoundingBox.top.value), internalModelValueFrom.value * totalHeight, totalHeight) / totalHeight;\n            break;\n\n          case SliderOrientation.VerticalReversed:\n            internalModelValueTo.value = clamp(totalHeight - (railBoundingBox.bottom.value - event.clientY), internalModelValueFrom.value * totalHeight, totalHeight) / totalHeight;\n            break;\n        }\n      }\n    }\n\n    function onClick(breakpoint: number): void {\n      if (selectedControl.value === 'from') {\n        proxyModelValueFrom.value = breakpoint;\n        selectedControl.value = 'to';\n      } else {\n        proxyModelValueTo.value = breakpoint;\n        selectedControl.value = 'from';\n      }\n    }\n\n    // Methods\n    function getBreakpointMarkComputedStyles(breakpoint: number): Partial<CSSStyleDeclaration> | undefined {\n      switch (props.orientation) {\n        case SliderOrientation.Horizontal:\n          return { left: `${getBreakpointOffset(breakpoint) * 100}%` };\n\n        case SliderOrientation.HorizontalReversed:\n          return { right: `${getBreakpointOffset(breakpoint) * 100}%` };\n\n        case SliderOrientation.Vertical:\n          return { bottom: `${getBreakpointOffset(breakpoint) * 100}%` };\n\n        case SliderOrientation.VerticalReversed:\n          return { top: `${getBreakpointOffset(breakpoint) * 100}%` };\n      }\n    }\n\n    // Helpers\n    function getBreakpointOffset(breakpoint: number): number {\n      return (breakpoint - props.minValue) / (props.maxValue - props.minValue);\n    }\n\n    // Effects\n    const isHoveringOffset = useElementHover(offset);\n    const isHoveringTrack = useElementHover(track);\n    const isHoveringFiller = useElementHover(filler);\n\n    const isHoveringRail = computed(() => {\n      return isHoveringOffset.value || isHoveringTrack.value || isHoveringFiller.value;\n    });\n\n    const isHoveringThumbFrom = useElementHover(thumbFrom);\n    const isHoveringThumbTo = useElementHover(thumbTo);\n\n    const { isDragging } = useDraggable(rail, {\n      onStart: (position, event) => {\n        switch (event.target) {\n          case thumbFrom.value:\n            selectedControl.value = 'from';\n            break;\n\n          case thumbTo.value:\n            selectedControl.value = 'to';\n            break;\n\n          default:\n            selectedControl.value = selectedControl.value === 'from' ? 'to' : 'from';\n        }\n\n        onDrag(position, event);\n      },\n\n      onMove: onDrag,\n      onEnd: onDrag,\n    });\n\n    // Constraints\n    watch(() => props.minValue, (value) => {\n      if (value >= props.maxValue) {\n        throw new Error('[OrRangeSlider]: `minValue` must be lesser than `maxValue`.');\n      }\n    }, { immediate: true });\n\n    watch(() => props.maxValue, (value) => {\n      if (value <= props.minValue) {\n        throw new Error('[OrRangeSlider]: `maxValue` must be greater than `minValue`.');\n      }\n    }, { immediate: true });\n\n    return {\n      root,\n      rootStyles,\n\n      rail,\n      railStyles,\n\n      offset,\n      offsetStyles,\n      offsetInlineStyles,\n\n      track,\n      trackStyles,\n      trackInlineStyles,\n\n      filler,\n\n      thumbFrom,\n      thumbTo,\n      thumbStyles,\n\n      breakpointMarkStyles,\n\n      labelStyles,\n      labelMarkStyles,\n\n      proxyModelValue,\n      tooltipPlacement,\n      highlightedBreakpoint,\n      selectedControl,\n\n      onClick,\n\n      getBreakpointMarkComputedStyles,\n\n      isHoveringOffset,\n      isHoveringTrack,\n      isHoveringFiller,\n      isHoveringRail,\n      isHoveringThumbFrom,\n      isHoveringThumbTo,\n      isDragging,\n    };\n  },\n});\n</script>\n"],"names":["RangeSlider","RangeSliderOrientations","SliderOrientation","RangeSliderRail","RangeSliderRailOrientations","RangeSliderOffset","RangeSliderOffsetOrientations","RangeSliderTrack","RangeSliderTrackColors","SliderColor","RangeSliderThumb","RangeSliderThumbColors","RangeSliderBreakpointMark","RangeSliderBreakpointMarkColors","RangeSliderLabel","RangeSliderLabelOrientations","RangeSliderLabelMark","RangeSliderLabelMarkOrientations","_sfc_main","defineComponent","OrTooltip","props","context","root","ref","rootStyles","computed","Styles.RangeSlider","Styles.RangeSliderOrientations","rail","railStyles","Styles.RangeSliderRail","Styles.RangeSliderRailOrientations","offset","offsetStyles","Styles.RangeSliderOffset","Styles.RangeSliderOffsetOrientations","offsetInlineStyles","internalModelValueFrom","track","trackStyles","Styles.RangeSliderTrack","Styles.RangeSliderTrackColors","trackInlineStyles","internalModelValueTo","filler","thumbFrom","thumbTo","thumbStyles","Styles.RangeSliderThumb","Styles.RangeSliderThumbColors","breakpointMarkStyles","Styles.RangeSliderBreakpointMark","Styles.RangeSliderBreakpointMarkColors","labelStyles","Styles.RangeSliderLabel","Styles.RangeSliderLabelOrientations","labelMarkStyles","Styles.RangeSliderLabelMark","Styles.RangeSliderLabelMarkOrientations","proxyModelValue","useProxyModelValue","toRef","watch","a","b","proxyModelValueFrom","value","draftProxyModelValue","proxyModelValueTo","modelValue","internalBreakpoints","index","tooltipPlacement","highlightedBreakpoint","selectedControl","railBoundingBox","useElementBounding","onDrag","position","event","totalWidth","totalHeight","clamp","onClick","breakpoint","getBreakpointMarkComputedStyles","getBreakpointOffset","isHoveringOffset","useElementHover","isHoveringTrack","isHoveringFiller","isHoveringRail","isHoveringThumbFrom","isHoveringThumbTo","isDragging","useDraggable","_resolveComponent","_openBlock","_createElementBlock","_normalizeClass","_ctx","_normalizeStyle","_hoisted_3","_createVNode","_component_OrTooltip","_mergeProps","_withCtx","_renderSlot","_createElementVNode","_hoisted_5","_hoisted_7","_Fragment","_renderList","$event","_createCommentVNode","_hoisted_2","_cache"],"mappings":";;;;;;AAEO,MAAMA,KAAwB;AAAA;AAAA,EAEnC;AACF,GAEaC,KAA+D;AAAA,EAC1E,CAACC,EAAkB,UAAU,GAAG;AAAA;AAAA,IAE9B;AAAA;AAAA,IAGA;AAAA,EACF;AAAA,EAEA,CAACA,EAAkB,kBAAkB,GAAG;AAAA;AAAA,IAEtC;AAAA;AAAA,IAGA;AAAA,EACF;AAAA,EAEA,CAACA,EAAkB,QAAQ,GAAG;AAAA;AAAA,IAE5B;AAAA;AAAA,IAGA;AAAA,EACF;AAAA,EAEA,CAACA,EAAkB,gBAAgB,GAAG;AAAA;AAAA,IAEpC;AAAA;AAAA,IAGA;AAAA,EACF;AACF,GAEaC,KAA4B;AAAA;AAAA,EAEvC;AAAA;AAAA,EAGA;AAAA;AAAA,EAGA;AAAA;AAAA,EAGA;AAAA,EACA;AACF,GAEaC,KAAmE;AAAA,EAC9E,CAACF,EAAkB,UAAU,GAAG;AAAA;AAAA,IAE9B;AAAA;AAAA,IAGA;AAAA,IACA;AAAA;AAAA,IAGA;AAAA,IACA;AAAA,EACF;AAAA,EAEA,CAACA,EAAkB,kBAAkB,GAAG;AAAA;AAAA,IAEtC;AAAA;AAAA,IAGA;AAAA,IACA;AAAA;AAAA,IAGA;AAAA,IACA;AAAA,EACF;AAAA,EAEA,CAACA,EAAkB,QAAQ,GAAG;AAAA;AAAA,IAE5B;AAAA;AAAA,IAGA;AAAA,IACA;AAAA;AAAA,IAGA;AAAA,IACA;AAAA,EACF;AAAA,EAEA,CAACA,EAAkB,gBAAgB,GAAG;AAAA;AAAA,IAEpC;AAAA;AAAA,IAGA;AAAA,IACA;AAAA;AAAA,IAGA;AAAA,IACA;AAAA,EACF;AACF,GAEaG,KAA8B,CAAA,GAE9BC,KAAqE;AAAA,EAChF,CAACJ,EAAkB,UAAU,GAAG;AAAA;AAAA,IAE9B;AAAA,EACF;AAAA,EAEA,CAACA,EAAkB,kBAAkB,GAAG;AAAA;AAAA,IAEtC;AAAA,EACF;AAAA,EAEA,CAACA,EAAkB,QAAQ,GAAG;AAAA;AAAA,IAE5B;AAAA,EACF;AAAA,EAEA,CAACA,EAAkB,gBAAgB,GAAG;AAAA;AAAA,IAEpC;AAAA,EACF;AACF,GAEaK,KAA6B;AAAA;AAAA,EAExC;AAAA;AAAA,EAGA;AAAA,EACA;AACF,GAEaC,KAAwD;AAAA,EACnE,CAACC,EAAY,OAAO,GAAG;AAAA;AAAA,IAErB;AAAA,IACA;AAAA,EACF;AAAA,EAEA,CAACA,EAAY,SAAS,GAAG;AAAA;AAAA,IAEvB;AAAA,IACA;AAAA,EACF;AACF,GAEaC,KAA6B;AAAA;AAAA,EAExC;AAAA;AAAA,EAGA;AAAA;AAAA,EAGA;AAAA;AAAA,EAGA;AAAA,EACA;AAAA;AAAA,EAGA;AAAA,EACA;AAAA;AAAA,EAGA;AAAA,EACA;AACF,GAEaC,KAAwD;AAAA,EACnE,CAACF,EAAY,OAAO,GAAG;AAAA;AAAA,IAErB;AAAA,IACA;AAAA;AAAA,IAGA;AAAA,IACA;AAAA;AAAA,IAGA;AAAA,IACA;AAAA,IAEA;AAAA,IACA;AAAA,EACF;AAAA,EAEA,CAACA,EAAY,SAAS,GAAG;AAAA;AAAA,IAEvB;AAAA,IACA;AAAA;AAAA,IAGA;AAAA,IACA;AAAA;AAAA,IAGA;AAAA,IACA;AAAA,IAEA;AAAA,IACA;AAAA,EACF;AACF,GAEaG,KAAsC;AAAA;AAAA,EAEjD;AAAA;AAAA,EAGA;AAAA;AAAA,EAGA;AAAA,EACA;AAAA;AAAA,EAGA;AAAA,EACA;AACF,GAEaC,KAAiE;AAAA,EAC5E,CAACJ,EAAY,OAAO,GAAG;AAAA;AAAA,IAErB;AAAA,IACA;AAAA;AAAA,IAGA;AAAA,IACA;AAAA;AAAA,IAGA;AAAA,IACA;AAAA,EACF;AAAA,EAEA,CAACA,EAAY,SAAS,GAAG;AAAA;AAAA,IAEvB;AAAA,IACA;AAAA;AAAA,IAGA;AAAA,IACA;AAAA;AAAA,IAGA;AAAA,IACA;AAAA,EACF;AACF,GAEaK,KAA6B;AAAA;AAAA,EAExC;AACF,GAEaC,KAAoE;AAAA,EAC/E,CAACb,EAAkB,UAAU,GAAG;AAAA;AAAA,IAE9B;AAAA;AAAA,IAGA;AAAA,EACF;AAAA,EAEA,CAACA,EAAkB,kBAAkB,GAAG;AAAA;AAAA,IAEtC;AAAA;AAAA,IAGA;AAAA,EACF;AAAA,EAEA,CAACA,EAAkB,QAAQ,GAAG;AAAA;AAAA,IAE5B;AAAA;AAAA,IAGA;AAAA,EACF;AAAA,EAEA,CAACA,EAAkB,gBAAgB,GAAG;AAAA;AAAA,IAEpC;AAAA;AAAA,IAGA;AAAA,EACF;AACF,GAEac,KAAiC;AAAA;AAAA,EAE5C;AAAA;AAAA,EAGA;AAAA;AAAA,EAGA;AAAA;AAAA,EAGA;AAAA,EACA;AAAA;AAAA,EAGA;AAAA,EACA;AACF,GAEaC,KAAwE;AAAA,EACnF,CAACf,EAAkB,UAAU,GAAG;AAAA;AAAA,IAE9B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,CAACA,EAAkB,kBAAkB,GAAG;AAAA;AAAA,IAEtC;AAAA,IACA;AAAA,EACF;AAAA,EAEA,CAACA,EAAkB,QAAQ,GAAG;AAAA;AAAA,IAE5B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,CAACA,EAAkB,gBAAgB,GAAG;AAAA;AAAA,IAEpC;AAAA,IACA;AAAA,EACF;AACF,GC5NAgB,KAAeC,GAAgB;AAAA,EAC7B,MAAM;AAAA,EAEN,YAAY;AAAA,IACV,WAAAC;AAAA,EACF;AAAA,EAEA,OAAO;AAAA,IACL,MAAM;AAAA,IACN,OAAO;AAAA,EACT;AAAA,EAEA,OAAO;AAAA,IACL,YAAY;AAAA,MACV,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IAEA,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IAEA,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IAEA,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IAEA,aAAa;AAAA,MACX,MAAM;AAAA,MACN,SAAS,MAAM,CAAC;AAAA,IAClB;AAAA,IAEA,OAAO;AAAA,MACL,MAAM;AAAA,MACN,SAAS,MAAMX,EAAY;AAAA,IAC7B;AAAA,IAEA,aAAa;AAAA,MACX,MAAM;AAAA,MACN,SAAS,MAAMP,EAAkB;AAAA,IACnC;AAAA,IAEA,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IAEA,SAAS;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,EACF;AAAA,EAEA,OAAO;AAAA,IACL;AAAA,EACF;AAAA,EAEA,QAAQ;AAAA,IACN;AAAA,EACF;AAAA,EAEA,MAAMmB,GAAOC,GAAS;AAEpB,UAAMC,IAAOC,KAEPC,IAAaC,EAAS,MAAM;AAAA,MAChC;AAAA,MACA,GAAGC;AAAAA,MACH,GAAGC,GAA+BP,EAAM,WAAW;AAAA,IAAA,CACpD,GAEKQ,IAAOL,KAEPM,IAAaJ,EAAS,MAAM;AAAA,MAChC;AAAA,MACA,GAAGK;AAAAA,MACH,GAAGC,GAAmCX,EAAM,WAAW;AAAA,IAAA,CACxD,GAEKY,IAAST,KAETU,IAAeR,EAAS,MAAM;AAAA,MAClC,GAAGS;AAAAA,MACH,GAAGC,GAAqCf,EAAM,WAAW;AAAA,IAAA,CAC1D,GAGKgB,IAAqBX,EAAS,MAAM;AACxC,cAAQL,EAAM,aAAa;AAAA,QACzB,KAAKnB,EAAkB;AAAA,QACvB,KAAKA,EAAkB;AACrB,iBAAO,EAAE,OAAO,GAAGoC,EAAuB,QAAQ,GAAG;QAEvD,KAAKpC,EAAkB;AAAA,QACvB,KAAKA,EAAkB;AACrB,iBAAO,EAAE,QAAQ,GAAGoC,EAAuB,QAAQ,GAAG;MAC1D;AAAA,IAAA,CACD,GAEKC,IAAQf,KAERgB,IAAcd,EAAS,MAAM;AAAA,MACjC,GAAGe;AAAAA,MACH,GAAGC,GAA8BrB,EAAM,KAAK;AAAA,IAAA,CAC7C,GAGKsB,IAAoBjB,EAAS,MAAM;AACvC,cAAQL,EAAM,aAAa;AAAA,QACzB,KAAKnB,EAAkB;AAAA,QACvB,KAAKA,EAAkB;AACd,iBAAA,EAAE,OAAO,IAAI0C,EAAqB,QAAQN,EAAuB,SAAS,GAAG;QAEtF,KAAKpC,EAAkB;AAAA,QACvB,KAAKA,EAAkB;AACd,iBAAA,EAAE,QAAQ,IAAI0C,EAAqB,QAAQN,EAAuB,SAAS,GAAG;MACzF;AAAA,IAAA,CACD,GAEKO,IAASrB,KAETsB,IAAYtB,KACZuB,IAAUvB,KAEVwB,IAActB,EAAS,MAAM;AAAA,MACjC;AAAA,MACA,GAAGuB;AAAAA,MACH,GAAGC,GAA8B7B,EAAM,KAAK;AAAA,MAC5C;AAAA;AAAA,IAAA,CACD,GAEK8B,KAAuBzB,EAAS,MAAM;AAAA,MAC1C,GAAG0B;AAAAA,MACH,GAAGC,GAAuChC,EAAM,KAAK;AAAA,IAAA,CACtD,GAEKiC,KAAc5B,EAAS,MAAM;AAAA,MACjC,GAAG6B;AAAAA,MACH,GAAGC,GAAoCnC,EAAM,WAAW;AAAA,IAAA,CACzD,GAEKoC,KAAkB/B,EAAS,MAAM;AAAA,MACrC,GAAGgC;AAAAA,MACH,GAAGC,GAAwCtC,EAAM,WAAW;AAAA,IAAA,CAC7D,GAGKuC,IAAkBC,GAAmBC,GAAMzC,GAAO,YAAY,GAAGC,EAAQ,MAAM;AAAA,MACnF,cAAcI,EAA2B,MAAM,CAACL,EAAM,UAAUA,EAAM,QAAQ,CAAC;AAAA,IAAA,CAChF;AAED,IAAA0C,EAAMH,GAAiB,CAAC,CAACI,GAAGC,CAAC,MAAM;AACjC,cAAQ5C,EAAM,aAAa;AAAA,QACzB,KAAKnB,EAAkB;AAAA,QACvB,KAAKA,EAAkB;AACrB,UAAI8D,IAAIC,MAAGL,EAAgB,QAAQ,CAACK,GAAGD,CAAC;AACxC;AAAA,QAEF,KAAK9D,EAAkB;AAAA,QACvB,KAAKA,EAAkB;AACrB,UAAI8D,IAAIC,MAAGL,EAAgB,QAAQ,CAACK,GAAGD,CAAC;AACxC;AAAA,MACJ;AAAA,IAAA,CACD;AAED,UAAME,IAAsBxC,EAAS;AAAA,MACnC,KAAK,MAAM;AACT,gBAAQL,EAAM,aAAa;AAAA,UACzB,KAAKnB,EAAkB;AAAA,UACvB,KAAKA,EAAkB;AACd,mBAAA0D,EAAgB,MAAM,CAAC;AAAA,UAEhC,KAAK1D,EAAkB;AAAA,UACvB,KAAKA,EAAkB;AACd,mBAAA0D,EAAgB,MAAM,CAAC;AAAA,QAClC;AAEA,eAAOvC,EAAM;AAAA,MACf;AAAA,MAEA,KAAK,CAAC8C,MAAU;AACR,cAAAC,IAAuB,CAACD,KAAS9C,EAAM,UAAUuC,EAAgB,MAAM,CAAC,CAAC;AAE/E,gBAAQvC,EAAM,aAAa;AAAA,UACzB,KAAKnB,EAAkB;AAAA,UACvB,KAAKA,EAAkB;AACrB,YAAA0D,EAAgB,QAAQQ;AACxB;AAAA,UAEF,KAAKlE,EAAkB;AAAA,UACvB,KAAKA,EAAkB;AACrB,YAAA0D,EAAgB,QAAQ,CAACQ,EAAqB,CAAC,GAAGA,EAAqB,CAAC,CAAC;AACzE;AAAA,QACJ;AAAA,MACF;AAAA,IAAA,CACD,GAEKC,IAAoB3C,EAAS;AAAA,MACjC,KAAK,MAAM;AACT,gBAAQL,EAAM,aAAa;AAAA,UACzB,KAAKnB,EAAkB;AAAA,UACvB,KAAKA,EAAkB;AACd,mBAAA0D,EAAgB,MAAM,CAAC;AAAA,UAEhC,KAAK1D,EAAkB;AAAA,UACvB,KAAKA,EAAkB;AACd,mBAAA0D,EAAgB,MAAM,CAAC;AAAA,QAClC;AAEA,eAAOvC,EAAM;AAAA,MACf;AAAA,MAEA,KAAK,CAAC8C,MAAU;AACR,cAAAC,IAAuB,CAACR,EAAgB,MAAM,CAAC,GAAGO,KAAS9C,EAAM,QAAQ;AAE/E,gBAAQA,EAAM,aAAa;AAAA,UACzB,KAAKnB,EAAkB;AAAA,UACvB,KAAKA,EAAkB;AACrB,YAAA0D,EAAgB,QAAQQ;AACxB;AAAA,UAEF,KAAKlE,EAAkB;AAAA,UACvB,KAAKA,EAAkB;AACrB,YAAA0D,EAAgB,QAAQ,CAACQ,EAAqB,CAAC,GAAGA,EAAqB,CAAC,CAAC;AACzE;AAAA,QACJ;AAAA,MACF;AAAA,IAAA,CACD,GAEK9B,IAAyBZ,EAAS;AAAA,MACtC,KAAK,OAAOwC,EAAoB,QAAQ7C,EAAM,aAAaA,EAAM,WAAWA,EAAM;AAAA,MAElF,KAAK,CAAC8C,MAAU;AACd,cAAMG,IAAaH,KAAS9C,EAAM,WAAWA,EAAM,YAAYA,EAAM,UAE/D+C,IAAuB;AAAA,UAC3BG,EAAoB,MAAM,OAAO,CAACP,GAAGC,MAC5B,KAAK,IAAID,IAAIM,CAAU,IAAI,KAAK,IAAIL,IAAIK,CAAU,IAAIN,IAAIC,CAClE;AAAA,UAEDrB,EAAqB,SAASvB,EAAM,WAAWA,EAAM,YAAYA,EAAM;AAAA,QAAA;AAGzE,gBAAQA,EAAM,aAAa;AAAA,UACzB,KAAKnB,EAAkB;AAAA,UACvB,KAAKA,EAAkB;AACrB,YAAA0D,EAAgB,QAAQQ;AACxB;AAAA,UAEF,KAAKlE,EAAkB;AAAA,UACvB,KAAKA,EAAkB;AACrB,YAAA0D,EAAgB,QAAQ,CAACQ,EAAqB,CAAC,GAAGA,EAAqB,CAAC,CAAC;AACzE;AAAA,QACJ;AAAA,MACF;AAAA,IAAA,CACD,GAEKxB,IAAuBlB,EAAS;AAAA,MACpC,KAAK,OAAO2C,EAAkB,QAAQhD,EAAM,aAAaA,EAAM,WAAWA,EAAM;AAAA,MAEhF,KAAK,CAAC8C,MAAU;AACd,cAAMG,IAAaH,KAAS9C,EAAM,WAAWA,EAAM,YAAYA,EAAM,UAE/D+C,IAAuB;AAAA,UAC3B9B,EAAuB,SAASjB,EAAM,WAAWA,EAAM,YAAYA,EAAM;AAAA,UAEzEkD,EAAoB,MAAM,OAAO,CAACP,GAAGC,MAC5B,KAAK,IAAID,IAAIM,CAAU,IAAI,KAAK,IAAIL,IAAIK,CAAU,IAAIN,IAAIC,CAClE;AAAA,QAAA;AAGH,gBAAQ5C,EAAM,aAAa;AAAA,UACzB,KAAKnB,EAAkB;AAAA,UACvB,KAAKA,EAAkB;AACrB,YAAA0D,EAAgB,QAAQQ;AACxB;AAAA,UAEF,KAAKlE,EAAkB;AAAA,UACvB,KAAKA,EAAkB;AACrB,YAAA0D,EAAgB,QAAQ,CAACQ,EAAqB,CAAC,GAAGA,EAAqB,CAAC,CAAC;AACzE;AAAA,QACJ;AAAA,MACF;AAAA,IAAA,CACD,GAEKG,IAAsB7C,EAAS,MAC9BL,EAAM,OAIJ,MAAM,KAAK,KAAK,KAAK,IAAIA,EAAM,WAAWA,EAAM,QAAQ,IAAIA,EAAM,IAAI,CAAC,EAC3E,KAAK,MAAS,EACd,IAAI,CAAC8C,GAAOK,MAAU,KAAK,OAAOnD,EAAM,WAAWA,EAAM,OAAOmD,KAAS,GAAI,IAAI,GAAI,EACrF,OAAO,GAAGnD,EAAM,aAAaA,EAAM,QAAQ,EAC3C,KAAK,CAAC2C,GAAGC,MAAMD,IAAIC,CAAC,IAPd,CAAC5C,EAAM,UAAU,GAAGA,EAAM,aAAaA,EAAM,QAAQ,CAQ/D,GAGKoD,KAAmB/C,EAAS,MAAM;AACtC,cAAQL,EAAM,aAAa;AAAA,QACzB,KAAKnB,EAAkB;AAAA,QACvB,KAAKA,EAAkB;AACd,iBAAA;AAAA,QAET,KAAKA,EAAkB;AAAA,QACvB,KAAKA,EAAkB;AACd,iBAAA;AAAA,MACX;AAAA,IAAA,CACD,GAEKwE,KAAwBlD,KACxBmD,IAAkBnD,KAElBoD,IAAkBC,GAAmBhD,CAAI;AAGtC,aAAAiD,EAAOC,GAAoBC,GAAwC;AAC1E,UAAI3D,EAAM;AACR;AAGI,YAAA4D,IAAaL,EAAgB,MAAM,OACnCM,IAAcN,EAAgB,OAAO;AAEvC,UAAAD,EAAgB,UAAU;AAC5B,gBAAQtD,EAAM,aAAa;AAAA,UACzB,KAAKnB,EAAkB;AACE,YAAAoC,EAAA,QAAQ6C,EAAMH,EAAM,UAAUJ,EAAgB,KAAK,OAAO,GAAGhC,EAAqB,QAAQqC,CAAU,IAAIA;AAC/H;AAAA,UAEF,KAAK/E,EAAkB;AACE,YAAAoC,EAAA,QAAQ6C,EAAMP,EAAgB,MAAM,QAAQI,EAAM,SAAS,GAAGpC,EAAqB,QAAQqC,CAAU,IAAIA;AAChI;AAAA,UAEF,KAAK/E,EAAkB;AACrB,YAAAoC,EAAuB,QAAQ6C,EAAMD,KAAeF,EAAM,UAAUJ,EAAgB,IAAI,QAAQ,GAAGhC,EAAqB,QAAQsC,CAAW,IAAIA;AAC/I;AAAA,UAEF,KAAKhF,EAAkB;AACrB,YAAAoC,EAAuB,QAAQ6C,EAAMD,KAAeN,EAAgB,OAAO,QAAQI,EAAM,UAAU,GAAGpC,EAAqB,QAAQsC,CAAW,IAAIA;AAClJ;AAAA,QACJ;AAAA;AAEA,gBAAQ7D,EAAM,aAAa;AAAA,UACzB,KAAKnB,EAAkB;AACA,YAAA0C,EAAA,QAAQuC,EAAMH,EAAM,UAAUJ,EAAgB,KAAK,OAAOtC,EAAuB,QAAQ2C,GAAYA,CAAU,IAAIA;AACxI;AAAA,UAEF,KAAK/E,EAAkB;AACA,YAAA0C,EAAA,QAAQuC,EAAMP,EAAgB,MAAM,QAAQI,EAAM,SAAS1C,EAAuB,QAAQ2C,GAAYA,CAAU,IAAIA;AACzI;AAAA,UAEF,KAAK/E,EAAkB;AACrB,YAAA0C,EAAqB,QAAQuC,EAAMD,KAAeF,EAAM,UAAUJ,EAAgB,IAAI,QAAQtC,EAAuB,QAAQ4C,GAAaA,CAAW,IAAIA;AACzJ;AAAA,UAEF,KAAKhF,EAAkB;AACrB,YAAA0C,EAAqB,QAAQuC,EAAMD,KAAeN,EAAgB,OAAO,QAAQI,EAAM,UAAU1C,EAAuB,QAAQ4C,GAAaA,CAAW,IAAIA;AAC5J;AAAA,QACJ;AAAA,IAEJ;AAEA,aAASE,GAAQC,GAA0B;AACrC,MAAAV,EAAgB,UAAU,UAC5BT,EAAoB,QAAQmB,GAC5BV,EAAgB,QAAQ,SAExBN,EAAkB,QAAQgB,GAC1BV,EAAgB,QAAQ;AAAA,IAE5B;AAGA,aAASW,GAAgCD,GAA8D;AACrG,cAAQhE,EAAM,aAAa;AAAA,QACzB,KAAKnB,EAAkB;AACrB,iBAAO,EAAE,MAAM,GAAGqF,EAAoBF,CAAU,IAAI,GAAG;QAEzD,KAAKnF,EAAkB;AACrB,iBAAO,EAAE,OAAO,GAAGqF,EAAoBF,CAAU,IAAI,GAAG;QAE1D,KAAKnF,EAAkB;AACrB,iBAAO,EAAE,QAAQ,GAAGqF,EAAoBF,CAAU,IAAI,GAAG;QAE3D,KAAKnF,EAAkB;AACrB,iBAAO,EAAE,KAAK,GAAGqF,EAAoBF,CAAU,IAAI,GAAG;MAC1D;AAAA,IACF;AAGA,aAASE,EAAoBF,GAA4B;AACvD,cAAQA,IAAahE,EAAM,aAAaA,EAAM,WAAWA,EAAM;AAAA,IACjE;AAGM,UAAAmE,IAAmBC,EAAgBxD,CAAM,GACzCyD,IAAkBD,EAAgBlD,CAAK,GACvCoD,IAAmBF,EAAgB5C,CAAM,GAEzC+C,KAAiBlE,EAAS,MACvB8D,EAAiB,SAASE,EAAgB,SAASC,EAAiB,KAC5E,GAEKE,KAAsBJ,EAAgB3C,CAAS,GAC/CgD,KAAoBL,EAAgB1C,CAAO,GAE3C,EAAE,YAAAgD,GAAA,IAAeC,GAAanE,GAAM;AAAA,MACxC,SAAS,CAACkD,GAAUC,MAAU;AAC5B,gBAAQA,EAAM,QAAQ;AAAA,UACpB,KAAKlC,EAAU;AACb,YAAA6B,EAAgB,QAAQ;AACxB;AAAA,UAEF,KAAK5B,EAAQ;AACX,YAAA4B,EAAgB,QAAQ;AACxB;AAAA,UAEF;AACE,YAAAA,EAAgB,QAAQA,EAAgB,UAAU,SAAS,OAAO;AAAA,QACtE;AAEA,QAAAG,EAAOC,GAAUC,CAAK;AAAA,MACxB;AAAA,MAEA,QAAQF;AAAA,MACR,OAAOA;AAAA,IAAA,CACR;AAGD,WAAAf,EAAM,MAAM1C,EAAM,UAAU,CAAC8C,MAAU;AACjC,UAAAA,KAAS9C,EAAM;AACX,cAAA,IAAI,MAAM,6DAA6D;AAAA,IAC/E,GACC,EAAE,WAAW,GAAA,CAAM,GAEtB0C,EAAM,MAAM1C,EAAM,UAAU,CAAC8C,MAAU;AACjC,UAAAA,KAAS9C,EAAM;AACX,cAAA,IAAI,MAAM,8DAA8D;AAAA,IAChF,GACC,EAAE,WAAW,GAAA,CAAM,GAEf;AAAA,MACL,MAAAE;AAAA,MACA,YAAAE;AAAA,MAEA,MAAAI;AAAA,MACA,YAAAC;AAAA,MAEA,QAAAG;AAAA,MACA,cAAAC;AAAA,MACA,oBAAAG;AAAA,MAEA,OAAAE;AAAA,MACA,aAAAC;AAAA,MACA,mBAAAG;AAAA,MAEA,QAAAE;AAAA,MAEA,WAAAC;AAAA,MACA,SAAAC;AAAA,MACA,aAAAC;AAAA,MAEA,sBAAAG;AAAA,MAEA,aAAAG;AAAA,MACA,iBAAAG;AAAA,MAEA,iBAAAG;AAAA,MACA,kBAAAa;AAAA,MACA,uBAAAC;AAAA,MACA,iBAAAC;AAAA,MAEA,SAAAS;AAAA,MAEA,iCAAAE;AAAA,MAEA,kBAAAE;AAAA,MACA,iBAAAE;AAAA,MACA,kBAAAC;AAAA,MACA,gBAAAC;AAAA,MACA,qBAAAC;AAAA,MACA,mBAAAC;AAAA,MACA,YAAAC;AAAA,IAAA;AAAA,EAEJ;AACF,CAAC;;YAvmBCE,GA8GM,WAAA;SA5GEC,EAAY,GAAAC,EAAA,OAAA;AAAA,IACjB,KAAA;AAAA,IAAA,OAAAC,EAAAC,EAAA,UAAA;AAAA,IAED,UAAAA,EAAA;AAAA,EAAA,GAAA;AAAA,MAEQ,OAAE;AAAA,MACP,KAAA;AAAA,MAAA,OAAAD,EAAAC,EAAA,UAAA;AAAA,MAED,UAAAA,EAAA;AAAA,IAAA,GAAA;AAAA,QAEQ,OAAE;AAAA,QACP,KAAK;AAAA,QACL,OAAkBD,EAAAC,EAAA,YAAA;AAAA,QAAA,OAAAC,EAAAD,EAAA,kBAAA;AAAA,QAGrB,UAqBYA,EAAA;AAAA,MAAA,GApBT,UAAOE,EAAI;AAAA,MAAAC,EACAC,GAAgBC,EAAA;AAAA,QAC3B,WAAU,CAAAL,EAAA,eAAAA,EAAA,kBAAAA,EAAA,wBAAAA,EAAA,cAAAA,EAAA,oBAAA;AAAA,QACV,WAAAA,EAAA;AAAA,QACO,QAAA;AAAA,QAQS,oBAMR;AAAA,MAAA,GAAAA,EALP,OAKO,GAAA;AAAA,QAAA,SAHCM,EAAE,MAAA;AAAA,UAGHC,EAAAP,EAAA,QAAA,kBAAA;AAAA,YADF,OAAAA,EAAA,gBAAAA,EAAA,YAAA,SAAe,WAAC,IAAY,IAAA,CAAA;AAAA,UAAA,GAAA,MAAA;AAAA;;;iBAV3BM,EAAW,MAAA;AAAA,UAAAE,EACX,OAAE;AAAA,YACP,KAAA;AAAA,YAAA,OAAAT,EAAAC,EAAA,WAAA;AAAA;;;QAaL,GAAA;AAAA,MAAA,GACG,IAAK,CAAO,WAAA,WAAA,CAAA;AAAA,MAAAQ,EACP,OAAE;AAAA,QACP,KAAK;AAAA,QACL,OAAkBT,EAAAC,EAAA,WAAA;AAAA,QAAA,OAAAC,EAAAD,EAAA,iBAAA;AAAA,QAGrB,UAqBYA,EAAA;AAAA,MAAA,GApBT,UAAOS,EAAI;AAAA,MAAAN,EACAC,GAAgBC,EAAA;AAAA,QAC3B,WAAU,CAAAL,EAAA,eAAAA,EAAA,kBAAAA,EAAA,sBAAAA,EAAA,cAAAA,EAAA,oBAAA;AAAA,QACV,WAAAA,EAAA;AAAA,QACO,QAAA;AAAA,QAQS,oBAMR;AAAA,MAAA,GAAAA,EALP,OAKO,GAAA;AAAA,QAAA,SAHCM,EAAE,MAAA;AAAA,UAGHC,EAAAP,EAAA,QAAA,kBAAA;AAAA,YADF,OAAAA,EAAA,gBAAAA,EAAA,YAAA,SAAe,WAAC,IAAY,IAAA,CAAA;AAAA,UAAA,GAAA,MAAA;AAAA;;;iBAV3BM,EAAS,MAAA;AAAA,UAAAE,EACT,OAAE;AAAA,YACP,KAAA;AAAA,YAAA,OAAAT,EAAAC,EAAA,WAAA;AAAA;;;QAaL,GAAA;AAAA,MAAA,GACG,IAAK,CAAQ,WAAA,WAAA,CAAA;AAAA,MACRQ,EAAA,OAAA;AAAA,QACL,KAAA;AAAA,QAAA,OAAAT,EAAA,CAAA,QAAA,GAAAC,EAAA,YAAA,CAAA;AAAA,QAGa,UAAWA,EAAA;AAAA,MAAA,GACzB,MAAA,IAAAU,EAAA;AAAA,MAAAV,EAAA,YAAA,SAAA,KAAAH,EAEQ,EAAU,GAAAC,EAAAa,GAAA,EAAA,KAAA,EAAA,GAAAC,EAAA,CAAAZ,EAAA,UAAA,GAAAA,EAAA,aAAAA,EAAA,QAAA,GAAA,CAAAhB,OACVa,EAAE,GAAAC,EAAA,OAAA;AAAA,QACP,KAAKd;AAAA,QACL,OAAAe,EAAqBC,EAAI,oBAAgB;AAAA,QACzC,OAAkBC,EAAAD,EAAA,gCAAAhB,CAAA,CAAA;AAAA,QAClB,WAAAA,KAAYgB,EAAqB,gBAAAA,EAAA,YAAG,SAAU,WAAA,IAAA,IAAA,CAAA,KAAAhB,KAAAgB,EAAA,gBAAAA,EAAA,YAAA,SAAA,WAAA,IAAA,IAAA,CAAA;AAAA,QAC9C,UAAUA,EAAA;AAAA,QAAA,cAAA,CAAAa,MAAAb,EAAA,wBAAAhB;AAAA;kCAKjB8B,GAmBM,IAAA,EAAA;AAAA,IAAA,GAnBA,IAAKC,EAAA;AAAA,IAAAP,EAAA,OAAA;AAAA,eACTR,EAiBM,WAAA;AAAA,IAAA,GAAA;AAAA,SAfE,EAAU,GAAAF,EAAAa,GAAA,MAAAC,EAAA,CAAAZ,EAAA,UAAA,GAAAA,EAAA,aAAAA,EAAA,QAAA,GAAA,CAAAhB,OACVa,EAAA,GAAAC,EAAE,OAAe;AAAA,QACtB,KAAKd;AAAA,QACL,OAAkBe,EAAAC,EAAA,eAAA;AAAA,QAClB,OAAAC,EAAaD,kCAAoChB,CAAa,CAAA;AAAA,QAC9D,UAAUgB,EAAA;AAAA,QACV,eAAUA,EAAE,0BAAAhB,IAAA,UAAA;AAAA,QACZ,cAAK,OAAEgB,EAAkB,wBAAAhB;AAAA,QAAA,cAAAgC,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAH,MAAAb,EAAA,wBAAA;AAAA,QAE1B,SAAA,CAAAa,MAKOb,UAJKhB,CAAU;AAAA,MAAA,GAAA;AAAA;;;;;;;;"}

package/dist/esm/{OrRating-BhuvRBRy.mjs → OrRating-CAwz23JA.mjs}

@@ -1,6 +1,6 @@
-import { defineComponent as R, ref as l, computed as u, inject as S, toRef as V, watch as O, reactive as C, resolveComponent as I, openBlock as f, createElementBlock as c, normalizeClass as M, Fragment as z, renderList as B, createVNode as $ } from "vue";
-import { useResponsive as E, useProxyModelValue as L } from "@onereach/ui-components-common/hooks";
-import { O as j } from "./OrIcon-k8cyvh-D.mjs";
+import { useResponsive as R, useProxyModelValue as S } from "@onereach/ui-components-common/hooks";
+import { O as V } from "./OrIcon-k8cyvh-D.mjs";
+import { defineComponent as O, ref as l, computed as u, inject as C, toRef as I, watch as z, reactive as B, resolveComponent as $, openBlock as f, createElementBlock as c, normalizeClass as M, Fragment as E, renderList as L, createVNode as j } from "vue";
 import { _ as x } from "./_plugin-vue_export-helper-CHgC5LLL.mjs";
 var d = /* @__PURE__ */ ((e) => (e.Default = "default", e.Fitted = "fitted", e))(d || {});
 const D = [
@@ -33,10 +33,10 @@ const D = [
 ], T = [
   // Typography;
   "text-[32px]"
-], _ = Symbol(), A = R({
+], _ = Symbol(), A = O({
   name: "OrRating",
   components: {
-    OrIcon: j
+    OrIcon: V
   },
   model: {
     prop: "modelValue",
@@ -67,7 +67,7 @@ const D = [
     "root"
   ],
   setup(e, m) {
-    const v = l(), { isMobile: r } = E(), p = u(() => [
+    const v = l(), { isMobile: r } = R(), p = u(() => [
       "or-rating-v3",
       ...D,
       ...F[e.variant]
@@ -75,11 +75,11 @@ const D = [
       ...N,
       ...e.readonly ? ["interactivity-none"] : [],
       ...r.value ? T : []
-    ]), s = S(_, 5), t = L(V(e, "modelValue"), m.emit, { defaultValue: l(0) }), o = l(t.value);
-    O(t, (n) => {
+    ]), s = C(_, 5), t = S(I(e, "modelValue"), m.emit, { defaultValue: l(0) }), o = l(t.value);
+    z(t, (n) => {
       o.value = Math.floor(n * 2) / 2;
     }, { immediate: !0 });
-    const i = C(Array(s).fill(!1)), b = u(() => (n) => e.variant === "fitted" || r.value ? "inherit" : i[n] ? "xl" : "l");
+    const i = B(Array(s).fill(!1)), b = u(() => (n) => e.variant === "fitted" || r.value ? "inherit" : i[n] ? "xl" : "l");
     function g(n, a) {
       i[a] = !0;
     }
@@ -107,13 +107,13 @@ const D = [
   }
 }), G = ["disabled"], H = ["activated", "disabled", "onMouseenter", "onMousemove", "onMouseleave", "onClick"];
 function P(e, m, v, r, p, y) {
-  const s = I("OrIcon");
+  const s = $("OrIcon");
   return f(), c("div", {
     ref: "root",
     class: M(e.rootStyles),
     disabled: e.disabled
   }, [
-    (f(!0), c(z, null, B(e.length, (t) => (f(), c("div", {
+    (f(!0), c(E, null, L(e.length, (t) => (f(), c("div", {
       ref_for: !0,
       ref: "stars",
       key: t,
@@ -127,7 +127,7 @@ function P(e, m, v, r, p, y) {
         e.model = e.draft, e.hoverIndex[t - 1] = !1;
       }
     }, [
-      $(s, {
+      j(s, {
         icon: e.draft - t + 1 === 0.5 ? "star_half" : "star",
         variant: t <= e.draft ? "filled" : "outlined",
         size: e.starSize(t - 1)
@@ -140,4 +140,4 @@ export {
   Q as O,
   d as R
 };
-//# sourceMappingURL=OrRating-BhuvRBRy.mjs.map
+//# sourceMappingURL=OrRating-CAwz23JA.mjs.map

package/dist/esm/OrRating-CAwz23JA.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrRating-CAwz23JA.mjs","sources":["../../../components/or-rating-v3/src/types.ts","../../../components/or-rating-v3/src/styles.ts","../../../components/or-rating-v3/src/OrRating.vue"],"sourcesContent":["import { ModelValue } from '@onereach/ui-components-common/types';\n\nexport type RatingModelValue = ModelValue<number>;\n\nexport enum RatingVariant {\n  Default = 'default',\n  Fitted = 'fitted',\n}\n","import { RatingVariant } from './types';\n\nexport const Rating: string[] = [\n  // Theme\n  'theme-foreground-disabled',\n  'dark:theme-foreground-disabled-dark',\n];\n\nexport const RatingVariants: Record<RatingVariant, string[]> = {\n  [RatingVariant.Default]: [\n    // Layout\n    'layout-row',\n  ],\n\n  [RatingVariant.Fitted]: [\n    // Layout\n    'layout-row md:justify-between',\n  ],\n};\n\nexport const RatingStar: string[] = [\n  // Layout\n  'layout-row justify-center',\n\n  // Interactivity\n  'interactivity-click',\n\n  // Box\n  'w-[32px] md:w-[24px]',\n  'h-[32px] md:h-[24px]',\n\n  // Theme (activated)\n  'activated:text-warning-hover',\n  'dark:activated:text-warning-hover-dark',\n\n  // Theme (disabled)\n  'disabled:text-disabled',\n  'dark:disabled:text-disabled-dark',\n];\n\nexport const RatingStarMobile: string[] = [\n  // Typography;\n  'text-[32px]',\n];\n\n","<template>\n  <div\n    :ref=\"'root'\"\n    :class=\"rootStyles\"\n    :disabled=\"disabled\"\n  >\n    <div\n      v-for=\"value of length\"\n      :ref=\"'stars'\"\n      :key=\"value\"\n      :class=\"starStyles\"\n      :activated=\"value <= Math.ceil(model)\"\n      :disabled=\"disabled\"\n      @mouseenter=\"onMouseEnter($event, value - 1)\"\n      @mousemove=\"onMouseMove($event, value - 1)\"\n      @mouseleave=\"onMouseLeave($event, value - 1)\"\n      @click=\"model = draft; hoverIndex[value - 1] = false\"\n    >\n      <OrIcon\n        :icon=\"draft - value + 1 === 0.5 ? 'star_half' : 'star'\"\n        :variant=\"value <= draft ? 'filled' : 'outlined'\"\n        :size=\"starSize(value - 1)\"\n      />\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { useProxyModelValue, useResponsive } from '@onereach/ui-components-common/hooks';\nimport { OrIconV3 as OrIcon } from '@onereach/ui-components.or-icon-v3';\nimport { PropType, computed, defineComponent, inject, reactive, ref, toRef, watch } from 'vue';\n\nimport * as Styles from './styles';\nimport { RatingModelValue, RatingVariant } from './types';\n\nexport const RATING_LENGTH = Symbol();\n\nexport default defineComponent({\n  name: 'OrRating',\n\n  components: {\n    OrIcon,\n  },\n\n  model: {\n    prop: 'modelValue',\n    event: 'update:modelValue',\n  },\n\n  props: {\n    modelValue: {\n      type: undefined as unknown as PropType<RatingModelValue>,\n      default: undefined,\n    },\n\n    variant: {\n      type: String as PropType<`${RatingVariant}`>,\n      default: () => RatingVariant.Default,\n    },\n\n    readonly: {\n      type: Boolean,\n      default: false,\n    },\n\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n  },\n\n  emits: [\n    'update:modelValue',\n  ],\n\n  expose: [\n    'root',\n  ],\n\n  setup(props, context) {\n    // Refs & Styles\n    const root = ref<HTMLElement>();\n\n    const { isMobile } = useResponsive();\n\n    const rootStyles = computed(() => [\n      'or-rating-v3',\n      ...Styles.Rating,\n      ...Styles.RatingVariants[props.variant],\n    ]);\n\n    const starStyles = computed(() => [\n      ...Styles.RatingStar,\n      ...props.readonly ? ['interactivity-none'] : [],\n      ...isMobile.value ? Styles.RatingStarMobile : [],\n    ]);\n\n    // Options\n    const length = inject(RATING_LENGTH, 5);\n\n    // State\n    const model = useProxyModelValue(toRef(props, 'modelValue'), context.emit, { defaultValue: ref(0) });\n    const draft = ref(model.value);\n\n    watch(model, (value) => {\n      draft.value = Math.floor(value * 2) / 2;\n    }, { immediate: true });\n\n    const hoverIndex = reactive(Array<boolean>(length).fill(false));\n\n    const starSize = computed(() => {\n      return (index: number) => {\n        if (props.variant === 'fitted' || isMobile.value) {\n          return 'inherit';\n        }\n        if (hoverIndex[index]) {\n          return 'xl';\n        }\n        return 'l';\n      };\n    });\n\n    // Handlers\n    function onMouseEnter(event: MouseEvent, index: number): void {\n      hoverIndex[index] = true;\n    }\n\n    function onMouseMove(event: MouseEvent, index: number): void {\n      const { width } = (event.currentTarget as Element).getBoundingClientRect();\n\n      draft.value = Math.ceil((index - (width - event.offsetX) / width + 1) * 2) / 2;\n    }\n\n    function onMouseLeave(event: MouseEvent, index: number): void {\n      hoverIndex[index] = false;\n\n      draft.value = model.value;\n    }\n\n    return {\n      length,\n\n      root,\n\n      rootStyles,\n      starStyles,\n\n      starSize,\n\n      model,\n      draft,\n\n      isMobile,\n\n      hoverIndex,\n\n      onMouseEnter,\n      onMouseMove,\n      onMouseLeave,\n    };\n  },\n});\n</script>\n"],"names":["RatingVariant","Rating","RatingVariants","RatingStar","RatingStarMobile","RATING_LENGTH","_sfc_main","defineComponent","OrIcon","props","context","root","ref","isMobile","useResponsive","rootStyles","computed","Styles.Rating","Styles.RatingVariants","starStyles","Styles.RatingStar","Styles.RatingStarMobile","length","inject","model","useProxyModelValue","toRef","draft","watch","value","hoverIndex","reactive","starSize","index","onMouseEnter","event","onMouseMove","width","onMouseLeave","_resolveComponent","_openBlock","_createElementBlock","_normalizeClass","_ctx","$event","_component_OrIcon"],"mappings":"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"}

package/dist/esm/{OrResizeablePanel-CvoX4aEB.mjs → OrResizeablePanel-BfuVn8Lq.mjs}

@@ -1,5 +1,5 @@
 import { usePopoverState as L } from "@onereach/ui-components-common/hooks";
-import { O } from "./OrIconButton-BajZRp1k.mjs";
+import { O } from "./OrIconButton-Ds8k8FmS.mjs";
 import { useDraggable as _ } from "@vueuse/core";
 import { defineComponent as $, ref as b, computed as l, toRef as N, watch as W, resolveComponent as D, openBlock as m, createElementBlock as d, normalizeClass as s, normalizeStyle as I, renderSlot as k, createElementVNode as j, createVNode as M, createCommentVNode as w } from "vue";
 import { _ as E } from "./_plugin-vue_export-helper-CHgC5LLL.mjs";
@@ -422,4 +422,4 @@ export {
   i as R,
   t as a
 };
-//# sourceMappingURL=OrResizeablePanel-CvoX4aEB.mjs.map
+//# sourceMappingURL=OrResizeablePanel-BfuVn8Lq.mjs.map

package/dist/esm/{OrResizeablePanel-CvoX4aEB.mjs.map → OrResizeablePanel-BfuVn8Lq.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"OrResizeablePanel-CvoX4aEB.mjs","sources":["../../../components/or-resizeable-panel-v3/src/props.ts","../../../components/or-resizeable-panel-v3/src/styles.ts","../../../components/or-resizeable-panel-v3/src/OrResizeablePanel.vue"],"sourcesContent":["export enum ResizeablePanelPadding {\n  L = 'l',\n  M = 'm',\n  S = 's',\n  None = 'none',\n}\n\nexport enum ResizeablePanelPlacement {\n  Top = 'top',\n  Bottom = 'bottom',\n  Left = 'left',\n  Right = 'right',\n}\n","import { ResizeablePanelPadding, ResizeablePanelPlacement } from './props';\n\nexport const ResizeablePanel: string[] = [\n  // Layout\n  'shrink-0',\n\n  // Theme\n  'theme-background-default',\n  'dark:theme-background-default-dark',\n];\n\nexport const ResizeablePanelPlacements: Record<ResizeablePanelPlacement, string[]> = {\n  [ResizeablePanelPlacement.Top]: [\n    // Layout\n    'layout-column',\n  ],\n\n  [ResizeablePanelPlacement.Bottom]: [\n    // Layout\n    'layout-column-reverse',\n  ],\n\n  [ResizeablePanelPlacement.Left]: [\n    // Layout\n    'layout-row !items-stretch',\n\n    // Box\n    'h-full min-h-0',\n  ],\n\n  [ResizeablePanelPlacement.Right]: [\n    // Layout\n    'layout-row-reverse !items-stretch',\n\n    // Box\n    'h-full min-h-0',\n  ],\n};\n\nexport const ResizeablePanelContent: string[] = [\n  // Layout\n  'layout-column grow',\n\n  // Overflow\n  'overflow-auto',\n];\n\nexport const ResizeablePanelContentPaddings: Record<ResizeablePanelPadding, string[]> = {\n  [ResizeablePanelPadding.L]: [\n    // Spacing\n    'px-lg',\n    'py-lg',\n  ],\n\n  [ResizeablePanelPadding.M]: [\n    // Spacing\n    'px-md',\n    'py-md',\n  ],\n\n  [ResizeablePanelPadding.S]: [\n    // Spacing\n    'px-sm',\n    'py-sm',\n  ],\n\n  [ResizeablePanelPadding.None]: [],\n};\n\nexport const ResizeablePanelContentPlaceholder: string[] = [];\n\nexport const ResizeablePanelContentPlaceholderPlacements: Record<ResizeablePanelPlacement, string[]> = {\n  [ResizeablePanelPlacement.Top]: [\n    // Box\n    'h-[calc(theme(spacing.md)+theme(spacing.sm))]',\n  ],\n\n  [ResizeablePanelPlacement.Bottom]: [\n    // Box\n    'h-[calc(theme(spacing.md)+theme(spacing.sm))]',\n  ],\n\n  [ResizeablePanelPlacement.Left]: [\n    // Box\n    'w-[calc(theme(spacing.md)+theme(spacing.sm))]',\n  ],\n\n  [ResizeablePanelPlacement.Right]: [\n    // Box\n    'w-[calc(theme(spacing.md)+theme(spacing.sm))]',\n  ],\n};\n\nexport const ResizeablePanelResizeBar: string[] = [\n  // Position\n  'relative',\n\n  // Layout\n  'shrink-0',\n\n  // Layout (after)\n  'after:block',\n\n  // Theme (after)\n  'after:border-outline-variant',\n  'after:dark:border-outline-variant-dark',\n\n  // Theme (after, hover)\n  'after:hover:border-primary-hover',\n  'after:dark:hover:border-primary-hover-dark',\n\n  // Theme (after, activated)\n  'after:activated:border-primary-hover',\n  'after:dark:activated:border-primary-hover-dark',\n];\n\nexport const ResizeablePanelResizeBarPlacements: Record<ResizeablePanelPlacement, string[]> = {\n  [ResizeablePanelPlacement.Top]: [\n    // Layout\n    'flex flex-col justify-center',\n\n    // Interactivity\n    'interactivity-resize-row',\n\n    // Spacing\n    '-my-[calc(theme(spacing.md)/2)]',\n    'py-[calc(theme(spacing.md)/2)]',\n\n    // Theme (after)\n    'after:border-b-1',\n  ],\n\n  [ResizeablePanelPlacement.Bottom]: [\n    // Layout\n    'flex flex-col justify-center',\n\n    // Interactivity\n    'interactivity-resize-row',\n\n    // Spacing\n    '-my-[calc(theme(spacing.md)/2)]',\n    'py-[calc(theme(spacing.md)/2)]',\n\n    // Theme (after)\n    'after:border-t-1',\n  ],\n\n  [ResizeablePanelPlacement.Left]: [\n    // Layout\n    'flex flex-row justify-center',\n\n    // Interactivity\n    'interactivity-resize-column',\n\n    // Spacing\n    '-mx-[calc(theme(spacing.md)/2)]',\n    'px-[calc(theme(spacing.md)/2)]',\n\n    // Theme (after)\n    'after:border-r-1',\n  ],\n\n  [ResizeablePanelPlacement.Right]: [\n    // Layout\n    'flex flex-row justify-center',\n\n    // Interactivity\n    'interactivity-resize-column',\n\n    // Spacing\n    '-mx-[calc(theme(spacing.md)/2)]',\n    'px-[calc(theme(spacing.md)/2)]',\n\n    // Theme (after)\n    'after:border-l-1',\n  ],\n};\n\nexport const ResizeablePanelCollapseButtonContainer: string[] = [\n  // Position\n  'absolute',\n\n  // Shape\n  'rounded-full',\n\n  // Box\n  'w-fit',\n  'h-fit',\n\n  // Typography\n  'leading-[0]',\n\n  // Theme\n  'theme-background-default',\n  'dark:theme-background-default-dark',\n\n  'theme-border-outline-variant border-1',\n  'dark:theme-border-outline-variant-dark',\n];\n\nexport const ResizeablePanelCollapseButtonContainerPlacements: Record<ResizeablePanelPlacement, string[]> = {\n  [ResizeablePanelPlacement.Top]: [\n    // Position\n    'left-md',\n  ],\n\n  [ResizeablePanelPlacement.Bottom]: [\n    // Position\n    'left-md',\n  ],\n\n  [ResizeablePanelPlacement.Left]: [\n    // Position\n    'top-md',\n  ],\n\n  [ResizeablePanelPlacement.Right]: [\n    // Position\n    'top-md',\n  ],\n};\n\nexport const ResizeablePanelToolbar: string[] = [\n  // Layout\n  'shrink-0',\n\n  // Overflow\n  'overflow-auto',\n\n  // Spacing\n  'px-md',\n  'py-md',\n\n  'gap-md',\n\n  // Theme\n  'theme-border-outline-variant border-1',\n  'dark:theme-border-outline-variant-dark',\n];\n\nexport const ResizeablePanelToolbarPlacements: Record<ResizeablePanelPlacement, string[]> = {\n  [ResizeablePanelPlacement.Top]: [\n    // Layout\n    'layout-row',\n\n    // Theme\n    '!border-t-0',\n    '!border-x-0',\n  ],\n\n  [ResizeablePanelPlacement.Bottom]: [\n    // Layout\n    'layout-row',\n\n    // Theme\n    '!border-b-0',\n    '!border-x-0',\n  ],\n\n  [ResizeablePanelPlacement.Left]: [\n    // Layout\n    'layout-column',\n\n    // Theme\n    '!border-l-0',\n    '!border-y-0',\n  ],\n\n  [ResizeablePanelPlacement.Right]: [\n    // Layout\n    'layout-column',\n\n    // Theme\n    '!border-r-0',\n    '!border-y-0',\n  ],\n};\n","<template>\n  <div\n    :ref=\"'root'\"\n    :class=\"rootStyles\"\n    :style=\"{ [currentDirection]: !collapsible || state === 'open' ? `${currentSize}px` : 'auto' }\"\n  >\n    <template v-if=\"!collapsible || state === 'open'\">\n      <div :class=\"contentStyles\">\n        <slot />\n      </div>\n    </template>\n\n    <template v-else>\n      <div :class=\"contentPlaceholderStyles\" />\n    </template>\n\n    <div\n      :ref=\"'resizeBar'\"\n      :class=\"resizeBarStyles\"\n      :activated=\"isDragging\"\n    >\n      <template v-if=\"collapsible\">\n        <div :class=\"collapseButtonContainerStyles\">\n          <OrIconButton\n            :additional-styles=\"['p-xs']\"\n            :icon=\"collapseButtonIcon\"\n            :color=\"'primary'\"\n            :size=\"'m'\"\n            @click=\"toggle()\"\n          />\n        </div>\n      </template>\n    </div>\n\n\n    <template v-if=\"$slots.toolbar\">\n      <div :class=\"toolbarStyles\">\n        <slot name=\"toolbar\" />\n      </div>\n    </template>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { usePopoverState } from '@onereach/ui-components-common/hooks';\nimport { OrIconButtonV3 as OrIconButton } from '@onereach/ui-components.or-icon-button-v3';\nimport { useDraggable } from '@vueuse/core';\nimport { PropType, computed, defineComponent, ref, toRef, watch } from 'vue';\n\nimport { ResizeablePanelPadding, ResizeablePanelPlacement } from './props';\nimport * as Styles from './styles';\n\nexport default defineComponent({\n  name: 'OrResizeablePanel',\n\n  components: {\n    OrIconButton,\n  },\n\n  props: {\n    isOpen: {\n      type: Boolean,\n      default: true,\n    },\n\n    width: {\n      type: Number,\n      default: 320,\n    },\n\n    minWidth: {\n      type: Number,\n      default: 256,\n    },\n\n    maxWidth: {\n      type: Number,\n      default: 384,\n    },\n\n    padding: {\n      type: String as PropType<`${ResizeablePanelPadding}`>,\n      default: () => ResizeablePanelPadding.M,\n    },\n\n    placement: {\n      type: String as PropType<`${ResizeablePanelPlacement}`>,\n      default: () => ResizeablePanelPlacement.Right,\n    },\n\n    resizeable: {\n      type: Boolean,\n      default: true,\n    },\n\n    collapsible: {\n      type: Boolean,\n      default: false,\n    },\n  },\n\n  emits: [\n    'update:state',\n\n    'open',\n    'close',\n\n    'resize',\n  ],\n\n  expose: [\n    'root',\n\n    'state',\n    'isDragging',\n\n    'open',\n    'close',\n    'toggle',\n  ],\n\n  setup(props, context) {\n    // Refs\n    const root = ref<HTMLElement>();\n    const resizeBar = ref<HTMLElement>();\n\n    // Styles\n    const rootStyles = computed(() => [\n      'or-resizeable-panel-v3',\n      ...Styles.ResizeablePanel,\n      ...Styles.ResizeablePanelPlacements[props.placement],\n    ]);\n\n    const contentStyles = computed(() => [\n      ...Styles.ResizeablePanelContent,\n      ...Styles.ResizeablePanelContentPaddings[props.padding],\n    ]);\n\n    const contentPlaceholderStyles = computed(() => [\n      ...Styles.ResizeablePanelContentPlaceholder,\n      ...Styles.ResizeablePanelContentPlaceholderPlacements[props.placement],\n    ]);\n\n    const resizeBarStyles = computed(() => [\n      ...Styles.ResizeablePanelResizeBar,\n      ...Styles.ResizeablePanelResizeBarPlacements[props.placement],\n      ...!props.resizeable || props.collapsible && state.value === 'closed' ? ['interactivity-none'] : [],\n    ]);\n\n    const collapseButtonContainerStyles = computed(() => [\n      ...Styles.ResizeablePanelCollapseButtonContainer,\n      ...Styles.ResizeablePanelCollapseButtonContainerPlacements[props.placement],\n    ]);\n\n    const toolbarStyles = computed(() => [\n      ...Styles.ResizeablePanelToolbar,\n      ...Styles.ResizeablePanelToolbarPlacements[props.placement],\n    ]);\n\n    // State\n    const { state, open, close, toggle } = usePopoverState(toRef(props, 'isOpen'), context.emit);\n\n    const collapseButtonIcon = computed(() => {\n      if (state.value === 'open') {\n        switch (props.placement) {\n          case ResizeablePanelPlacement.Top:\n            return 'keyboard_arrow_up';\n\n          case ResizeablePanelPlacement.Bottom:\n            return 'keyboard_arrow_down';\n\n          case ResizeablePanelPlacement.Left:\n            return 'keyboard_arrow_left';\n\n          case ResizeablePanelPlacement.Right:\n            return 'keyboard_arrow_right';\n        }\n      }\n\n      if (state.value === 'closed') {\n        switch (props.placement) {\n          case ResizeablePanelPlacement.Top:\n            return 'keyboard_arrow_down';\n\n          case ResizeablePanelPlacement.Bottom:\n            return 'keyboard_arrow_up';\n\n          case ResizeablePanelPlacement.Left:\n            return 'keyboard_arrow_right';\n\n          case ResizeablePanelPlacement.Right:\n            return 'keyboard_arrow_left';\n        }\n      }\n\n      return 'menu';\n    });\n\n    const currentDirection = computed(() => {\n      switch (props.placement) {\n        case ResizeablePanelPlacement.Top:\n        case ResizeablePanelPlacement.Bottom:\n          return 'height';\n      }\n\n      return 'width';\n    });\n\n    const currentSize = ref(props.width);\n\n    watch(() => props.width, (value) => {\n      currentSize.value = value;\n    });\n\n    // Effects\n    // #region Resize\n    let referencePoint = 0;\n\n    const { isDragging } = useDraggable(resizeBar, {\n      onStart: (_position, event) => {\n        if (props.resizeable) {\n          switch (props.placement) {\n            case ResizeablePanelPlacement.Top:\n            case ResizeablePanelPlacement.Bottom:\n              referencePoint = event.y;\n              break;\n\n            case ResizeablePanelPlacement.Left:\n            case ResizeablePanelPlacement.Right:\n              referencePoint = event.x;\n              break;\n          }\n\n          document.body.style.userSelect = 'none';\n        }\n      },\n\n      onMove: (position) => {\n        if (props.resizeable) {\n          let nextWidth = 0;\n\n          switch (props.placement) {\n            case ResizeablePanelPlacement.Top:\n              nextWidth = currentSize.value + (position.y - referencePoint);\n              referencePoint = position.y;\n              break;\n\n            case ResizeablePanelPlacement.Bottom:\n              nextWidth = currentSize.value + (referencePoint - position.y);\n              referencePoint = position.y;\n              break;\n\n            case ResizeablePanelPlacement.Left:\n              nextWidth = currentSize.value + (position.x - referencePoint);\n              referencePoint = position.x;\n              break;\n\n            case ResizeablePanelPlacement.Right:\n              nextWidth = currentSize.value + (referencePoint - position.x);\n              referencePoint = position.x;\n              break;\n          }\n\n          if (nextWidth < props.minWidth) {\n            nextWidth = props.minWidth;\n          }\n\n          if (nextWidth > props.maxWidth) {\n            nextWidth = props.maxWidth;\n          }\n\n          if (nextWidth !== currentSize.value) {\n            context.emit('resize', currentSize.value = nextWidth);\n          }\n        }\n      },\n\n      onEnd: () => {\n        if (props.resizeable) {\n          document.body.style.userSelect = '';\n        }\n      },\n    });\n    // #endregion\n\n    return {\n      root,\n      resizeBar,\n\n      rootStyles,\n      contentStyles,\n      contentPlaceholderStyles,\n      resizeBarStyles,\n      collapseButtonContainerStyles,\n      toolbarStyles,\n\n      state,\n      open,\n      close,\n      toggle,\n\n      collapseButtonIcon,\n      currentDirection,\n      currentSize,\n\n      isDragging,\n    };\n  },\n});\n</script>\n"],"names":["ResizeablePanelPadding","ResizeablePanelPlacement","ResizeablePanel","ResizeablePanelPlacements","ResizeablePanelContent","ResizeablePanelContentPaddings","ResizeablePanelContentPlaceholder","ResizeablePanelContentPlaceholderPlacements","ResizeablePanelResizeBar","ResizeablePanelResizeBarPlacements","ResizeablePanelCollapseButtonContainer","ResizeablePanelCollapseButtonContainerPlacements","ResizeablePanelToolbar","ResizeablePanelToolbarPlacements","_sfc_main","defineComponent","OrIconButton","props","context","root","ref","resizeBar","rootStyles","computed","Styles.ResizeablePanel","Styles.ResizeablePanelPlacements","contentStyles","Styles.ResizeablePanelContent","Styles.ResizeablePanelContentPaddings","contentPlaceholderStyles","Styles.ResizeablePanelContentPlaceholder","Styles.ResizeablePanelContentPlaceholderPlacements","resizeBarStyles","Styles.ResizeablePanelResizeBar","Styles.ResizeablePanelResizeBarPlacements","state","collapseButtonContainerStyles","Styles.ResizeablePanelCollapseButtonContainer","Styles.ResizeablePanelCollapseButtonContainerPlacements","toolbarStyles","Styles.ResizeablePanelToolbar","Styles.ResizeablePanelToolbarPlacements","open","close","toggle","usePopoverState","toRef","collapseButtonIcon","currentDirection","currentSize","watch","value","referencePoint","isDragging","useDraggable","_position","event","position","nextWidth","_resolveComponent","_openBlock","_createElementBlock","_normalizeClass","_ctx","_normalizeStyle","_createElementVNode","_component_OrIconButton","_createCommentVNode","_hoisted_1"],"mappings":"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"}
+{"version":3,"file":"OrResizeablePanel-BfuVn8Lq.mjs","sources":["../../../components/or-resizeable-panel-v3/src/props.ts","../../../components/or-resizeable-panel-v3/src/styles.ts","../../../components/or-resizeable-panel-v3/src/OrResizeablePanel.vue"],"sourcesContent":["export enum ResizeablePanelPadding {\n  L = 'l',\n  M = 'm',\n  S = 's',\n  None = 'none',\n}\n\nexport enum ResizeablePanelPlacement {\n  Top = 'top',\n  Bottom = 'bottom',\n  Left = 'left',\n  Right = 'right',\n}\n","import { ResizeablePanelPadding, ResizeablePanelPlacement } from './props';\n\nexport const ResizeablePanel: string[] = [\n  // Layout\n  'shrink-0',\n\n  // Theme\n  'theme-background-default',\n  'dark:theme-background-default-dark',\n];\n\nexport const ResizeablePanelPlacements: Record<ResizeablePanelPlacement, string[]> = {\n  [ResizeablePanelPlacement.Top]: [\n    // Layout\n    'layout-column',\n  ],\n\n  [ResizeablePanelPlacement.Bottom]: [\n    // Layout\n    'layout-column-reverse',\n  ],\n\n  [ResizeablePanelPlacement.Left]: [\n    // Layout\n    'layout-row !items-stretch',\n\n    // Box\n    'h-full min-h-0',\n  ],\n\n  [ResizeablePanelPlacement.Right]: [\n    // Layout\n    'layout-row-reverse !items-stretch',\n\n    // Box\n    'h-full min-h-0',\n  ],\n};\n\nexport const ResizeablePanelContent: string[] = [\n  // Layout\n  'layout-column grow',\n\n  // Overflow\n  'overflow-auto',\n];\n\nexport const ResizeablePanelContentPaddings: Record<ResizeablePanelPadding, string[]> = {\n  [ResizeablePanelPadding.L]: [\n    // Spacing\n    'px-lg',\n    'py-lg',\n  ],\n\n  [ResizeablePanelPadding.M]: [\n    // Spacing\n    'px-md',\n    'py-md',\n  ],\n\n  [ResizeablePanelPadding.S]: [\n    // Spacing\n    'px-sm',\n    'py-sm',\n  ],\n\n  [ResizeablePanelPadding.None]: [],\n};\n\nexport const ResizeablePanelContentPlaceholder: string[] = [];\n\nexport const ResizeablePanelContentPlaceholderPlacements: Record<ResizeablePanelPlacement, string[]> = {\n  [ResizeablePanelPlacement.Top]: [\n    // Box\n    'h-[calc(theme(spacing.md)+theme(spacing.sm))]',\n  ],\n\n  [ResizeablePanelPlacement.Bottom]: [\n    // Box\n    'h-[calc(theme(spacing.md)+theme(spacing.sm))]',\n  ],\n\n  [ResizeablePanelPlacement.Left]: [\n    // Box\n    'w-[calc(theme(spacing.md)+theme(spacing.sm))]',\n  ],\n\n  [ResizeablePanelPlacement.Right]: [\n    // Box\n    'w-[calc(theme(spacing.md)+theme(spacing.sm))]',\n  ],\n};\n\nexport const ResizeablePanelResizeBar: string[] = [\n  // Position\n  'relative',\n\n  // Layout\n  'shrink-0',\n\n  // Layout (after)\n  'after:block',\n\n  // Theme (after)\n  'after:border-outline-variant',\n  'after:dark:border-outline-variant-dark',\n\n  // Theme (after, hover)\n  'after:hover:border-primary-hover',\n  'after:dark:hover:border-primary-hover-dark',\n\n  // Theme (after, activated)\n  'after:activated:border-primary-hover',\n  'after:dark:activated:border-primary-hover-dark',\n];\n\nexport const ResizeablePanelResizeBarPlacements: Record<ResizeablePanelPlacement, string[]> = {\n  [ResizeablePanelPlacement.Top]: [\n    // Layout\n    'flex flex-col justify-center',\n\n    // Interactivity\n    'interactivity-resize-row',\n\n    // Spacing\n    '-my-[calc(theme(spacing.md)/2)]',\n    'py-[calc(theme(spacing.md)/2)]',\n\n    // Theme (after)\n    'after:border-b-1',\n  ],\n\n  [ResizeablePanelPlacement.Bottom]: [\n    // Layout\n    'flex flex-col justify-center',\n\n    // Interactivity\n    'interactivity-resize-row',\n\n    // Spacing\n    '-my-[calc(theme(spacing.md)/2)]',\n    'py-[calc(theme(spacing.md)/2)]',\n\n    // Theme (after)\n    'after:border-t-1',\n  ],\n\n  [ResizeablePanelPlacement.Left]: [\n    // Layout\n    'flex flex-row justify-center',\n\n    // Interactivity\n    'interactivity-resize-column',\n\n    // Spacing\n    '-mx-[calc(theme(spacing.md)/2)]',\n    'px-[calc(theme(spacing.md)/2)]',\n\n    // Theme (after)\n    'after:border-r-1',\n  ],\n\n  [ResizeablePanelPlacement.Right]: [\n    // Layout\n    'flex flex-row justify-center',\n\n    // Interactivity\n    'interactivity-resize-column',\n\n    // Spacing\n    '-mx-[calc(theme(spacing.md)/2)]',\n    'px-[calc(theme(spacing.md)/2)]',\n\n    // Theme (after)\n    'after:border-l-1',\n  ],\n};\n\nexport const ResizeablePanelCollapseButtonContainer: string[] = [\n  // Position\n  'absolute',\n\n  // Shape\n  'rounded-full',\n\n  // Box\n  'w-fit',\n  'h-fit',\n\n  // Typography\n  'leading-[0]',\n\n  // Theme\n  'theme-background-default',\n  'dark:theme-background-default-dark',\n\n  'theme-border-outline-variant border-1',\n  'dark:theme-border-outline-variant-dark',\n];\n\nexport const ResizeablePanelCollapseButtonContainerPlacements: Record<ResizeablePanelPlacement, string[]> = {\n  [ResizeablePanelPlacement.Top]: [\n    // Position\n    'left-md',\n  ],\n\n  [ResizeablePanelPlacement.Bottom]: [\n    // Position\n    'left-md',\n  ],\n\n  [ResizeablePanelPlacement.Left]: [\n    // Position\n    'top-md',\n  ],\n\n  [ResizeablePanelPlacement.Right]: [\n    // Position\n    'top-md',\n  ],\n};\n\nexport const ResizeablePanelToolbar: string[] = [\n  // Layout\n  'shrink-0',\n\n  // Overflow\n  'overflow-auto',\n\n  // Spacing\n  'px-md',\n  'py-md',\n\n  'gap-md',\n\n  // Theme\n  'theme-border-outline-variant border-1',\n  'dark:theme-border-outline-variant-dark',\n];\n\nexport const ResizeablePanelToolbarPlacements: Record<ResizeablePanelPlacement, string[]> = {\n  [ResizeablePanelPlacement.Top]: [\n    // Layout\n    'layout-row',\n\n    // Theme\n    '!border-t-0',\n    '!border-x-0',\n  ],\n\n  [ResizeablePanelPlacement.Bottom]: [\n    // Layout\n    'layout-row',\n\n    // Theme\n    '!border-b-0',\n    '!border-x-0',\n  ],\n\n  [ResizeablePanelPlacement.Left]: [\n    // Layout\n    'layout-column',\n\n    // Theme\n    '!border-l-0',\n    '!border-y-0',\n  ],\n\n  [ResizeablePanelPlacement.Right]: [\n    // Layout\n    'layout-column',\n\n    // Theme\n    '!border-r-0',\n    '!border-y-0',\n  ],\n};\n","<template>\n  <div\n    :ref=\"'root'\"\n    :class=\"rootStyles\"\n    :style=\"{ [currentDirection]: !collapsible || state === 'open' ? `${currentSize}px` : 'auto' }\"\n  >\n    <template v-if=\"!collapsible || state === 'open'\">\n      <div :class=\"contentStyles\">\n        <slot />\n      </div>\n    </template>\n\n    <template v-else>\n      <div :class=\"contentPlaceholderStyles\" />\n    </template>\n\n    <div\n      :ref=\"'resizeBar'\"\n      :class=\"resizeBarStyles\"\n      :activated=\"isDragging\"\n    >\n      <template v-if=\"collapsible\">\n        <div :class=\"collapseButtonContainerStyles\">\n          <OrIconButton\n            :additional-styles=\"['p-xs']\"\n            :icon=\"collapseButtonIcon\"\n            :color=\"'primary'\"\n            :size=\"'m'\"\n            @click=\"toggle()\"\n          />\n        </div>\n      </template>\n    </div>\n\n\n    <template v-if=\"$slots.toolbar\">\n      <div :class=\"toolbarStyles\">\n        <slot name=\"toolbar\" />\n      </div>\n    </template>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { usePopoverState } from '@onereach/ui-components-common/hooks';\nimport { OrIconButtonV3 as OrIconButton } from '@onereach/ui-components.or-icon-button-v3';\nimport { useDraggable } from '@vueuse/core';\nimport { PropType, computed, defineComponent, ref, toRef, watch } from 'vue';\n\nimport { ResizeablePanelPadding, ResizeablePanelPlacement } from './props';\nimport * as Styles from './styles';\n\nexport default defineComponent({\n  name: 'OrResizeablePanel',\n\n  components: {\n    OrIconButton,\n  },\n\n  props: {\n    isOpen: {\n      type: Boolean,\n      default: true,\n    },\n\n    width: {\n      type: Number,\n      default: 320,\n    },\n\n    minWidth: {\n      type: Number,\n      default: 256,\n    },\n\n    maxWidth: {\n      type: Number,\n      default: 384,\n    },\n\n    padding: {\n      type: String as PropType<`${ResizeablePanelPadding}`>,\n      default: () => ResizeablePanelPadding.M,\n    },\n\n    placement: {\n      type: String as PropType<`${ResizeablePanelPlacement}`>,\n      default: () => ResizeablePanelPlacement.Right,\n    },\n\n    resizeable: {\n      type: Boolean,\n      default: true,\n    },\n\n    collapsible: {\n      type: Boolean,\n      default: false,\n    },\n  },\n\n  emits: [\n    'update:state',\n\n    'open',\n    'close',\n\n    'resize',\n  ],\n\n  expose: [\n    'root',\n\n    'state',\n    'isDragging',\n\n    'open',\n    'close',\n    'toggle',\n  ],\n\n  setup(props, context) {\n    // Refs\n    const root = ref<HTMLElement>();\n    const resizeBar = ref<HTMLElement>();\n\n    // Styles\n    const rootStyles = computed(() => [\n      'or-resizeable-panel-v3',\n      ...Styles.ResizeablePanel,\n      ...Styles.ResizeablePanelPlacements[props.placement],\n    ]);\n\n    const contentStyles = computed(() => [\n      ...Styles.ResizeablePanelContent,\n      ...Styles.ResizeablePanelContentPaddings[props.padding],\n    ]);\n\n    const contentPlaceholderStyles = computed(() => [\n      ...Styles.ResizeablePanelContentPlaceholder,\n      ...Styles.ResizeablePanelContentPlaceholderPlacements[props.placement],\n    ]);\n\n    const resizeBarStyles = computed(() => [\n      ...Styles.ResizeablePanelResizeBar,\n      ...Styles.ResizeablePanelResizeBarPlacements[props.placement],\n      ...!props.resizeable || props.collapsible && state.value === 'closed' ? ['interactivity-none'] : [],\n    ]);\n\n    const collapseButtonContainerStyles = computed(() => [\n      ...Styles.ResizeablePanelCollapseButtonContainer,\n      ...Styles.ResizeablePanelCollapseButtonContainerPlacements[props.placement],\n    ]);\n\n    const toolbarStyles = computed(() => [\n      ...Styles.ResizeablePanelToolbar,\n      ...Styles.ResizeablePanelToolbarPlacements[props.placement],\n    ]);\n\n    // State\n    const { state, open, close, toggle } = usePopoverState(toRef(props, 'isOpen'), context.emit);\n\n    const collapseButtonIcon = computed(() => {\n      if (state.value === 'open') {\n        switch (props.placement) {\n          case ResizeablePanelPlacement.Top:\n            return 'keyboard_arrow_up';\n\n          case ResizeablePanelPlacement.Bottom:\n            return 'keyboard_arrow_down';\n\n          case ResizeablePanelPlacement.Left:\n            return 'keyboard_arrow_left';\n\n          case ResizeablePanelPlacement.Right:\n            return 'keyboard_arrow_right';\n        }\n      }\n\n      if (state.value === 'closed') {\n        switch (props.placement) {\n          case ResizeablePanelPlacement.Top:\n            return 'keyboard_arrow_down';\n\n          case ResizeablePanelPlacement.Bottom:\n            return 'keyboard_arrow_up';\n\n          case ResizeablePanelPlacement.Left:\n            return 'keyboard_arrow_right';\n\n          case ResizeablePanelPlacement.Right:\n            return 'keyboard_arrow_left';\n        }\n      }\n\n      return 'menu';\n    });\n\n    const currentDirection = computed(() => {\n      switch (props.placement) {\n        case ResizeablePanelPlacement.Top:\n        case ResizeablePanelPlacement.Bottom:\n          return 'height';\n      }\n\n      return 'width';\n    });\n\n    const currentSize = ref(props.width);\n\n    watch(() => props.width, (value) => {\n      currentSize.value = value;\n    });\n\n    // Effects\n    // #region Resize\n    let referencePoint = 0;\n\n    const { isDragging } = useDraggable(resizeBar, {\n      onStart: (_position, event) => {\n        if (props.resizeable) {\n          switch (props.placement) {\n            case ResizeablePanelPlacement.Top:\n            case ResizeablePanelPlacement.Bottom:\n              referencePoint = event.y;\n              break;\n\n            case ResizeablePanelPlacement.Left:\n            case ResizeablePanelPlacement.Right:\n              referencePoint = event.x;\n              break;\n          }\n\n          document.body.style.userSelect = 'none';\n        }\n      },\n\n      onMove: (position) => {\n        if (props.resizeable) {\n          let nextWidth = 0;\n\n          switch (props.placement) {\n            case ResizeablePanelPlacement.Top:\n              nextWidth = currentSize.value + (position.y - referencePoint);\n              referencePoint = position.y;\n              break;\n\n            case ResizeablePanelPlacement.Bottom:\n              nextWidth = currentSize.value + (referencePoint - position.y);\n              referencePoint = position.y;\n              break;\n\n            case ResizeablePanelPlacement.Left:\n              nextWidth = currentSize.value + (position.x - referencePoint);\n              referencePoint = position.x;\n              break;\n\n            case ResizeablePanelPlacement.Right:\n              nextWidth = currentSize.value + (referencePoint - position.x);\n              referencePoint = position.x;\n              break;\n          }\n\n          if (nextWidth < props.minWidth) {\n            nextWidth = props.minWidth;\n          }\n\n          if (nextWidth > props.maxWidth) {\n            nextWidth = props.maxWidth;\n          }\n\n          if (nextWidth !== currentSize.value) {\n            context.emit('resize', currentSize.value = nextWidth);\n          }\n        }\n      },\n\n      onEnd: () => {\n        if (props.resizeable) {\n          document.body.style.userSelect = '';\n        }\n      },\n    });\n    // #endregion\n\n    return {\n      root,\n      resizeBar,\n\n      rootStyles,\n      contentStyles,\n      contentPlaceholderStyles,\n      resizeBarStyles,\n      collapseButtonContainerStyles,\n      toolbarStyles,\n\n      state,\n      open,\n      close,\n      toggle,\n\n      collapseButtonIcon,\n      currentDirection,\n      currentSize,\n\n      isDragging,\n    };\n  },\n});\n</script>\n"],"names":["ResizeablePanelPadding","ResizeablePanelPlacement","ResizeablePanel","ResizeablePanelPlacements","ResizeablePanelContent","ResizeablePanelContentPaddings","ResizeablePanelContentPlaceholder","ResizeablePanelContentPlaceholderPlacements","ResizeablePanelResizeBar","ResizeablePanelResizeBarPlacements","ResizeablePanelCollapseButtonContainer","ResizeablePanelCollapseButtonContainerPlacements","ResizeablePanelToolbar","ResizeablePanelToolbarPlacements","_sfc_main","defineComponent","OrIconButton","props","context","root","ref","resizeBar","rootStyles","computed","Styles.ResizeablePanel","Styles.ResizeablePanelPlacements","contentStyles","Styles.ResizeablePanelContent","Styles.ResizeablePanelContentPaddings","contentPlaceholderStyles","Styles.ResizeablePanelContentPlaceholder","Styles.ResizeablePanelContentPlaceholderPlacements","resizeBarStyles","Styles.ResizeablePanelResizeBar","Styles.ResizeablePanelResizeBarPlacements","state","collapseButtonContainerStyles","Styles.ResizeablePanelCollapseButtonContainer","Styles.ResizeablePanelCollapseButtonContainerPlacements","toolbarStyles","Styles.ResizeablePanelToolbar","Styles.ResizeablePanelToolbarPlacements","open","close","toggle","usePopoverState","toRef","collapseButtonIcon","currentDirection","currentSize","watch","value","referencePoint","isDragging","useDraggable","_position","event","position","nextWidth","_resolveComponent","_openBlock","_createElementBlock","_normalizeClass","_ctx","_normalizeStyle","_createElementVNode","_component_OrIconButton","_createCommentVNode","_hoisted_1"],"mappings":"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"}

package/dist/esm/{OrRichTextEditor-BYEdE945.mjs → OrRichTextEditor-D0UmlBKz.mjs}

@@ -1,17 +1,17 @@
 (function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode("[data-v-1222a307] .or-cm-paragraph{@apply my-xs;}[data-v-1222a307] .or-cm-bulletList{@apply mx-lg my-xs list-disc;}[data-v-1222a307] .or-cm-orderedList{@apply mx-lg my-xs list-decimal;}[data-v-1222a307] .or-cm-blockquote{@apply my-sm mx-lg px-lg border-l-2 border-outline;}[data-v-1222a307] .or-cm-link{@apply text-primary cursor-pointer;}[data-v-1222a307] .or-cm-placeholder{@apply text-outline;}[data-v-1222a307] .or-cm-editorProps{@apply flex flex-col focus:outline-none gap-xs h-full;}.tiptap-editor-v3 .is-editor-empty:before{float:left;height:0;pointer-events:none;content:attr(data-placeholder)}")),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}})();
 import { useTheme as ft, useResponsive as pt } from "@onereach/ui-components-common/hooks";
 import { isArray as gt } from "@onereach/ui-components-common/utils";
-import { O as ht } from "./OrButton-C_hXddAf.mjs";
+import { O as ht } from "./OrButton-_RCmYvxT.mjs";
 import { O as vt } from "./OrError-B5ihH6-3.mjs";
 import { O as bt } from "./OrHint-NvbZyURY.mjs";
-import { O as kt } from "./OrIconButton-BajZRp1k.mjs";
+import { O as kt } from "./OrIconButton-Ds8k8FmS.mjs";
 import { O as yt } from "./OrInputBox-6ciokFdU.mjs";
-import { O as Ct } from "./OrInput-BrJzxNyE.mjs";
+import { O as Ct } from "./OrInput-nExtCSw8.mjs";
 import { O as wt } from "./OrLabel-K7_HgvcK.mjs";
-import { O as Ot } from "./OrMenuItem-ByVkiQvE.mjs";
-import { O as St } from "./OrMenu-BNbd6Ajl.mjs";
-import { O as Lt } from "./OrModal-Cbi6xMwA.mjs";
-import { O as Bt } from "./OrPopover-FA8G-paf.mjs";
+import { O as Ot } from "./OrMenuItem-VyCCXA7Z.mjs";
+import { O as St } from "./OrMenu-Cag_fBXC.mjs";
+import { O as Lt } from "./OrModal-DiVA7_Ct.mjs";
+import { O as Bt } from "./OrPopover-GBPJ4IDN.mjs";
 import { Node as Mt, Editor as At, mergeAttributes as Pt } from "@tiptap/core";
 import qe from "@tiptap/extension-blockquote";
 import ze from "@tiptap/extension-bullet-list";
@@ -26,21 +26,21 @@ import Nt from "@tiptap/starter-kit";
 import { useResizeObserver as Vt, useDebounceFn as $t, onClickOutside as It } from "@vueuse/core";
 import { useFocusTrap as Et } from "@vueuse/integrations/useFocusTrap";
 import { defineComponent as Ft, shallowRef as qt, ref as m, onMounted as zt, onBeforeUnmount as Tt, computed as w, watch as Dt, nextTick as Ut, resolveComponent as O, openBlock as f, createElementBlock as q, normalizeClass as V, createBlock as N, withCtx as b, renderSlot as re, createTextVNode as $, toDisplayString as ae, createCommentVNode as T, createVNode as I, createElementVNode as z, Fragment as ne, renderList as le, withDirectives as se, vShow as ie, vModelText as Wt } from "vue";
-import { TextSelection as Gt, Selection as Jt } from "prosemirror-state";
-import { exitCode as jt } from "prosemirror-commands";
+import { javascript as Gt } from "@codemirror/lang-javascript";
+import { minimalSetup as Jt } from "codemirror";
 import { EditorState as we } from "@codemirror/state";
-import { EditorView as Je, highlightActiveLine as Kt, highlightActiveLineGutter as Qt, lineNumbers as Xt, keymap as Yt } from "@codemirror/view";
-import { HighlightStyle as Zt, syntaxHighlighting as xt } from "@codemirror/language";
+import { EditorView as Je, highlightActiveLine as jt, highlightActiveLineGutter as Kt, lineNumbers as Qt, keymap as Xt } from "@codemirror/view";
+import { exitCode as Yt } from "prosemirror-commands";
+import { TextSelection as Zt, Selection as xt } from "prosemirror-state";
+import { HighlightStyle as _t, syntaxHighlighting as eo } from "@codemirror/language";
 import { tags as n } from "@lezer/highlight";
-import { minimalSetup as _t } from "codemirror";
-import { javascript as eo } from "@codemirror/lang-javascript";
 import to from "@tiptap/extension-bold";
 import oo from "@tiptap/extension-code-block";
 import ro from "@tiptap/extension-hard-break";
-import ao from "@tiptap/extension-italic";
-import no from "@tiptap/extension-list-item";
-import lo from "@tiptap/extension-strike";
-import so from "@tiptap/extension-horizontal-rule";
+import ao from "@tiptap/extension-horizontal-rule";
+import no from "@tiptap/extension-italic";
+import lo from "@tiptap/extension-list-item";
+import so from "@tiptap/extension-strike";
 import { marked as io } from "marked";
 import { defaultMarkdownSerializer as S, MarkdownSerializer as uo } from "prosemirror-markdown";
 import { DOMParser as co } from "prosemirror-model";
@@ -183,7 +183,7 @@ const Oo = Je.theme({
     // border: `1px solid ${themes?.colors?.neutral?.[200]}`,
     borderRadius: (Fe = a == null ? void 0 : a.spacing) == null ? void 0 : Fe.xs
   }
-}, { dark: !0 }), So = Zt.define([
+}, { dark: !0 }), So = _t.define([
   {
     tag: n.keyword,
     color: wo
@@ -250,7 +250,7 @@ const Oo = Je.theme({
     tag: n.invalid,
     color: ko
   }
-]), Lo = [Oo, xt(So)], Le = (e, o) => {
+]), Lo = [Oo, eo(So)], Le = (e, o) => {
   if (e === o)
     return null;
   let t = 0, s = e.length, l = o.length;
@@ -279,10 +279,10 @@ class Bo {
       extensions: [
         Lo,
         s,
+        jt(),
         Kt(),
         Qt(),
-        Xt(),
-        Yt.of([
+        Xt.of([
           {
             key: "ArrowUp",
             run: this.mayBeEscape("line", -1)
@@ -301,7 +301,7 @@ class Bo {
           },
           {
             key: "Ctrl-Enter",
-            run: () => jt(this.view.state, this.view.dispatch) ? (this.view.focus(), !0) : !1
+            run: () => Yt(this.view.state, this.view.dispatch) ? (this.view.focus(), !0) : !1
           }
         ]),
         t
@@ -317,7 +317,7 @@ class Bo {
   }
   asProseMirrorSelection(o) {
     const t = this.getPos() + 1, { anchor: s, head: l } = this.cm.state.selection.main;
-    return Gt.create(o, s + t, l + t);
+    return Zt.create(o, s + t, l + t);
   }
   dispatch(o) {
     if (this.cm.setState(o.state), o.docChanged && !this.updating) {
@@ -339,7 +339,7 @@ class Bo {
       })(), D = l.selection.ranges.some((y) => !y.empty), U = 1, W = l.doc.lineAt(l.doc.length).number;
       if (D || k.line !== (t < 0 ? U : W) || o === "char" && k.ch !== (t < 0 ? 0 : l.doc.line(k.line).length))
         return !1;
-      const G = this.getPos() + (t < 0 ? 0 : this.node.nodeSize), B = Jt.near(this.view.state.doc.resolve(G), t);
+      const G = this.getPos() + (t < 0 ? 0 : this.node.nodeSize), B = xt.near(this.view.state.doc.resolve(G), t);
       return this.view.dispatch(this.view.state.tr.setSelection(B).scrollIntoView()), this.view.focus(), !0;
     };
   }
@@ -402,7 +402,7 @@ const Mo = Mt.create({
       view: o.view,
       getPos: t,
       cmOptions: {
-        extensions: [_t, eo()]
+        extensions: [Jt, Gt()]
       }
     });
   }
@@ -410,22 +410,22 @@ const Mo = Mt.create({
   ...S.nodes,
   [We.name]: S.nodes.paragraph,
   [ze.name]: S.nodes.bullet_list,
-  [no.name]: S.nodes.list_item,
+  [lo.name]: S.nodes.list_item,
   [Ue.name]: S.nodes.ordered_list,
   [ro.name]: S.nodes.hard_break,
   [oo.name]: S.nodes.code_block,
   [qe.name]: S.nodes.blockquote,
-  [so.name]: S.nodes.horizontal_rule
+  [ao.name]: S.nodes.horizontal_rule
 }, Po = {
   ...S.marks,
   [to.name]: S.marks.strong,
-  [lo.name]: {
+  [so.name]: {
     open: "~~",
     close: "~~",
     mixable: !0,
     expelEnclosingWhitespace: !0
   },
-  [ao.name]: {
+  [no.name]: {
     open: " _",
     close: "_ ",
     mixable: !0,
@@ -1054,4 +1054,4 @@ export {
   Ke as R,
   Qe as a
 };
-//# sourceMappingURL=OrRichTextEditor-BYEdE945.mjs.map
+//# sourceMappingURL=OrRichTextEditor-D0UmlBKz.mjs.map