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

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

@@ -1,5 +1,214 @@
-export { _ as default } from '../../OrProgress-4ee24824.js';
-import '../../normalize-component-6e8e3d80.js';
-import '../../browser-82dea9ed.js';
-import 'lodash';
-import 'vue-demi';
+import _ from 'lodash';
+import { defineComponent } from 'vue-demi';
+import { OrProgressTypes, OrProgressColors } from './constants.js';
+import { n as normalizeComponent } from '../../normalize-component-6e8e3d80.js';
+import { c as createInjector } from '../../browser-82dea9ed.js';
+
+var script = defineComponent({
+  name: 'OrProgress',
+  props: {
+    maxValue: {
+      type: Number,
+      required: false,
+      default: 1,
+      validator: value => _.isNumber(value) && value != 0
+    },
+    value: {
+      type: Number,
+      required: false,
+      default: null
+    },
+    progress: {
+      type: Number,
+      required: false,
+      default: null,
+      validator: value => _.isNumber(value) && value >= 0 && value <= 1
+    },
+    precision: {
+      type: Number,
+      required: false,
+      default: 2,
+      validator: value => _.isNumber(value) && value >= -1
+    },
+    type: {
+      type: String,
+      required: false,
+      default: OrProgressTypes.linear
+    },
+    color: {
+      type: String,
+      required: false,
+      default: OrProgressColors.auto
+    },
+    headerText: {
+      type: String,
+      required: false,
+      default: null
+    },
+    footerText: {
+      type: String,
+      required: false,
+      default: null
+    },
+    isLoading: {
+      type: Boolean,
+      required: false,
+      default: false
+    }
+  },
+  computed: {
+    localProgress() {
+      var _a, _b;
+      return (_a = this.progress) !== null && _a !== void 0 ? _a : ((_b = this.value) !== null && _b !== void 0 ? _b : 0) / this.maxValue;
+    },
+    localValue() {
+      var _a, _b;
+      return (_a = this.value) !== null && _a !== void 0 ? _a : ((_b = this.progress) !== null && _b !== void 0 ? _b : 0) * this.maxValue;
+    },
+    percent() {
+      return _.round(this.localProgress * 100, this.precision) + '%';
+    },
+    isLinearType() {
+      return this.type === OrProgressTypes.linear;
+    },
+    isCircleType() {
+      return this.type === OrProgressTypes.circle;
+    },
+    isShowingHeader() {
+      var _a;
+      return !!this.headerText || !!this.$slots.header || !!this.$slots.label || !!this.$slots.percent || !!((_a = this.$scopedSlots) === null || _a === void 0 ? void 0 : _a.percent);
+    },
+    isShowingFooter() {
+      var _a;
+      return !!this.footerText || !!this.$slots.footer || !!((_a = this.$scopedSlots) === null || _a === void 0 ? void 0 : _a.footer);
+    },
+    localColor() {
+      if (this.color === OrProgressColors.auto) {
+        if (this.localProgress <= 0.5) {
+          return OrProgressColors.success;
+        } else if (this.localProgress <= 0.95) {
+          return OrProgressColors.warning;
+        } else {
+          return OrProgressColors.error;
+        }
+      } else {
+        return Object.values(OrProgressColors).includes(this.color) ? this.color : OrProgressColors.success;
+      }
+    },
+    isMoreThanHalf() {
+      return this.localProgress > 0.5;
+    },
+    progressBarClasses() {
+      const colorClass = `is-${this.localColor}-color`;
+      return ['or-progress-bar', colorClass];
+    },
+    progressPieClasses() {
+      const colorClass = `is-${this.localColor}-color`;
+      return ['or-progress-pie', colorClass, ...(this.isLoading ? ['is-loading'] : [])];
+    },
+    progressBarStyle() {
+      return {
+        transform: `scaleX(${this.localProgress})`
+      };
+    },
+    leftCircleHalfStyle() {
+      const angle = this.isMoreThanHalf ? this.localProgress * 360 : 180;
+      return {
+        transform: `rotate(${angle}deg)`,
+        visibility: this.isMoreThanHalf ? 'visible' : 'hidden'
+      };
+    },
+    rightCircleHalfStyle() {
+      const angle = this.isMoreThanHalf ? 180 : this.localProgress * 360;
+      return {
+        transform: `rotate(${angle}deg)`
+      };
+    },
+    pieCircleStyle() {
+      return this.localProgress <= 0.5 ? {} : {
+        clip: 'rect(auto, auto, auto, auto)'
+      };
+    }
+  }
+});
+
+/* script */
+const __vue_script__ = script;
+
+/* template */
+var __vue_render__ = function () {
+  var _vm = this;
+  var _h = _vm.$createElement;
+  var _c = _vm._self._c || _h;
+  return _c('div', {
+    staticClass: "or-progress",
+    class: {
+      'is-linear': _vm.isLinearType
+    }
+  }, [_vm.isLinearType ? [_vm.isShowingHeader ? _c('div', {
+    staticClass: "or-progress-header"
+  }, [_vm._t("header", function () {
+    return [_c('div', {
+      staticClass: "label"
+    }, [_vm._t("label", function () {
+      return [_vm._v("\n            " + _vm._s(_vm.headerText) + "\n          ")];
+    })], 2), _vm._v(" "), _c('div', {
+      staticClass: "percent"
+    }, [_vm._t("percent", function () {
+      return [_vm._v("\n            " + _vm._s(_vm.percent) + "\n          ")];
+    }, {
+      "value": _vm.percent
+    })], 2)];
+  })], 2) : _vm._e(), _vm._v(" "), _c('div', {
+    staticClass: "or-progress-linear"
+  }, [_vm.isLoading ? _c('div', {
+    staticClass: "or-progress-loader"
+  }) : _c('div', {
+    class: _vm.progressBarClasses,
+    style: _vm.progressBarStyle
+  })]), _vm._v(" "), _vm.isShowingFooter ? _c('div', {
+    staticClass: "or-progress-footer"
+  }, [_vm._t("footer", function () {
+    return [_vm._v("\n        " + _vm._s(_vm.footerText) + "\n      ")];
+  }, {
+    "value": _vm.localValue
+  })], 2) : _vm._e()] : _vm.isCircleType ? [_c('div', {
+    staticClass: "or-progress-circle"
+  }, [_c('div', {
+    class: _vm.progressPieClasses,
+    style: _vm.pieCircleStyle
+  }, [_c('div', {
+    staticClass: "left-side half-circle",
+    style: _vm.leftCircleHalfStyle
+  }), _vm._v(" "), _c('div', {
+    staticClass: "right-side half-circle",
+    style: _vm.rightCircleHalfStyle
+  })])])] : _vm._e()], 2);
+};
+var __vue_staticRenderFns__ = [];
+
+/* style */
+const __vue_inject_styles__ = function (inject) {
+  if (!inject) return;
+  inject("data-v-5701138a_0", {
+    source: "@keyframes spinAround-data-v-5701138a{from{transform:rotate(0)}to{transform:rotate(359deg)}}@keyframes fade-data-v-5701138a{from{opacity:1}to{opacity:0}}@keyframes loaderLinear-data-v-5701138a{0%{transform:translate(-100%,0)}100%{transform:translate(100%,0)}}.or-progress[data-v-5701138a]{font-size:var(--fs-0);line-height:var(--lh-0);color:var(--c-neutral-5)}.or-progress.is-linear[data-v-5701138a]{width:100%;display:flex;flex-direction:column;min-width:10rem;max-width:18.4375rem}.or-progress .or-progress-header[data-v-5701138a]{margin-bottom:.375rem;display:flex;flex-direction:row}.or-progress .or-progress-header .label[data-v-5701138a]{color:var(--c-neutral-6);font-weight:700}.or-progress .or-progress-header .percent[data-v-5701138a]{margin-left:auto}.or-progress .or-progress-linear[data-v-5701138a]{height:var(--s-1);border-radius:1px;background-color:var(--c-neutral-2);position:relative;display:block;width:100%;overflow:hidden;transition-timing-function:ease;transition-duration:.3s;transition-property:height,opacity}.or-progress .or-progress-linear .or-progress-bar[data-v-5701138a],.or-progress .or-progress-linear .or-progress-loader[data-v-5701138a],.or-progress .or-progress-linear .or-progress-loader[data-v-5701138a]::after{position:absolute;top:0;left:0;bottom:0;width:100%;height:auto}.or-progress .or-progress-linear .or-progress-loader[data-v-5701138a]{animation:loaderLinear-data-v-5701138a 1.2s var(--t-func) infinite}.or-progress .or-progress-linear .or-progress-loader[data-v-5701138a]::after{max-width:7rem;background-color:var(--c-neutral-5);border-radius:var(--s-1);content:\"\"}.or-progress .or-progress-linear .or-progress-bar[data-v-5701138a]{transition:transform .2s linear;transform-origin:left}.or-progress .or-progress-linear .or-progress-bar.is-primary-color[data-v-5701138a]{background-color:var(--c-primary)}.or-progress .or-progress-linear .or-progress-bar.is-success-color[data-v-5701138a]{background-color:var(--c-success)}.or-progress .or-progress-linear .or-progress-bar.is-warning-color[data-v-5701138a]{background-color:var(--c-warning)}.or-progress .or-progress-linear .or-progress-bar.is-error-color[data-v-5701138a]{background-color:var(--c-error)}.or-progress .or-progress-circle[data-v-5701138a]{position:relative;width:1.5rem;height:1.5rem}.or-progress .or-progress-circle .or-progress-pie[data-v-5701138a]{clip:rect(0,1.5rem,1.5rem,.75rem)}.or-progress .or-progress-circle .or-progress-pie.is-loading[data-v-5701138a]{clip:rect(auto,auto,auto,auto);animation:spinAround-data-v-5701138a .7s linear infinite}.or-progress .or-progress-circle .or-progress-pie.is-loading .half-circle[data-v-5701138a]{visibility:visible!important;border-color:var(--c-primary)!important}.or-progress .or-progress-circle .or-progress-pie.is-loading .half-circle.left-side[data-v-5701138a]{transform:rotate(270deg)!important}.or-progress .or-progress-circle .or-progress-pie.is-loading .half-circle.right-side[data-v-5701138a]{transform:rotate(180deg)!important}.or-progress .or-progress-circle .or-progress-pie[data-v-5701138a],.or-progress .or-progress-circle .or-progress-pie .half-circle[data-v-5701138a]{width:100%;height:100%;position:absolute;top:0;left:0}.or-progress .or-progress-circle .or-progress-pie .half-circle[data-v-5701138a]{border-style:solid;border-width:var(--s-1);border-radius:50%;clip:rect(0,.75rem,1.5rem,0)}.or-progress .or-progress-circle .or-progress-pie .half-circle.left-side[data-v-5701138a]{transform:rotate(180deg);transition:visibility .2s linear .2s,transform .2s linear .2s}.or-progress .or-progress-circle .or-progress-pie .half-circle.right-side[data-v-5701138a]{transition:transform .2s linear}.or-progress .or-progress-circle .or-progress-pie.is-primary-color>.half-circle[data-v-5701138a]{border-color:var(--c-primary)}.or-progress .or-progress-circle .or-progress-pie.is-success-color>.half-circle[data-v-5701138a]{border-color:var(--c-success)}.or-progress .or-progress-circle .or-progress-pie.is-warning-color>.half-circle[data-v-5701138a]{border-color:var(--c-warning)}.or-progress .or-progress-circle .or-progress-pie.is-error-color>.half-circle[data-v-5701138a]{border-color:var(--c-error)}.or-progress .or-progress-footer[data-v-5701138a]{margin-top:var(--s-1)}",
+    map: undefined,
+    media: undefined
+  });
+};
+/* scoped */
+const __vue_scope_id__ = "data-v-5701138a";
+/* module identifier */
+const __vue_module_identifier__ = undefined;
+/* functional template */
+const __vue_is_functional_template__ = false;
+/* style inject SSR */
+
+/* style inject shadow dom */
+
+const __vue_component__ = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__,
+  staticRenderFns: __vue_staticRenderFns__
+}, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, false, createInjector, undefined, undefined);
+
+export { __vue_component__ as default };

