yuyeon 0.0.0 → 0.0.2

package/lib/components/navigation/YNavigation.mjs

@@ -0,0 +1,17 @@
+import { createVNode as _createVNode } from "vue";
+import { defineComponent, getCurrentInstance } from "vue";
+import { YBench } from "../bench/YBench.mjs";
+export const YNavigation = defineComponent({
+  name: 'YNavigation',
+  components: {
+    YBench
+  },
+  setup(props, _ref) {
+    let {
+      slots
+    } = _ref;
+    const vm = getCurrentInstance();
+    return _createVNode(YBench, null, null);
+  }
+});
+//# sourceMappingURL=YNavigation.mjs.map

package/lib/components/navigation/YNavigation.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"YNavigation.mjs","names":["defineComponent","getCurrentInstance","YBench","YNavigation","name","components","setup","props","_ref","slots","vm","_createVNode"],"sources":["../../../src/components/navigation/YNavigation.tsx"],"sourcesContent":["import { defineComponent, getCurrentInstance } from \"vue\";\r\nimport { YBench } from \"../bench/YBench\";\r\n\r\nexport const YNavigation = defineComponent({\r\n  name: 'YNavigation',\r\n  components: {\r\n    YBench,\r\n  },\r\n  setup(props, { slots }) {\r\n    const vm = getCurrentInstance();\r\n    return (\r\n      <YBench>\r\n\r\n      </YBench>\r\n    )\r\n  }\r\n});\r\n\r\n"],"mappings":";AAAA,SAASA,eAAe,EAAEC,kBAAkB,QAAQ,KAAK;AAAC,SACjDC,MAAM;AAEf,OAAO,MAAMC,WAAW,GAAGH,eAAe,CAAC;EACzCI,IAAI,EAAE,aAAa;EACnBC,UAAU,EAAE;IACVH;EACF,CAAC;EACDI,KAAKA,CAACC,KAAK,EAAAC,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACpB,MAAME,EAAE,GAAGT,kBAAkB,CAAC,CAAC;IAC/B,OAAAU,YAAA,CAAAT,MAAA;EAKF;AACF,CAAC,CAAC"}

package/lib/components/navigation/index.mjs

@@ -0,0 +1,2 @@
+export * from "./YNavigation.mjs";
+//# sourceMappingURL=index.mjs.map

package/lib/components/navigation/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":[],"sources":["../../../src/components/navigation/index.ts"],"sourcesContent":["export * from './YNavigation';\n"],"mappings":""}

package/lib/components/pagination/YPagination.mjs

@@ -0,0 +1,61 @@
+import { createVNode as _createVNode } from "vue";
+import { computed, defineComponent } from 'vue';
+import { useModelDuplex } from "../../composables/communication.mjs";
+import { useRender } from "../../composables/component.mjs";
+import { useResizeObserver } from "../../composables/resize-observer.mjs";
+import { propsFactory } from "../../util/vue-component.mjs";
+import "./YPagination.scss";
+export const pressYPaginationProps = propsFactory({
+  start: {
+    type: [Number, String],
+    default: 1
+  },
+  modelValue: {
+    type: Number,
+    default: props => props.start
+  },
+  disabled: Boolean,
+  length: {
+    type: [Number, String],
+    default: 1,
+    validator: val => val % 1 === 0
+  },
+  totalVisible: [Number, String],
+  showEndButton: Boolean
+}, 'y-pagination');
+export const YPagination = defineComponent({
+  name: 'YPagination',
+  props: {
+    ...pressYPaginationProps()
+  },
+  emits: {
+    'update:modelValue': value => true,
+    first: value => true,
+    last: value => true,
+    prev: value => true,
+    next: value => true
+  },
+  setup(props, _ref) {
+    let {
+      slots
+    } = _ref;
+    const page = useModelDuplex(props);
+    const length = computed(() => parseInt(props.length, 10));
+    const start = computed(() => parseInt(props.start, 10));
+    const {
+      resizeObservedRef
+    } = useResizeObserver(entries => {
+      if (1 > entries.length) return;
+    });
+    useRender(() => {
+      return _createVNode("div", {
+        "class": ['y-pagination'],
+        "role": 'navigation',
+        "ref": resizeObservedRef
+      }, [_createVNode("ul", {
+        "class": ['y-pagination__list']
+      }, [_createVNode("li", null, null)])]);
+    });
+  }
+});
+//# sourceMappingURL=YPagination.mjs.map

