@onereach/ui-components 10.4.5-beta.4380.0 → 10.4.5-beta.4385.0

package/dist/bundled/v2/components/OrPaginationV3/OrPagination.vue.d.ts

@@ -1,5 +1,5 @@
 import { PropType } from 'vue-demi';
-import { PaginationModelValue } from './types';
+import { PaginationModel } from './types';
 declare const _default: import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<{
     root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
     limitButton: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
@@ -18,7 +18,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     offsetControlStyles: import("@vue/composition-api").ComputedRef<string[]>;
     limitControlStyles: import("@vue/composition-api").ComputedRef<string[]>;
     itemStyles: import("@vue/composition-api").ComputedRef<string[]>;
-    proxyModelValue: import("../../hooks").UseProxyModelValueReturn<PaginationModelValue>;
+    proxyModelValue: import("../../hooks").UseProxyModelValueReturn<PaginationModel>;
     currentLimit: import("@vue/composition-api").WritableComputedRef<number>;
     currentOffset: import("@vue/composition-api").WritableComputedRef<number>;
     currentPage: import("@vue/composition-api").WritableComputedRef<number>;
@@ -32,34 +32,34 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     isMobile: import("@vue/composition-api").ComputedRef<boolean>;
 }> & import("@vue/composition-api").Data, {}, {}, {
     modelValue: {
-        type: PropType<PaginationModelValue>;
+        type: PropType<PaginationModel>;
         default: undefined;
     };
     length: {
         type: NumberConstructor;
         required: true;
     };
-    options: {
+    pageSizeOptions: {
         type: PropType<number[]>;
         default: () => number[];
     };
 }, import("@vue/composition-api").ExtractPropTypes<{
     modelValue: {
-        type: PropType<PaginationModelValue>;
+        type: PropType<PaginationModel>;
         default: undefined;
     };
     length: {
         type: NumberConstructor;
         required: true;
     };
-    options: {
+    pageSizeOptions: {
         type: PropType<number[]>;
         default: () => number[];
     };
 }>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
     length: number;
-    modelValue: PaginationModelValue;
-    options: number[];
+    modelValue: PaginationModel;
+    pageSizeOptions: number[];
 } & {} & {
     [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
 }, import("@vue/composition-api").ShallowUnwrapRef<{
@@ -80,7 +80,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     offsetControlStyles: import("@vue/composition-api").ComputedRef<string[]>;
     limitControlStyles: import("@vue/composition-api").ComputedRef<string[]>;
     itemStyles: import("@vue/composition-api").ComputedRef<string[]>;
-    proxyModelValue: import("../../hooks").UseProxyModelValueReturn<PaginationModelValue>;
+    proxyModelValue: import("../../hooks").UseProxyModelValueReturn<PaginationModel>;
     currentLimit: import("@vue/composition-api").WritableComputedRef<number>;
     currentOffset: import("@vue/composition-api").WritableComputedRef<number>;
     currentPage: import("@vue/composition-api").WritableComputedRef<number>;
@@ -94,12 +94,12 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     isMobile: import("@vue/composition-api").ComputedRef<boolean>;
 }>, import("@vue/composition-api").Data, {}, {}, {}, {}, string[], {
     length: number;
-    modelValue: PaginationModelValue;
-    options: number[];
+    modelValue: PaginationModel;
+    pageSizeOptions: number[];
 } & {} & {
     [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
 }, {
-    modelValue: PaginationModelValue;
-    options: number[];
+    modelValue: PaginationModel;
+    pageSizeOptions: number[];
 }, true>);
 export default _default;

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

@@ -1,5 +1,4 @@
-import { ModelValue } from '../../types';
-export type PaginationModelValue = ModelValue<{
+export interface PaginationModel {
     limit: number;
     offset: number;
-}>;
+}

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

@@ -13,9 +13,9 @@ const RadioControl = [
 // Box
 'w-md+ md:w-md', 'h-md+ md:h-md',
 // Theme
-'theme-preset-3-primary', 'dark:theme-preset-3-primary-dark', 'theme-background-default', 'dark:theme-background-default-dark', 'theme-border-outline border-1', 'dark:theme-border-outline-dark',
+'theme-preset-3-primary', 'dark:theme-preset-3-primary-dark', 'theme-background-default', 'dark:theme-background-default-dark', 'theme-border-1-outline', 'dark:theme-border-1-outline-dark',
 // Theme (focus)
-'focus-visible:theme-outline-primary focus-visible:outline-2', 'dark:focus-visible:theme-outline-primary-dark',
+'focus-visible:theme-outline-2-primary', 'dark:focus-visible:theme-outline-2-primary-dark',
 // Theme (checked)
 'checked:theme-preset-1-primary', 'dark:checked:theme-preset-1-primary-dark'];
 const RadioControlHandle = [
@@ -23,9 +23,9 @@ const RadioControlHandle = [
 'after:w-sm after:md:w-xs', 'after:h-sm after:md:h-xs',
 // Shape (children)
 'after:rounded-full',
-// Theme (checked / children)
+// Theme (children/checked)
 'after:checked:bg-on-primary', 'dark:after:checked:bg-on-primary-dark',
-// Theme (checked + disabled / children)
+// Theme (children/checked/disabled)
 'after:disabled:checked:bg-on-disabled', 'dark:after:disabled:checked:bg-on-disabled-dark'];
 
 export { Radio, RadioControl, RadioControlHandle };

package/dist/bundled/v2/components/OrRangeSliderV3/OrRangeSlider.js

@@ -2,7 +2,7 @@ import { f as useElementBounding, u as useElementHover, g as useDraggable } from
 import { defineComponent, ref, computed, toRef, watch } from 'vue-demi';
 import { RangeSlider, RangeSliderOrientations, RangeSliderRail, RangeSliderRailOrientations, RangeSliderOffset, RangeSliderOffsetOrientations, RangeSliderTrack, RangeSliderTrackColors, RangeSliderThumb, RangeSliderThumbColors, RangeSliderBreakpointMark, RangeSliderBreakpointMarkColors, RangeSliderLabel, RangeSliderLabelOrientations, RangeSliderLabelMark, RangeSliderLabelMarkOrientations } from './styles.js';
 import __vue_component__$1 from '../OrTooltipV3/OrTooltip.js';
-import { S as SliderColor, a as SliderOrientation } from '../../types-977c9542.js';
+import { SliderColor, SliderOrientation } from '../OrSliderV3/props.js';
 import { useProxyModelValue } from '../../hooks/useProxyModelValue.js';
 import { c as clamp } from '../../index-279e78b9.js';
 import { n as normalizeComponent } from '../../normalize-component-6e8e3d80.js';
@@ -18,7 +18,7 @@ var script = defineComponent({
   },
   props: {
     modelValue: {
-      type: undefined,
+      type: Object,
       default: undefined
     },
     minValue: {
@@ -35,7 +35,7 @@ var script = defineComponent({
     },
     breakpoints: {
       type: Array,
-      default: () => []
+      default: []
     },
     color: {
       type: String,
@@ -57,14 +57,19 @@ var script = defineComponent({
   emits: ['update:modelValue'],
   expose: ['root'],
   setup(props, context) {
-    // Refs & Styles
+    // Refs
     const root = ref();
-    const rootStyles = computed(() => ['or-range-slider-v3', ...RangeSlider, ...RangeSliderOrientations[props.orientation]]);
     const rail = ref();
-    const railStyles = computed(() => ['or-range-slider-rail-v3', ...RangeSliderRail, ...RangeSliderRailOrientations[props.orientation]]);
     const offset = ref();
+    const track = ref();
+    const filler = ref();
+    const thumbFrom = ref();
+    const thumbTo = ref();
+    // Styles
+    const rootStyles = computed(() => ['or-range-slider-v3', ...RangeSlider, ...RangeSliderOrientations[props.orientation]]);
+    const railStyles = computed(() => ['or-range-slider-rail-v3', ...RangeSliderRail, ...RangeSliderRailOrientations[props.orientation]]);
     const offsetStyles = computed(() => [...RangeSliderOffset, ...RangeSliderOffsetOrientations[props.orientation]]);
-    const offsetInlineStyles = computed(() => {
+    const offsetComputedStyles = computed(() => {
       switch (props.orientation) {
         case SliderOrientation.Horizontal:
         case SliderOrientation.HorizontalReversed:
@@ -78,9 +83,8 @@ var script = defineComponent({
           };
       }
     });
-    const track = ref();
     const trackStyles = computed(() => [...RangeSliderTrack, ...RangeSliderTrackColors[props.color]]);
-    const trackInlineStyles = computed(() => {
+    const trackComputedStyles = computed(() => {
       switch (props.orientation) {
         case SliderOrientation.Horizontal:
         case SliderOrientation.HorizontalReversed:
@@ -94,9 +98,6 @@ var script = defineComponent({
           };
       }
     });
-    const filler = ref();
-    const thumbFrom = ref();
-    const thumbTo = ref();
     const thumbStyles = computed(() => ['or-range-slider-thumb-v3', ...RangeSliderThumb, ...RangeSliderThumbColors[props.color]]);
     const breakpointMarkStyles = computed(() => [...RangeSliderBreakpointMark, ...RangeSliderBreakpointMarkColors[props.color]]);
     const labelStyles = computed(() => [...RangeSliderLabel, ...RangeSliderLabelOrientations[props.orientation]]);
@@ -171,7 +172,9 @@ var script = defineComponent({
       }
     });
     const internalModelValueFrom = computed({
-      get: () => (proxyModelValueFrom.value - props.minValue) / (props.maxValue - props.minValue),
+      get: () => {
+        return (proxyModelValueFrom.value - props.minValue) / (props.maxValue - props.minValue);
+      },
       set: value => {
         const modelValue = value * (props.maxValue - props.minValue) + props.minValue;
         const draftProxyModelValue = [internalBreakpoints.value.reduce((a, b) => {
@@ -190,7 +193,9 @@ var script = defineComponent({
       }
     });
     const internalModelValueTo = computed({
-      get: () => (proxyModelValueTo.value - props.minValue) / (props.maxValue - props.minValue),
+      get: () => {
+        return (proxyModelValueTo.value - props.minValue) / (props.maxValue - props.minValue);
+      },
       set: value => {
         const modelValue = value * (props.maxValue - props.minValue) + props.minValue;
         const draftProxyModelValue = [internalModelValueFrom.value * (props.maxValue - props.minValue) + props.minValue, internalBreakpoints.value.reduce((a, b) => {
@@ -212,7 +217,7 @@ var script = defineComponent({
       if (!props.step) {
         return [props.minValue, ...props.breakpoints, props.maxValue];
       }
-      return Array(Math.ceil(Math.abs(props.maxValue - props.minValue) / props.step)).fill(undefined).map((value, index) => Math.floor((props.minValue + props.step * index) * 1000) / 1000).concat(...props.breakpoints, props.maxValue).sort((a, b) => a - b);
+      return Array(Math.ceil(Math.abs(props.maxValue - props.minValue) / props.step)).fill(null).map((value, index) => Math.floor((props.minValue + props.step * index) * 1000) / 1000).concat(...props.breakpoints, props.maxValue).sort((a, b) => a - b);
     });
     const tooltipPlacement = computed(() => {
       switch (props.orientation) {
@@ -345,18 +350,18 @@ var script = defineComponent({
     });
     return {
       root,
-      rootStyles,
       rail,
-      railStyles,
       offset,
-      offsetStyles,
-      offsetInlineStyles,
       track,
-      trackStyles,
-      trackInlineStyles,
       filler,
       thumbFrom,
       thumbTo,
+      rootStyles,
+      railStyles,
+      offsetStyles,
+      offsetComputedStyles,
+      trackStyles,
+      trackComputedStyles,
       thumbStyles,
       breakpointMarkStyles,
       labelStyles,
@@ -401,7 +406,7 @@ var __vue_render__ = function () {
   }, [_c('div', {
     ref: 'offset',
     class: _vm.offsetStyles,
-    style: _vm.offsetInlineStyles,
+    style: _vm.offsetComputedStyles,
     attrs: {
       "disabled": _vm.disabled
     }
@@ -433,7 +438,7 @@ var __vue_render__ = function () {
   })]), _vm._v(" "), _c('div', {
     ref: 'track',
     class: _vm.trackStyles,
-    style: _vm.trackInlineStyles,
+    style: _vm.trackComputedStyles,
     attrs: {
       "disabled": _vm.disabled
     }
@@ -495,7 +500,7 @@ var __vue_render__ = function () {
       style: _vm.getBreakpointMarkComputedStyles(breakpoint),
       attrs: {
         "disabled": _vm.disabled,
-        "force-state": _vm.highlightedBreakpoint === breakpoint ? 'hover' : undefined
+        "force-state": _vm.highlightedBreakpoint === breakpoint ? 'hover' : null
       },
       on: {
         "mouseenter": function ($event) {

package/dist/bundled/v2/components/OrRangeSliderV3/OrRangeSlider.vue.d.ts

@@ -1,32 +1,31 @@
 import { PropType } from 'vue-demi';
 import { SliderColor, SliderOrientation } from '../or-slider-v3';
-import { RangeSliderModelValue } from './types';
 declare const _default: import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<{
     root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
-    rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
     rail: import("@vue/composition-api").Ref<HTMLElement | undefined>;
-    railStyles: import("@vue/composition-api").ComputedRef<string[]>;
     offset: import("@vue/composition-api").Ref<HTMLElement | undefined>;
+    track: import("@vue/composition-api").Ref<HTMLElement | undefined>;
+    filler: import("@vue/composition-api").Ref<HTMLElement | undefined>;
+    thumbFrom: import("@vue/composition-api").Ref<HTMLElement | undefined>;
+    thumbTo: import("@vue/composition-api").Ref<HTMLElement | undefined>;
+    rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
+    railStyles: import("@vue/composition-api").ComputedRef<string[]>;
     offsetStyles: import("@vue/composition-api").ComputedRef<string[]>;
-    offsetInlineStyles: import("@vue/composition-api").ComputedRef<{
+    offsetComputedStyles: import("@vue/composition-api").ComputedRef<{
         width: string;
         height?: undefined;
     } | {
         height: string;
         width?: undefined;
     } | undefined>;
-    track: import("@vue/composition-api").Ref<HTMLElement | undefined>;
     trackStyles: import("@vue/composition-api").ComputedRef<string[]>;
-    trackInlineStyles: import("@vue/composition-api").ComputedRef<{
+    trackComputedStyles: import("@vue/composition-api").ComputedRef<{
         width: string;
         height?: undefined;
     } | {
         height: string;
         width?: undefined;
     } | undefined>;
-    filler: import("@vue/composition-api").Ref<HTMLElement | undefined>;
-    thumbFrom: import("@vue/composition-api").Ref<HTMLElement | undefined>;
-    thumbTo: import("@vue/composition-api").Ref<HTMLElement | undefined>;
     thumbStyles: import("@vue/composition-api").ComputedRef<string[]>;
     breakpointMarkStyles: import("@vue/composition-api").ComputedRef<string[]>;
     labelStyles: import("@vue/composition-api").ComputedRef<string[]>;
@@ -46,7 +45,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     isDragging: import("@vue/composition-api").ComputedRef<boolean>;
 }> & import("@vue/composition-api").Data, {}, {}, {
     modelValue: {
-        type: PropType<RangeSliderModelValue>;
+        type: PropType<[number, number]>;
         default: undefined;
     };
     minValue: {
@@ -63,7 +62,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     };
     breakpoints: {
         type: PropType<number[]>;
-        default: () => never[];
+        default: number[];
     };
     color: {
         type: PropType<"primary" | "secondary">;
@@ -85,7 +84,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     };
 }, import("@vue/composition-api").ExtractPropTypes<{
     modelValue: {
-        type: PropType<RangeSliderModelValue>;
+        type: PropType<[number, number]>;
         default: undefined;
     };
     minValue: {
@@ -102,7 +101,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     };
     breakpoints: {
         type: PropType<number[]>;
-        default: () => never[];
+        default: number[];
     };
     color: {
         type: PropType<"primary" | "secondary">;
@@ -123,7 +122,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         default: undefined;
     };
 }>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
-    modelValue: RangeSliderModelValue;
+    modelValue: [number, number];
     minValue: number;
     maxValue: number;
     step: number;
@@ -138,30 +137,30 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
 }, import("@vue/composition-api").ShallowUnwrapRef<{
     root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
-    rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
     rail: import("@vue/composition-api").Ref<HTMLElement | undefined>;
-    railStyles: import("@vue/composition-api").ComputedRef<string[]>;
     offset: import("@vue/composition-api").Ref<HTMLElement | undefined>;
+    track: import("@vue/composition-api").Ref<HTMLElement | undefined>;
+    filler: import("@vue/composition-api").Ref<HTMLElement | undefined>;
+    thumbFrom: import("@vue/composition-api").Ref<HTMLElement | undefined>;
+    thumbTo: import("@vue/composition-api").Ref<HTMLElement | undefined>;
+    rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
+    railStyles: import("@vue/composition-api").ComputedRef<string[]>;
     offsetStyles: import("@vue/composition-api").ComputedRef<string[]>;
-    offsetInlineStyles: import("@vue/composition-api").ComputedRef<{
+    offsetComputedStyles: import("@vue/composition-api").ComputedRef<{
         width: string;
         height?: undefined;
     } | {
         height: string;
         width?: undefined;
     } | undefined>;
-    track: import("@vue/composition-api").Ref<HTMLElement | undefined>;
     trackStyles: import("@vue/composition-api").ComputedRef<string[]>;
-    trackInlineStyles: import("@vue/composition-api").ComputedRef<{
+    trackComputedStyles: import("@vue/composition-api").ComputedRef<{
         width: string;
         height?: undefined;
     } | {
         height: string;
         width?: undefined;
     } | undefined>;
-    filler: import("@vue/composition-api").Ref<HTMLElement | undefined>;
-    thumbFrom: import("@vue/composition-api").Ref<HTMLElement | undefined>;
-    thumbTo: import("@vue/composition-api").Ref<HTMLElement | undefined>;
     thumbStyles: import("@vue/composition-api").ComputedRef<string[]>;
     breakpointMarkStyles: import("@vue/composition-api").ComputedRef<string[]>;
     labelStyles: import("@vue/composition-api").ComputedRef<string[]>;
@@ -180,7 +179,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     isHoveringThumbTo: import("@vue/composition-api").Ref<boolean>;
     isDragging: import("@vue/composition-api").ComputedRef<boolean>;
 }>, import("@vue/composition-api").Data, {}, {}, {}, {}, string[], {
-    modelValue: RangeSliderModelValue;
+    modelValue: [number, number];
     minValue: number;
     maxValue: number;
     step: number;
@@ -194,7 +193,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
 } & {} & {
     [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
 }, {
-    modelValue: RangeSliderModelValue;
+    modelValue: [number, number];
     minValue: number;
     maxValue: number;
     step: number;

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

@@ -1,2 +1 @@
 export { default as OrRangeSliderV3 } from './OrRangeSlider.vue';
-export * from './types';

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

@@ -1,4 +1,4 @@
-import { a as SliderOrientation, S as SliderColor } from '../../types-977c9542.js';
+import { SliderOrientation, SliderColor } from '../OrSliderV3/props.js';
 
 const RangeSlider = [
 // Interactivity
@@ -106,18 +106,18 @@ const RangeSliderThumb = [
 const RangeSliderThumbColors = {
   [SliderColor.Primary]: [
   // Theme
-  'theme-border-primary border-4', 'dark:theme-border-primary-dark',
+  'theme-border-4-primary', 'dark:theme-border-4-primary-dark',
   // Theme (hover)
   'hover:theme-background-primary', 'dark:hover:theme-background-primary-dark',
   // Theme (active)
-  'active:theme-background-primary', 'dark:active:theme-background-primary-dark', 'active:theme-outline-primary active:outline-10', 'dark:active:theme-outline-primary-dark'],
+  'active:theme-background-primary', 'dark:active:theme-background-primary-dark', 'active:theme-outline-10-primary', 'dark:active:theme-outline-10-primary-dark'],
   [SliderColor.Secondary]: [
   // Theme
-  'theme-border-secondary border-4', 'dark:theme-border-secondary-dark',
+  'theme-border-4-secondary', 'dark:theme-border-4-secondary-dark',
   // Theme (hover)
   'hover:theme-background-secondary', 'dark:hover:theme-background-secondary-dark',
   // Theme (active)
-  'active:theme-background-secondary', 'dark:active:theme-background-secondary-dark', 'active:theme-outline-secondary active:outline-10', 'dark:active:theme-outline-secondary-dark']
+  'active:theme-background-secondary', 'dark:active:theme-background-secondary-dark', 'active:theme-outline-10-secondary', 'dark:active:theme-outline-10-secondary-dark']
 };
 const RangeSliderBreakpointMark = [
 // Position

package/dist/bundled/v2/components/OrRatingV3/OrRating.js

@@ -1,5 +1,5 @@
-import { defineComponent, inject, ref, computed, toRef, watch, reactive } from 'vue-demi';
-import { Rating, RatingStar } from './styles.js';
+import { defineComponent, ref, computed, inject, toRef, watch, reactive } from 'vue-demi';
+import { R as RatingVariant, a as Rating, b as RatingVariants, c as RatingStar } from '../../styles-df8f7e15.js';
 import __vue_component__$1 from '../OrIconV3/OrIcon.js';
 import { useProxyModelValue } from '../../hooks/useProxyModelValue.js';
 import { n as normalizeComponent } from '../../normalize-component-6e8e3d80.js';
@@ -19,6 +19,14 @@ var script = defineComponent({
       type: Number,
       default: 0
     },
+    variant: {
+      type: String,
+      default: () => RatingVariant.Default
+    },
+    readonly: {
+      type: Boolean,
+      default: false
+    },
     disabled: {
       type: Boolean,
       default: false
@@ -27,13 +35,12 @@ var script = defineComponent({
   emits: ['update:modelValue'],
   expose: ['root'],
   setup(props, context) {
+    // Refs & Styles
+    const root = ref();
+    const rootStyles = computed(() => ['or-rating-v3', ...Rating, ...RatingVariants[props.variant]]);
+    const starStyles = computed(() => [...RatingStar, ...(props.readonly ? ['interactivity-none'] : [])]);
     // Options
     const length = inject(RATING_LENGTH, 5);
-    // Refs
-    const root = ref();
-    // Styles
-    const rootStyles = computed(() => ['or-rating-v3', ...Rating]);
-    const starStyles = computed(() => [...RatingStar]);
     // State
     const proxyModelValue = useProxyModelValue(toRef(props, 'modelValue'), context.emit);
     const draftModelValue = ref(proxyModelValue.value);
@@ -113,7 +120,7 @@ var __vue_render__ = function () {
       attrs: {
         "icon": _vm.draftModelValue - value + 1 === 0.5 ? 'star_half' : 'star',
         "variant": value <= _vm.draftModelValue ? 'filled' : 'outlined',
-        "size": _vm.hoverIndex[value - 1] ? 'xl' : 'l'
+        "size": _vm.variant === 'fitted' ? 'inherit' : _vm.hoverIndex[value - 1] ? 'xl' : 'l'
       }
     })], 1);
   }), 0);

package/dist/bundled/v2/components/OrRatingV3/OrRating.vue.d.ts

@@ -1,3 +1,5 @@
+import { PropType } from 'vue-demi';
+import { RatingVariant } from './types';
 export declare const RATING_LENGTH: unique symbol;
 declare const _default: import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<{
     length: number;
@@ -15,6 +17,14 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         type: NumberConstructor;
         default: number;
     };
+    variant: {
+        type: PropType<"default" | "fitted">;
+        default: () => RatingVariant.Default;
+    };
+    readonly: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     disabled: {
         type: BooleanConstructor;
         default: boolean;
@@ -24,12 +34,22 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         type: NumberConstructor;
         default: number;
     };
+    variant: {
+        type: PropType<"default" | "fitted">;
+        default: () => RatingVariant.Default;
+    };
+    readonly: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     disabled: {
         type: BooleanConstructor;
         default: boolean;
     };
 }>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
     modelValue: number;
+    variant: "default" | "fitted";
+    readonly: boolean;
     disabled: boolean;
 } & {} & {
     [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
@@ -46,11 +66,15 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     onMouseLeave: (event: MouseEvent, index: number) => void;
 }>, import("@vue/composition-api").Data, {}, {}, {}, {}, string[], {
     modelValue: number;
+    variant: "default" | "fitted";
+    readonly: boolean;
     disabled: boolean;
 } & {} & {
     [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
 }, {
     modelValue: number;
+    variant: "default" | "fitted";
+    readonly: boolean;
     disabled: boolean;
 }, true>);
 export default _default;

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

@@ -1 +1,2 @@
 export { default as OrRatingV3 } from './OrRating.vue';
+export * from './types';

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

@@ -1 +1,2 @@
 export { default as OrRatingV3 } from './OrRating.js';
+export { R as RatingVariant } from '../../styles-df8f7e15.js';

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

@@ -1,2 +1,4 @@
+import { RatingVariant } from './types';
 export declare const Rating: string[];
+export declare const RatingVariants: Record<RatingVariant, string[]>;
 export declare const RatingStar: string[];

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

@@ -1,18 +1 @@
-const Rating = [
-// Layout
-'layout-row',
-// Theme
-'theme-foreground-disabled', 'dark:theme-foreground-disabled-dark'];
-const RatingStar = [
-// Layout
-'layout-row justify-center',
-// Interactivity
-'interactivity-click',
-// Box
-'w-[28px] md:w-[24px]', 'h-[28px] md:h-[24px]',
-// Theme (activated)
-'activated:text-warning-hover', 'dark:activated:text-warning-hover-dark',
-// Theme (disabled)
-'disabled:text-disabled', 'dark:disabled:text-disabled-dark'];
-
-export { Rating, RatingStar };
+export { a as Rating, c as RatingStar, b as RatingVariants } from '../../styles-df8f7e15.js';

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

@@ -0,0 +1,4 @@
+export declare enum RatingVariant {
+    Default = "default",
+    Fitted = "fitted"
+}

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

@@ -116,7 +116,7 @@ const ResizeablePanelCollapseButtonContainer = [
 // Typography
 'leading-[0]',
 // Theme
-'theme-background-default', 'dark:theme-background-default-dark', 'theme-border-outline-variant border-1', 'dark:theme-border-outline-variant-dark'];
+'theme-background-default', 'dark:theme-background-default-dark', 'theme-border-1-outline-variant', 'dark:theme-border-1-outline-variant-dark'];
 const ResizeablePanelCollapseButtonContainerPlacements = {
   [ResizeablePanelPlacement.Top]: [
   // Position
@@ -139,7 +139,7 @@ const ResizeablePanelToolbar = [
 // Spacing
 'px-md', 'py-md', 'gap-md',
 // Theme
-'theme-border-outline-variant border-1', 'dark:theme-border-outline-variant-dark'];
+'theme-border-1-outline-variant', 'dark:theme-border-1-outline-variant-dark'];
 const ResizeablePanelToolbarPlacements = {
   [ResizeablePanelPlacement.Top]: [
   // Layout

package/dist/bundled/v2/components/OrRichTextEditorV3/OrRichTextEditor.js

@@ -12,7 +12,7 @@ import __vue_component__$2 from '../OrLabelV3/OrLabel.js';
 import __vue_component__$3 from '../OrMenuItemV3/OrMenuItem.js';
 import __vue_component__$4 from '../OrMenuV3/OrMenu.js';
 import __vue_component__$5 from '../OrModalV3/OrModal.js';
-import { _ as __vue_component__$6 } from '../../OrInput-41dd90cc.js';
+import { _ as __vue_component__$6 } from '../../OrInput-8f24749f.js';
 import __vue_component__$7 from '../OrButtonV3/OrButton.js';
 import __vue_component__$8 from '../OrPopoverV3/OrPopover.js';
 import __vue_component__$9 from '../OrHintV3/OrHint.js';

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

@@ -9,9 +9,9 @@ const EditorContainer = [
 // Layout
 'layout-column',
 // Theme (focus)
-'focus-within:theme-background-primary-translucent-1', 'dark:focus-within:theme-background-primary-translucent-1-dark', 'focus-within:theme-border-primary focus-within:border-1', 'dark:focus-within:theme-border-primary-dark', 'focus-within:theme-outline-primary focus-within:outline-2', 'dark:focus-within:theme-outline-primary-dark',
+'focus-within:theme-background-primary-translucent-1', 'dark:focus-within:theme-background-primary-translucent-1-dark', 'focus-within:theme-border-1-primary', 'dark:focus-within:theme-border-1-primary-dark', 'focus-within:theme-outline-2-primary', 'dark:focus-within:theme-outline-2-primary-dark',
 // Theme (invalid)
-'invalid:theme-background-error-translucent-1', 'dark:invalid:theme-background-error-translucent-1-dark', 'invalid:theme-foreground-default', 'dark:invalid:theme-foreground-default-dark', 'invalid:theme-border-error invalid:border-1', 'dark:invalid:theme-border-error-dark', 'invalid:theme-outline-transparent invalid:outline-2', 'dark:invalid:theme-outline-transparent',
+'invalid:theme-background-error-translucent-1', 'dark:invalid:theme-background-error-translucent-1-dark', 'invalid:theme-foreground-default', 'dark:invalid:theme-foreground-default-dark', 'invalid:theme-border-1-error', 'dark:invalid:theme-border-1-error-dark', 'invalid:theme-outline-2-transparent', 'dark:invalid:theme-outline-2-transparent',
 // Box
 'border-1', 'rounded-md', 'w-full', 'overflow-hidden', 'grow'];
 const ToolbarContainer = [