package/dist/bundled/v2/components/OrProgress/constants.js

@@ -0,0 +1,15 @@
+var OrProgressColors;
+(function (OrProgressColors) {
+  OrProgressColors["auto"] = "auto";
+  OrProgressColors["primary"] = "primary";
+  OrProgressColors["success"] = "success";
+  OrProgressColors["warning"] = "warning";
+  OrProgressColors["error"] = "error";
+})(OrProgressColors || (OrProgressColors = {}));
+var OrProgressTypes;
+(function (OrProgressTypes) {
+  OrProgressTypes["linear"] = "linear";
+  OrProgressTypes["circle"] = "circle";
+})(OrProgressTypes || (OrProgressTypes = {}));
+
+export { OrProgressColors, OrProgressTypes };

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

@@ -1,4 +1,5 @@
-export { _ as OrProgress, O as OrProgressColors, a as OrProgressTypes } from '../../OrProgress-4ee24824.js';
+export { default as OrProgress } from './OrProgress.js';
+export { OrProgressColors, OrProgressTypes } from './constants.js';
 import 'lodash';
 import 'vue-demi';
 import '../../normalize-component-6e8e3d80.js';

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

@@ -1,7 +1,245 @@
-export { _ as default } from '../../OrProgress-005c516d.js';
-import '../../normalize-component-6e8e3d80.js';
-import 'lodash';
-import '@vueuse/core';
-import 'vue-demi';
-import '../../useResponsive-a02e95b7.js';
-import '../../useClassAttribute-47fdb016.js';
+import _ from 'lodash';
+import { useElementBounding } from '@vueuse/core';
+import { defineComponent, ref, useSlots, computed } from 'vue-demi';
+import { ProgressType, ProgressColor } from './props.js';
+import { ProgressRoot, ProgressRootTypes, ProgressHeader, ProgressHeaderLabel, ProgressHeaderPercent, ProgressFooter, ProgressBarBackground, ProgressBarMain, ProgressBarAnimationTypes, ProgressBarColors } from './styles.js';
+import useResponsive from '../../hooks/useResponsive/useResponsive.js';
+import { useClassAttribute } from '../../hooks/useClassAttribute.js';
+import { n as normalizeComponent } from '../../normalize-component-6e8e3d80.js';
+
+var script = defineComponent({
+  name: 'OrProgress',
+  inheritAttrs: false,
+  props: {
+    maxValue: {
+      type: Number,
+      required: false,
+      default: 1,
+      validator: value => _.isNumber(value) && value != 0
+    },
+    value: {
+      type: Number,
+      required: false,
+      default: null
+    },
+    progress: {
+      type: Number,
+      required: false,
+      default: null,
+      validator: value => _.isNumber(value) && value >= 0 && value <= 1
+    },
+    precision: {
+      type: Number,
+      required: false,
+      default: 2,
+      validator: value => _.isNumber(value) && value >= -1
+    },
+    type: {
+      type: String,
+      required: false,
+      default: ProgressType.Linear
+    },
+    color: {
+      type: String,
+      required: false,
+      default: ProgressColor.Auto
+    },
+    loading: {
+      type: Boolean,
+      required: false,
+      default: false
+    }
+  },
+  expose: ['root'],
+  setup(props) {
+    const {
+      isMobile
+    } = useResponsive();
+    // Refs
+    const root = ref();
+    // Slots
+    const {
+      header: headerSlot,
+      label: labelSlot,
+      percent: percentSlot,
+      footer: footerSlot
+    } = useSlots();
+    // State
+    const {
+      width
+    } = useElementBounding(root);
+    const localProgress = computed(() => {
+      var _a, _b, _c;
+      return (_a = props.progress) !== null && _a !== void 0 ? _a : ((_b = props.value) !== null && _b !== void 0 ? _b : 0) / ((_c = props.maxValue) !== null && _c !== void 0 ? _c : 1);
+    });
+    const localValue = computed(() => {
+      var _a, _b, _c;
+      return (_a = props.value) !== null && _a !== void 0 ? _a : ((_b = props.progress) !== null && _b !== void 0 ? _b : 0) * ((_c = props.maxValue) !== null && _c !== void 0 ? _c : 1);
+    });
+    const percent = computed(() => _.round(localProgress.value * 100, props.precision) + '%');
+    const isLinearType = computed(() => props.type === ProgressType.Linear);
+    const isCircleType = computed(() => props.type === ProgressType.Circle);
+    const isShowingHeader = computed(() => !!headerSlot || !!labelSlot || !!percentSlot);
+    const isShowingFooter = computed(() => !!footerSlot);
+    const localColor = computed(() => {
+      if (props.loading) return ProgressColor.Primary;
+      if (props.color === ProgressColor.Auto) {
+        if (localProgress.value <= 0.5) {
+          return ProgressColor.Success;
+        } else if (localProgress.value <= 0.95) {
+          return ProgressColor.Warning;
+        } else {
+          return ProgressColor.Error;
+        }
+      } else {
+        return Object.values(ProgressColor).includes(props.color) ? props.color : ProgressColor.Success;
+      }
+    });
+    const computedSize = computed(() => isMobile.value ? 20 : 16);
+    // Styles
+    const classAttribute = useClassAttribute();
+    const rootStyles = computed(() => ['or-progress', ...ProgressRoot, ...ProgressRootTypes[props.type], classAttribute.value]);
+    const headerStyles = computed(() => [...ProgressHeader]);
+    const labelStyles = computed(() => [...ProgressHeaderLabel]);
+    const percentStyles = computed(() => [...ProgressHeaderPercent]);
+    const footerStyles = computed(() => [...ProgressFooter]);
+    const progressBarBackgroundStyles = computed(() => [...ProgressBarBackground]);
+    const progressBarMainPartStyles = computed(() => [...ProgressBarMain, ...(props.loading ? ProgressBarAnimationTypes[props.type] : []), ...ProgressBarColors[localColor.value]]);
+    const strokeDasharray = computed(() => isLinearType.value ? width.value - 4 :
+    // 2 + 2 px horizontal padding for rounding
+    isCircleType.value ? 14 * Math.PI :
+    // 14 = diameter = viewBox - stroke-width
+    0);
+    const strokeDashoffset = computed(() => props.loading ? undefined : (1 - localProgress.value) * strokeDasharray.value);
+    return {
+      root,
+      rootStyles,
+      headerStyles,
+      labelStyles,
+      percentStyles,
+      footerStyles,
+      progressBarBackgroundStyles,
+      progressBarMainPartStyles,
+      strokeDasharray,
+      strokeDashoffset,
+      localProgress,
+      localValue,
+      percent,
+      isLinearType,
+      isCircleType,
+      isShowingHeader,
+      isShowingFooter,
+      localColor,
+      computedSize
+    };
+  }
+});
+
+/* script */
+const __vue_script__ = script;
+
+/* template */
+var __vue_render__ = function () {
+  var _vm = this;
+  var _h = _vm.$createElement;
+  var _c = _vm._self._c || _h;
+  return _c('div', _vm._b({
+    ref: "root",
+    class: _vm.rootStyles
+  }, 'div', _vm.$attrs, false), [_vm.isLinearType ? [_vm.isShowingHeader ? _c('div', {
+    class: _vm.headerStyles
+  }, [_vm._t("header", function () {
+    return [_c('div', {
+      class: _vm.labelStyles
+    }, [_vm._t("label")], 2), _vm._v(" "), _c('div', {
+      class: _vm.percentStyles
+    }, [_vm._t("percent", function () {
+      return [_vm._v("\n            " + _vm._s(_vm.percent) + "\n          ")];
+    }, {
+      "value": _vm.percent
+    })], 2)];
+  })], 2) : _vm._e(), _vm._v(" "), _c('svg', {
+    attrs: {
+      "width": "100%",
+      "height": "2"
+    }
+  }, [_c('g', {
+    attrs: {
+      "fill": "none",
+      "stroke-width": "2",
+      "stroke-linecap": "round"
+    }
+  }, [_c('line', {
+    class: _vm.progressBarBackgroundStyles,
+    attrs: {
+      "x1": "2",
+      "y1": "50%",
+      "x2": "calc(100% - 2px)",
+      "y2": "50%"
+    }
+  }), _vm._v(" "), _c('line', {
+    class: _vm.progressBarMainPartStyles,
+    attrs: {
+      "x1": "2",
+      "y1": "50%",
+      "x2": "calc(100% - 2px)",
+      "y2": "50%",
+      "stroke-dasharray": _vm.strokeDasharray,
+      "stroke-dashoffset": _vm.strokeDashoffset
+    }
+  })])]), _vm._v(" "), _vm.isShowingFooter ? _c('div', {
+    class: _vm.footerStyles
+  }, [_vm._t("footer", null, {
+    "value": _vm.localValue
+  })], 2) : _vm._e()] : _vm.isCircleType ? [_c('svg', {
+    attrs: {
+      "viewBox": "0 0 16 16",
+      "width": _vm.computedSize,
+      "height": _vm.computedSize
+    }
+  }, [_c('g', {
+    attrs: {
+      "fill": "none",
+      "stroke-width": "2",
+      "stroke-linecap": "round"
+    }
+  }, [_c('circle', {
+    class: _vm.progressBarBackgroundStyles,
+    attrs: {
+      "cx": "50%",
+      "cy": "50%",
+      "r": "7"
+    }
+  }), _vm._v(" "), _c('circle', {
+    class: _vm.progressBarMainPartStyles,
+    attrs: {
+      "cx": "50%",
+      "cy": "50%",
+      "r": "7",
+      "stroke-dasharray": _vm.strokeDasharray,
+      "stroke-dashoffset": _vm.strokeDashoffset
+    }
+  })])])] : _vm._e()], 2);
+};
+var __vue_staticRenderFns__ = [];
+
+/* style */
+const __vue_inject_styles__ = undefined;
+/* scoped */
+const __vue_scope_id__ = undefined;
+/* module identifier */
+const __vue_module_identifier__ = undefined;
+/* functional template */
+const __vue_is_functional_template__ = false;
+/* style inject */
+
+/* style inject SSR */
+
+/* style inject shadow dom */
+
+const __vue_component__ = /*#__PURE__*/normalizeComponent({
+  render: __vue_render__,
+  staticRenderFns: __vue_staticRenderFns__
+}, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, false, undefined, undefined, undefined);
+
+export { __vue_component__ as default };

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