package/lib/components/pagination/YPagination.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"YPagination.mjs","names":["computed","defineComponent","useModelDuplex","useRender","useResizeObserver","propsFactory","pressYPaginationProps","start","type","Number","String","default","modelValue","props","disabled","Boolean","length","validator","val","totalVisible","showEndButton","YPagination","name","emits","value","first","last","prev","next","setup","_ref","slots","page","parseInt","resizeObservedRef","entries","_createVNode"],"sources":["../../../src/components/pagination/YPagination.tsx"],"sourcesContent":["import { computed, defineComponent } from 'vue';\n\nimport { useModelDuplex } from '../../composables/communication';\nimport { useRender } from '../../composables/component';\nimport { useResizeObserver } from '../../composables/resize-observer';\nimport { propsFactory } from '../../util/vue-component';\n\nimport './YPagination.scss';\n\nexport const pressYPaginationProps = propsFactory(\n  {\n    start: {\n      type: [Number, String],\n      default: 1,\n    },\n    modelValue: {\n      type: Number,\n      default: (props: any) => props.start as number,\n    },\n    disabled: Boolean,\n    length: {\n      type: [Number, String],\n      default: 1,\n      validator: (val: number) => val % 1 === 0,\n    },\n    totalVisible: [Number, String],\n    showEndButton: Boolean,\n  },\n  'y-pagination',\n);\n\nexport const YPagination = defineComponent({\n  name: 'YPagination',\n  props: {\n    ...pressYPaginationProps(),\n  },\n  emits: {\n    'update:modelValue': (value: number) => true,\n    first: (value: number) => true,\n    last: (value: number) => true,\n    prev: (value: number) => true,\n    next: (value: number) => true,\n  },\n  setup(props, { slots }) {\n    const page = useModelDuplex(props);\n\n    const length = computed(() => parseInt(props.length as string, 10));\n    const start = computed(() => parseInt(props.start as string, 10));\n\n    const { resizeObservedRef } = useResizeObserver((entries) => {\n      if (1 > entries.length) return;\n    });\n    useRender(() => {\n      return (\n        <div\n          class={['y-pagination']}\n          role={'navigation'}\n          ref={resizeObservedRef}\n        >\n          <ul class={['y-pagination__list']}>\n            <li></li>\n          </ul>\n        </div>\n      );\n    });\n  },\n});\n"],"mappings":";AAAA,SAASA,QAAQ,EAAEC,eAAe,QAAQ,KAAK;AAAC,SAEvCC,cAAc;AAAA,SACdC,SAAS;AAAA,SACTC,iBAAiB;AAAA,SACjBC,YAAY;AAErB;AAEA,OAAO,MAAMC,qBAAqB,GAAGD,YAAY,CAC/C;EACEE,KAAK,EAAE;IACLC,IAAI,EAAE,CAACC,MAAM,EAAEC,MAAM,CAAC;IACtBC,OAAO,EAAE;EACX,CAAC;EACDC,UAAU,EAAE;IACVJ,IAAI,EAAEC,MAAM;IACZE,OAAO,EAAGE,KAAU,IAAKA,KAAK,CAACN;EACjC,CAAC;EACDO,QAAQ,EAAEC,OAAO;EACjBC,MAAM,EAAE;IACNR,IAAI,EAAE,CAACC,MAAM,EAAEC,MAAM,CAAC;IACtBC,OAAO,EAAE,CAAC;IACVM,SAAS,EAAGC,GAAW,IAAKA,GAAG,GAAG,CAAC,KAAK;EAC1C,CAAC;EACDC,YAAY,EAAE,CAACV,MAAM,EAAEC,MAAM,CAAC;EAC9BU,aAAa,EAAEL;AACjB,CAAC,EACD,cACF,CAAC;AAED,OAAO,MAAMM,WAAW,GAAGpB,eAAe,CAAC;EACzCqB,IAAI,EAAE,aAAa;EACnBT,KAAK,EAAE;IACL,GAAGP,qBAAqB,CAAC;EAC3B,CAAC;EACDiB,KAAK,EAAE;IACL,mBAAmB,EAAGC,KAAa,IAAK,IAAI;IAC5CC,KAAK,EAAGD,KAAa,IAAK,IAAI;IAC9BE,IAAI,EAAGF,KAAa,IAAK,IAAI;IAC7BG,IAAI,EAAGH,KAAa,IAAK,IAAI;IAC7BI,IAAI,EAAGJ,KAAa,IAAK;EAC3B,CAAC;EACDK,KAAKA,CAAChB,KAAK,EAAAiB,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACpB,MAAME,IAAI,GAAG9B,cAAc,CAACW,KAAK,CAAC;IAElC,MAAMG,MAAM,GAAGhB,QAAQ,CAAC,MAAMiC,QAAQ,CAACpB,KAAK,CAACG,MAAM,EAAY,EAAE,CAAC,CAAC;IACnE,MAAMT,KAAK,GAAGP,QAAQ,CAAC,MAAMiC,QAAQ,CAACpB,KAAK,CAACN,KAAK,EAAY,EAAE,CAAC,CAAC;IAEjE,MAAM;MAAE2B;IAAkB,CAAC,GAAG9B,iBAAiB,CAAE+B,OAAO,IAAK;MAC3D,IAAI,CAAC,GAAGA,OAAO,CAACnB,MAAM,EAAE;IAC1B,CAAC,CAAC;IACFb,SAAS,CAAC,MAAM;MACd,OAAAiC,YAAA;QAAA,SAEW,CAAC,cAAc,CAAC;QAAA,QACjB,YAAY;QAAA,OACbF;MAAiB,IAAAE,YAAA;QAAA,SAEX,CAAC,oBAAoB;MAAC,IAAAA,YAAA;IAKvC,CAAC,CAAC;EACJ;AACF,CAAC,CAAC"}

package/lib/components/pagination/YPagination.scss

@@ -0,0 +1,5 @@
+.y-pagination {
+  li {
+    list-style: none;
+  }
+}

package/lib/components/pagination/index.mjs

@@ -0,0 +1,2 @@
+export * from "./YPagination.mjs";
+//# sourceMappingURL=index.mjs.map

package/lib/components/pagination/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":[],"sources":["../../../src/components/pagination/index.ts"],"sourcesContent":["export * from './YPagination';\r\n"],"mappings":""}

package/lib/components/panel/YDividePanel.mjs

@@ -0,0 +1,89 @@
+import { createVNode as _createVNode, Fragment as _Fragment } from "vue";
+import { computed, defineComponent, ref, watch } from 'vue';
+import { useRender } from "../../composables/component.mjs";
+import "./YDividePanel.scss";
+export const YDividePanel = defineComponent({
+  setup(props, _ref) {
+    let {
+      slots
+    } = _ref;
+    const contentRate = ref(50);
+    const isResizing = ref(false);
+    const secondarySlot = ref();
+    const activeSecondary = ref(false);
+    const rootRef = ref();
+    watch(secondarySlot, neo => {
+      activeSecondary.value = !!neo;
+    });
+    const topStyles = computed(() => {
+      let inset = '0 0';
+      if (activeSecondary.value) {
+        inset = `0 0 ${100 - contentRate.value}% 0`;
+      }
+      return {
+        position: 'absolute',
+        inset
+      };
+    });
+    const classes = computed(() => {
+      return {
+        'y-divide-panel': true,
+        'y-divide-panel--resizing': isResizing.value
+      };
+    });
+    function moveListener(event) {
+      const mouseEvent = event;
+      const containerRect = rootRef.value.getBoundingClientRect();
+      requestAnimationFrame(() => {
+        contentRate.value = Math.min(Math.max(10, (mouseEvent.clientY - containerRect.y) / containerRect.height * 100), 90);
+      });
+    }
+    function cancelEvent() {
+      isResizing.value = false;
+      rootRef.value.removeEventListener('mousemove', moveListener);
+      rootRef.value.removeEventListener('mouseup', upListener);
+      rootRef.value.removeEventListener('mouseleave', leaveListener);
+    }
+    function upListener(event) {
+      cancelEvent();
+    }
+    function leaveListener(event) {
+      cancelEvent();
+    }
+    function onMousedown(event) {
+      event.preventDefault();
+      isResizing.value = true;
+      rootRef.value.addEventListener('mousemove', moveListener);
+      rootRef.value.addEventListener('mouseup', upListener);
+      rootRef.value.addEventListener('mouseleave', leaveListener);
+    }
+    useRender(() => {
+      return _createVNode(_Fragment, null, [_createVNode("div", {
+        "class": classes.value,
+        "ref": rootRef
+      }, [_createVNode("div", {
+        "class": 'y-divide-panel__top-container',
+        "style": topStyles.value
+      }, [slots.default?.()]), secondarySlot.value = slots.secondary && _createVNode(_Fragment, null, [_createVNode("div", {
+        "class": "y-divide-panel__divider",
+        "style": {
+          position: 'absolute',
+          inset: `${contentRate.value}% 0 0 0`
+        },
+        "onMousedown": onMousedown
+      }, [_createVNode("div", {
+        "class": "y-divide-panel__divider-line"
+      }, null)]), _createVNode("div", {
+        "class": 'y-divide-panel__secondary-container',
+        "style": {
+          position: 'absolute',
+          inset: `${contentRate.value}% 0 0 0`
+        }
+      }, [slots.secondary?.()])])])]);
+    });
+    return {
+      activeSecondary
+    };
+  }
+});
+//# sourceMappingURL=YDividePanel.mjs.map