@@ -1,7 +1,9 @@
-export { _ as OrProgressV3, P as ProgressColor, a as ProgressType } from '../../OrProgress-005c516d.js';
+export { default as OrProgressV3 } from './OrProgressV3.js';
+export { ProgressColor, ProgressType } from './props.js';
 import 'lodash';
 import '@vueuse/core';
 import 'vue-demi';
-import '../../useResponsive-a02e95b7.js';
-import '../../useClassAttribute-47fdb016.js';
+import './styles.js';
+import '../../hooks/useResponsive/useResponsive.js';
+import '../../hooks/useClassAttribute.js';
 import '../../normalize-component-6e8e3d80.js';

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

@@ -0,0 +1,15 @@
+var ProgressColor;
+(function (ProgressColor) {
+  ProgressColor["Auto"] = "auto";
+  ProgressColor["Primary"] = "primary";
+  ProgressColor["Success"] = "success";
+  ProgressColor["Warning"] = "warning";
+  ProgressColor["Error"] = "error";
+})(ProgressColor || (ProgressColor = {}));
+var ProgressType;
+(function (ProgressType) {
+  ProgressType["Linear"] = "linear";
+  ProgressType["Circle"] = "circle";
+})(ProgressType || (ProgressType = {}));
+
+export { ProgressColor, ProgressType };

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