package/lib/components/panel/YDividePanel.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"YDividePanel.mjs","names":["computed","defineComponent","ref","watch","useRender","YDividePanel","setup","props","_ref","slots","contentRate","isResizing","secondarySlot","activeSecondary","rootRef","neo","value","topStyles","inset","position","classes","moveListener","event","mouseEvent","containerRect","getBoundingClientRect","requestAnimationFrame","Math","min","max","clientY","y","height","cancelEvent","removeEventListener","upListener","leaveListener","onMousedown","preventDefault","addEventListener","_createVNode","_Fragment","default","secondary"],"sources":["../../../src/components/panel/YDividePanel.tsx"],"sourcesContent":["import {\n  CSSProperties,\n  computed,\n  defineComponent,\n  ref,\n  toRef,\n  watch,\n} from 'vue';\n\nimport { useRender } from '../../composables/component';\n\nimport './YDividePanel.scss';\n\nexport const YDividePanel = defineComponent({\n  setup(props, { slots }) {\n    const contentRate = ref(50);\n    const isResizing = ref(false);\n    const secondarySlot = ref();\n    const activeSecondary = ref(false);\n    const rootRef = ref();\n\n    watch(secondarySlot, (neo) => {\n      activeSecondary.value = !!neo;\n    });\n\n    const topStyles = computed<CSSProperties>(() => {\n      let inset = '0 0';\n      if (activeSecondary.value) {\n        inset = `0 0 ${100 - contentRate.value}% 0`;\n      }\n      return {\n        position: 'absolute',\n        inset,\n      };\n    });\n\n    const classes = computed(() => {\n      return {\n        'y-divide-panel': true,\n        'y-divide-panel--resizing': isResizing.value,\n      };\n    });\n\n    function moveListener(event: Event) {\n      const mouseEvent = event as MouseEvent;\n      const containerRect = rootRef.value.getBoundingClientRect();\n      requestAnimationFrame(() => {\n        contentRate.value = Math.min(\n          Math.max(\n            10,\n            ((mouseEvent.clientY - containerRect.y) / containerRect.height) *\n              100,\n          ),\n          90,\n        );\n      });\n    }\n\n    function cancelEvent() {\n      isResizing.value = false;\n      rootRef.value.removeEventListener('mousemove', moveListener);\n      rootRef.value.removeEventListener('mouseup', upListener);\n      rootRef.value.removeEventListener('mouseleave', leaveListener);\n    }\n\n    function upListener(event: Event) {\n      cancelEvent();\n    }\n\n    function leaveListener(event: Event) {\n      cancelEvent();\n    }\n\n    function onMousedown(event: MouseEvent) {\n      event.preventDefault();\n      isResizing.value = true;\n      rootRef.value.addEventListener('mousemove', moveListener);\n      rootRef.value.addEventListener('mouseup', upListener);\n      rootRef.value.addEventListener('mouseleave', leaveListener);\n    }\n\n    useRender(() => {\n      return (\n        <>\n          <div class={classes.value} ref={rootRef}>\n            <div\n              class={'y-divide-panel__top-container'}\n              style={topStyles.value}\n            >\n              {slots.default?.()}\n            </div>\n            {\n              (secondarySlot.value = slots.secondary && (\n                <>\n                  <div\n                    class=\"y-divide-panel__divider\"\n                    style={{\n                      position: 'absolute',\n                      inset: `${contentRate.value}% 0 0 0`,\n                    }}\n                    onMousedown={onMousedown}\n                  >\n                    <div class=\"y-divide-panel__divider-line\"></div>\n                  </div>\n                  <div\n                    class={'y-divide-panel__secondary-container'}\n                    style={{\n                      position: 'absolute',\n                      inset: `${contentRate.value}% 0 0 0`,\n                    }}\n                  >\n                    {slots.secondary?.()}\n                  </div>\n                </>\n              ))\n            }\n          </div>\n        </>\n      );\n    });\n\n    return {\n      activeSecondary,\n    };\n  },\n});\n"],"mappings":"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"}

package/lib/components/panel/YDividePanel.scss

@@ -0,0 +1,43 @@
+$side-padding: 16px !default;
+
+.y-divide-panel {
+  position: relative;
+  height: 100%;
+
+  &--resizing {
+    cursor: ns-resize;
+  }
+
+  &__divider {
+    position: absolute;
+    height: 8px;
+    cursor: ns-resize;
+    z-index: 1;
+    //margin: 0 (-1 * $side-padding);
+
+    &-line {
+      position: absolute;
+      top: 4px;
+      left: 0;
+      right: 0;
+      bottom: 4px;
+      height: 1px;
+      background: #eee;
+    }
+
+    &:hover {
+      background: rgba(var(--y-theme--primary), 0.12);
+    }
+
+    &:hover &-line {
+      background: rgba(var(--y-theme--primary), 1);
+    }
+  }
+
+  &--resizing &__divider {
+    background: rgba(var(--y-theme--primary), 0.12);
+    &-line {
+      background: rgba(var(--y-theme--primary), 1);
+    }
+  }
+}

package/lib/components/panel/index.mjs

@@ -0,0 +1,2 @@
+export * from "./YDividePanel.mjs";
+//# sourceMappingURL=index.mjs.map

package/lib/components/panel/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":[],"sources":["../../../src/components/panel/index.ts"],"sourcesContent":["export * from './YDividePanel';\r\n"],"mappings":""}

package/lib/components/plate/YPlate.mjs

@@ -0,0 +1,27 @@
+import { createVNode as _createVNode } from "vue";
+import { computed, defineComponent } from 'vue';
+import { useRender } from "../../composables/component.mjs";
+import "./YPlate.scss";
+
+/**
+ * # Base Component
+ */
+export const YPlate = defineComponent({
+  name: 'YPlate',
+  props: {
+    variation: Object
+  },
+  setup() {
+    const classes = computed(() => {
+      return {
+        'y-plate': true
+      };
+    });
+    useRender(() => {
+      return _createVNode("div", {
+        "class": classes.value
+      }, null);
+    });
+  }
+});
+//# sourceMappingURL=YPlate.mjs.map

package/lib/components/plate/YPlate.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"YPlate.mjs","names":["computed","defineComponent","useRender","YPlate","name","props","variation","Object","setup","classes","_createVNode","value"],"sources":["../../../src/components/plate/YPlate.tsx"],"sourcesContent":["import { PropType, computed, defineComponent } from 'vue';\n\nimport { useRender } from '../../composables/component';\n\nimport './YPlate.scss';\n\n/**\n * # Base Component\n */\nexport const YPlate = defineComponent({\n  name: 'YPlate',\n  props: {\n    variation: Object as PropType<Record<string, any>>,\n  },\n  setup() {\n    const classes = computed<Record<string, boolean>>(() => {\n      return {\n        'y-plate': true\n      };\n    });\n\n    useRender(() => {\n      return <div class={classes.value}></div>;\n    });\n  },\n});\n\nexport type YPlate = InstanceType<typeof YPlate>;\n"],"mappings":";AAAA,SAAmBA,QAAQ,EAAEC,eAAe,QAAQ,KAAK;AAAC,SAEjDC,SAAS;AAElB;;AAEA;AACA;AACA;AACA,OAAO,MAAMC,MAAM,GAAGF,eAAe,CAAC;EACpCG,IAAI,EAAE,QAAQ;EACdC,KAAK,EAAE;IACLC,SAAS,EAAEC;EACb,CAAC;EACDC,KAAKA,CAAA,EAAG;IACN,MAAMC,OAAO,GAAGT,QAAQ,CAA0B,MAAM;MACtD,OAAO;QACL,SAAS,EAAE;MACb,CAAC;IACH,CAAC,CAAC;IAEFE,SAAS,CAAC,MAAM;MACd,OAAAQ,YAAA;QAAA,SAAmBD,OAAO,CAACE;MAAK;IAClC,CAAC,CAAC;EACJ;AACF,CAAC,CAAC"}