@@ -0,0 +1,63 @@
+import { ProgressType, ProgressColor } from './props.js';
+
+const ProgressRoot = [
+// Typography
+'typography-caption-regular',
+// Theme
+'text-outline', 'dark:text-outline-dark'];
+const ProgressRootTypes = {
+  [ProgressType.Linear]: [
+  // Layout
+  'flex', 'flex-col',
+  // Box
+  'w-full', 'min-w-[160px]', 'max-w-[295px]'],
+  [ProgressType.Circle]: ['-rotate-90']
+};
+const ProgressHeader = [
+// Layout
+'flex', 'flex-row',
+// Sizing
+'mb-[6px]'];
+const ProgressHeaderLabel = [
+// Typography
+'typography-caption-bold',
+// Theme
+'text-on-background', 'dark:text-on-background-dark'];
+const ProgressHeaderPercent = [
+// Sizing
+'ml-auto'];
+const ProgressBarBackground = [
+// Theme
+'stroke-surface-variant', 'dark:stroke-surface-variant-dark'];
+const ProgressBarMain = [
+// Position
+'origin-center',
+// Animation
+'transition-[stroke-dashoffset]'];
+const ProgressBarAnimationTypes = {
+  [ProgressType.Linear]: [
+  // Animation
+  'animate-linear-loader'],
+  [ProgressType.Circle]: [
+  // Animation
+  'animate-circular-loader']
+};
+const ProgressBarColors = {
+  [ProgressColor.Primary]: [
+  // Theme
+  'stroke-primary-hover', 'dark:stroke-primary-hover-dark'],
+  [ProgressColor.Success]: [
+  // Theme
+  'stroke-success-hover', 'dark:stroke-success-hover-dark'],
+  [ProgressColor.Warning]: [
+  // Theme
+  'stroke-warning-hover', 'dark:stroke-warning-hover-dark'],
+  [ProgressColor.Error]: [
+  // Theme
+  'stroke-error-hover', 'dark:stroke-error-hover-dark']
+};
+const ProgressFooter = [
+// Sizing
+'mt-[2px]'];
+
+export { ProgressBarAnimationTypes, ProgressBarBackground, ProgressBarColors, ProgressBarMain, ProgressFooter, ProgressHeader, ProgressHeaderLabel, ProgressHeaderPercent, ProgressRoot, ProgressRootTypes };

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