package/lib/components/plate/YPlate.scss

@@ -0,0 +1,9 @@
+.y-plate {
+  pointer-events: none;
+  position: absolute;
+  inset: 0;
+  border-top: 1px solid transparent;
+  contain: paint;
+  border-radius: 8px;
+  outline: 0 solid rgba(0, 0, 0, 0);
+}

package/lib/components/plate/index.mjs

@@ -0,0 +1,2 @@
+export * from "./YPlate.mjs";
+//# sourceMappingURL=index.mjs.map

package/lib/components/plate/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":[],"sources":["../../../src/components/plate/index.ts"],"sourcesContent":["export * from './YPlate';\n"],"mappings":""}

package/lib/components/progress-bar/YProgressBar.mjs

@@ -0,0 +1,110 @@
+import { createTextVNode as _createTextVNode, createVNode as _createVNode } from "vue";
+import { defineComponent } from 'vue';
+import { useProgress } from "../../composables/progress.mjs";
+export const YProgressBar = defineComponent({
+  name: 'YProgressBar',
+  props: {
+    value: {
+      type: Number
+    },
+    rounded: {
+      type: Boolean
+    },
+    height: {
+      type: Number
+    },
+    noRewindTransition: {
+      type: Boolean
+    },
+    outlined: {
+      type: Boolean
+    },
+    innerText: {
+      type: Boolean
+    },
+    textColor: {
+      type: String
+    },
+    outlineColor: {
+      type: String
+    }
+  },
+  setup(props) {
+    const {
+      numValue
+    } = useProgress(props);
+    return {
+      numValue
+    };
+  },
+  data() {
+    return {
+      delta: 0
+    };
+  },
+  computed: {
+    classes() {
+      let noTransition = false;
+      if (this.noRewindTransition && this.delta < 0) {
+        noTransition = true;
+      }
+      return {
+        'y-progress--no-trans': noTransition,
+        'y-progress--outlined': !!this.outlined,
+        'y-progress-bar--rounded': !!this.rounded
+      };
+    },
+    styles() {
+      let minWidth;
+      if (this.innerText && this.numValue < 5 && this.numValue > 0) {
+        minWidth = '2rem';
+      }
+      return {
+        transform: `scaleX(${this.numValue / 100})`,
+        minWidth
+      };
+    }
+  },
+  render() {
+    const {
+      classes,
+      numValue,
+      height,
+      outlineColor,
+      textColor,
+      styles,
+      innerText
+    } = this;
+    const slots = this.$slots;
+    return _createVNode("div", {
+      "class": {
+        'y-progress y-progress-bar': true,
+        ...classes
+      },
+      "role": "progressbar",
+      "aria-valuemin": "0",
+      "aria-valuemax": "100",
+      "aria-valuenow": numValue,
+      "style": {
+        '--y-progress-bar__height': height !== undefined ? `${height}px` : undefined,
+        '--y-progress-bar__outline-color': outlineColor !== undefined ? outlineColor : undefined
+      }
+    }, [_createVNode("div", {
+      "class": "y-progress__track"
+    }, null), _createVNode("div", {
+      "class": "y-progress__tube"
+    }, [_createVNode("div", {
+      "class": "y-progress__lead",
+      "style": styles
+    }, [slots['lead-inner'] ? slots['lead-inner']() : innerText && _createVNode("div", {
+      "class": {
+        'y-progress__lead-inner': true,
+        'y-progress__lead-inner--fixed': numValue < 3
+      },
+      "style": {
+        color: textColor
+      }
+    }, [_createVNode("span", null, [numValue, _createTextVNode(" %")])])])])]);
+  }
+});
+//# sourceMappingURL=YProgressBar.mjs.map