@@ -1,38 +1,11 @@
 import { defineComponent, getCurrentInstance, ref, computed } from 'vue-demi';
-import { _ as __vue_component__$1, L as LabelVariant } from '../../OrLabel-b26f4298.js';
-import { u as useClassAttribute } from '../../useClassAttribute-47fdb016.js';
+import { RadioRoot, RadioControl, RadioControlHandle } from './styles.js';
+import __vue_component__$1 from '../OrLabelV3/OrLabelV3.js';
+import { useClassAttribute } from '../../hooks/useClassAttribute.js';
+import { LabelVariant } from '../OrLabelV3/props.js';
 import { n as normalizeComponent } from '../../normalize-component-6e8e3d80.js';
 import { c as createInjector } from '../../browser-82dea9ed.js';
-
-const RadioRoot = [
-// Layout
-'layout-row',
-// Spacing
-'gap-sm+ md:gap-sm'];
-const RadioControl = [
-// Layout
-'layout-row justify-center',
-// Box
-'w-md+ md:w-md', 'h-md+ md:h-md',
-// Shape
-'rounded-full',
-// Interactivity
-'interactivity-auto',
-// Theme
-'theme-preset-3-primary', 'dark:theme-preset-3-primary-dark', 'theme-background-default', 'dark:theme-background-default-dark', 'theme-border-1-outline', 'dark:theme-border-1-outline-dark',
-// Theme (focus)
-'focus:theme-outline-primary', 'dark:focus:theme-outline-primary-dark',
-// Theme (checked)
-'checked:theme-preset-1-primary', 'dark:checked:theme-preset-1-primary-dark'];
-const RadioControlHandle = [
-// Box
-'after:w-sm after:md:w-xs', 'after:h-sm after:md:h-xs',
-// Shape
-'after:rounded-full',
-// Theme
-'checked:after:bg-on-primary', 'dark:checked:after:bg-on-primary-dark',
-// Theme (disabled)
-'disabled:checked:after:bg-on-disabled', 'dark:disabled:checked:after:bg-on-disabled-dark'];
+import '../OrLabelV3/styles.js';
 
 var script = defineComponent({
   name: 'OrCheckbox',

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

@@ -1,6 +1,9 @@
 export { default as OrRadioV3 } from './OrRadioV3.js';
 import 'vue-demi';
-import '../../OrLabel-b26f4298.js';
-import '../../useClassAttribute-47fdb016.js';
+import './styles.js';
+import '../OrLabelV3/OrLabelV3.js';
+import '../OrLabelV3/props.js';
+import '../OrLabelV3/styles.js';
+import '../../hooks/useClassAttribute.js';
 import '../../normalize-component-6e8e3d80.js';
 import '../../browser-82dea9ed.js';

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

@@ -0,0 +1,31 @@
+const RadioRoot = [
+// Layout
+'layout-row',
+// Spacing
+'gap-sm+ md:gap-sm'];
+const RadioControl = [
+// Layout
+'layout-row justify-center',
+// Box
+'w-md+ md:w-md', 'h-md+ md:h-md',
+// Shape
+'rounded-full',
+// Interactivity
+'interactivity-auto',
+// Theme
+'theme-preset-3-primary', 'dark:theme-preset-3-primary-dark', 'theme-background-default', 'dark:theme-background-default-dark', 'theme-border-1-outline', 'dark:theme-border-1-outline-dark',
+// Theme (focus)
+'focus:theme-outline-primary', 'dark:focus:theme-outline-primary-dark',
+// Theme (checked)
+'checked:theme-preset-1-primary', 'dark:checked:theme-preset-1-primary-dark'];
+const RadioControlHandle = [
+// Box
+'after:w-sm after:md:w-xs', 'after:h-sm after:md:h-xs',
+// Shape
+'after:rounded-full',
+// Theme
+'checked:after:bg-on-primary', 'dark:checked:after:bg-on-primary-dark',
+// Theme (disabled)
+'disabled:checked:after:bg-on-disabled', 'dark:disabled:checked:after:bg-on-disabled-dark'];
+
+export { RadioControl, RadioControlHandle, RadioRoot };