package/lib/components/progress-bar/YProgressBar.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"YProgressBar.mjs","names":["defineComponent","useProgress","YProgressBar","name","props","value","type","Number","rounded","Boolean","height","noRewindTransition","outlined","innerText","textColor","String","outlineColor","setup","numValue","data","delta","computed","classes","noTransition","styles","minWidth","transform","render","slots","$slots","_createVNode","undefined","color","_createTextVNode"],"sources":["../../../src/components/progress-bar/YProgressBar.tsx"],"sourcesContent":["import { PropType, StyleValue, defineComponent } from 'vue';\n\nimport { useProgress } from '../../composables/progress';\n\nexport const YProgressBar = defineComponent({\n  name: 'YProgressBar',\n  props: {\n    value: {\n      type: Number as PropType<number>,\n    },\n    rounded: {\n      type: Boolean as PropType<boolean>,\n    },\n    height: {\n      type: Number as PropType<number>,\n    },\n    noRewindTransition: {\n      type: Boolean as PropType<boolean>,\n    },\n    outlined: {\n      type: Boolean as PropType<boolean>,\n    },\n    innerText: {\n      type: Boolean as PropType<boolean>,\n    },\n    textColor: {\n      type: String as PropType<string>,\n    },\n    outlineColor: {\n      type: String as PropType<string>,\n    },\n  },\n  setup(props) {\n    const { numValue } = useProgress(props);\n\n    return {\n      numValue,\n    };\n  },\n  data() {\n    return {\n      delta: 0,\n    };\n  },\n  computed: {\n    classes(): Record<string, boolean> {\n      let noTransition = false;\n      if (this.noRewindTransition && this.delta < 0) {\n        noTransition = true;\n      }\n      return {\n        'y-progress--no-trans': noTransition,\n        'y-progress--outlined': !!this.outlined,\n        'y-progress-bar--rounded': !!this.rounded,\n      };\n    },\n    styles(): StyleValue {\n      let minWidth;\n      if (this.innerText && this.numValue < 5 && this.numValue > 0) {\n        minWidth = '2rem';\n      }\n      return {\n        transform: `scaleX(${this.numValue / 100})`,\n        minWidth,\n      };\n    },\n  },\n  render() {\n    const {\n      classes,\n      numValue,\n      height,\n      outlineColor,\n      textColor,\n      styles,\n      innerText,\n    } = this;\n    const slots = this.$slots;\n    return (\n      <div\n        class={{ 'y-progress y-progress-bar': true, ...classes }}\n        role=\"progressbar\"\n        aria-valuemin=\"0\"\n        aria-valuemax=\"100\"\n        aria-valuenow={numValue}\n        style={{\n          '--y-progress-bar__height':\n            height !== undefined ? `${height}px` : undefined,\n          '--y-progress-bar__outline-color':\n            outlineColor !== undefined ? outlineColor : undefined,\n        }}\n      >\n        <div class=\"y-progress__track\"></div>\n        <div class=\"y-progress__tube\">\n          <div class=\"y-progress__lead\" style={styles}>\n            {slots['lead-inner']\n              ? slots['lead-inner']()\n              : innerText && (\n                  <div\n                    class={{\n                      'y-progress__lead-inner': true,\n                      'y-progress__lead-inner--fixed': numValue < 3,\n                    }}\n                    style={{ color: textColor }}\n                  >\n                    <span>{numValue} %</span>\n                  </div>\n                )}\n          </div>\n        </div>\n      </div>\n    );\n  },\n});\n"],"mappings":"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"}

package/lib/components/progress-bar/YProgressBar.scss

@@ -0,0 +1,40 @@
+.y-progress {
+  --y-progress-bar__height: 4px;
+
+  display: flex;
+  position: relative;
+  height: var(--y-progress-bar__height, 4px);
+
+  &-bar--rounded {
+    border-radius: calc(var(--y-progress-bar__height) / 2);
+  }
+
+  &--outlined {
+    --y-progress-bar__outline-color: var(--y-palette--primary);
+    border: 1px solid var(--y-progress-bar__outline-color);
+  }
+
+  &__tube {
+    border-radius: inherit;
+    overflow: clip;
+    min-width: 0;
+    flex: 1 1;
+  }
+
+  &__track {
+    background-color: #f0f0f0;
+    position: absolute;
+    inset: 0;
+    border-radius: inherit;
+    overflow: clip;
+  }
+
+  &__lead {
+    width: 100%;
+    height: 100%;
+    background-color: var(--y-palette--primary);
+    position: relative;
+    transform-origin: left;
+    transition: all 250ms cubic-bezier(0.42, 0.5, 0.51, 1.02);
+  }
+}

package/lib/components/progress-bar/index.mjs

@@ -0,0 +1,2 @@
+export * from "./YProgressBar.mjs";
+//# sourceMappingURL=index.mjs.map

package/lib/components/progress-bar/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":[],"sources":["../../../src/components/progress-bar/index.ts"],"sourcesContent":["export * from './YProgressBar';\n"],"mappings":""}