rei-kit 0.3.1 → 0.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/BaseAlert.vue.d.ts +38 -0
- package/dist/components/BaseBadge.vue.d.ts +23 -0
- package/dist/components/BaseCard.vue.d.ts +33 -0
- package/dist/components/ErrorBoundary.vue.d.ts +61 -0
- package/dist/components/PageContainer.vue.d.ts +33 -0
- package/dist/components/ProgressBar.vue.d.ts +18 -0
- package/dist/composables/use-media-query.d.ts +19 -0
- package/dist/index.d.ts +19 -1
- package/dist/index.js +268 -22
- package/dist/index.js.map +1 -1
- package/package.json +5 -3
package/dist/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { n as registerErrorMapper, r as toAppError, t as AppError } from "./app-error-DF9cijE0.js";
|
|
2
|
-
import { Fragment, Teleport, Transition, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createStaticVNode, createTextVNode, createVNode, defineComponent, mergeModels, mergeProps, nextTick, normalizeClass, normalizeStyle, onMounted, onScopeDispose, onUnmounted, openBlock, readonly, ref, renderList, renderSlot, resolveDynamicComponent, toDisplayString, unref, useId, useModel, vModelDynamic, vModelRadio, watch, watchEffect, withCtx, withDirectives } from "vue";
|
|
2
|
+
import { Fragment, Teleport, Transition, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createStaticVNode, createTextVNode, createVNode, defineComponent, mergeModels, mergeProps, nextTick, normalizeClass, normalizeStyle, onBeforeUnmount, onErrorCaptured, onMounted, onScopeDispose, onUnmounted, openBlock, readonly, ref, renderList, renderSlot, resolveDynamicComponent, toDisplayString, unref, useId, useModel, vModelDynamic, vModelRadio, watch, watchEffect, withCtx, withDirectives } from "vue";
|
|
3
3
|
import { ArrowDown, ArrowRight, ArrowUp, ChevronRight, X } from "lucide-vue-next";
|
|
4
4
|
import { RouterLink } from "vue-router";
|
|
5
5
|
import { createI18n } from "vue-i18n";
|
|
@@ -649,6 +649,43 @@ function useDragScroll(target) {
|
|
|
649
649
|
return { didDrag: () => dragged };
|
|
650
650
|
}
|
|
651
651
|
//#endregion
|
|
652
|
+
//#region src/composables/use-media-query.ts
|
|
653
|
+
/**
|
|
654
|
+
* Whether a media query matches, kept up to date.
|
|
655
|
+
*
|
|
656
|
+
* Starts false and resolves on mount, which is deliberate: this is the one
|
|
657
|
+
* place a component is tempted to branch on viewport during render, and doing
|
|
658
|
+
* that under prerendering produces HTML built for a screen the server does not
|
|
659
|
+
* have. Hydration then swaps it and the page jumps. False first, correct a
|
|
660
|
+
* frame later, no jump — and a layout that reads badly at `false` is a layout
|
|
661
|
+
* with a mobile-first bug worth knowing about.
|
|
662
|
+
*
|
|
663
|
+
* Guarded for the server for the same reason the rest of the kit is: this
|
|
664
|
+
* package has to be importable in Node, and `matchMedia` does not exist there.
|
|
665
|
+
*
|
|
666
|
+
* @example
|
|
667
|
+
* ```ts
|
|
668
|
+
* const wide = useMediaQuery('(min-width: 64rem)')
|
|
669
|
+
* ```
|
|
670
|
+
*/
|
|
671
|
+
function useMediaQuery(query) {
|
|
672
|
+
const matches = ref(false);
|
|
673
|
+
let list;
|
|
674
|
+
function update(event) {
|
|
675
|
+
matches.value = event.matches;
|
|
676
|
+
}
|
|
677
|
+
onMounted(() => {
|
|
678
|
+
if (typeof window === "undefined" || typeof window.matchMedia !== "function") return;
|
|
679
|
+
list = window.matchMedia(query);
|
|
680
|
+
update(list);
|
|
681
|
+
list.addEventListener("change", update);
|
|
682
|
+
});
|
|
683
|
+
onBeforeUnmount(() => {
|
|
684
|
+
list?.removeEventListener("change", update);
|
|
685
|
+
});
|
|
686
|
+
return matches;
|
|
687
|
+
}
|
|
688
|
+
//#endregion
|
|
652
689
|
//#region src/composables/use-visual-viewport.ts
|
|
653
690
|
/**
|
|
654
691
|
* Tracks the visual viewport.
|
|
@@ -690,13 +727,83 @@ function useVisualViewport() {
|
|
|
690
727
|
return readonly(rect);
|
|
691
728
|
}
|
|
692
729
|
//#endregion
|
|
730
|
+
//#region src/components/BaseAlert.vue?vue&type=script&setup=true&lang.ts
|
|
731
|
+
var _hoisted_1$17 = ["role", "aria-live"];
|
|
732
|
+
var _hoisted_2$15 = { class: "min-w-0 flex-1" };
|
|
733
|
+
var _hoisted_3$10 = {
|
|
734
|
+
key: 0,
|
|
735
|
+
class: "text-ink font-semibold"
|
|
736
|
+
};
|
|
737
|
+
//#endregion
|
|
738
|
+
//#region src/components/BaseAlert.vue
|
|
739
|
+
var BaseAlert_default = /* @__PURE__ */ defineComponent({
|
|
740
|
+
__name: "BaseAlert",
|
|
741
|
+
props: {
|
|
742
|
+
tone: { default: "info" },
|
|
743
|
+
assertive: {
|
|
744
|
+
type: Boolean,
|
|
745
|
+
default: false
|
|
746
|
+
}
|
|
747
|
+
},
|
|
748
|
+
setup(__props) {
|
|
749
|
+
const TONES = {
|
|
750
|
+
info: "border-hair bg-muted/40 text-ink",
|
|
751
|
+
success: "border-positive/35 bg-positive/8 text-ink",
|
|
752
|
+
warning: "border-warning/40 bg-warning/8 text-ink",
|
|
753
|
+
danger: "border-negative/35 bg-negative/8 text-ink"
|
|
754
|
+
};
|
|
755
|
+
const MARKS = {
|
|
756
|
+
info: "bg-ink-soft/15 text-ink-soft",
|
|
757
|
+
success: "bg-positive/15 text-positive",
|
|
758
|
+
warning: "bg-warning/15 text-warning",
|
|
759
|
+
danger: "bg-negative/15 text-negative"
|
|
760
|
+
};
|
|
761
|
+
const skin = computed(() => TONES[__props.tone]);
|
|
762
|
+
const mark = computed(() => MARKS[__props.tone]);
|
|
763
|
+
return (_ctx, _cache) => {
|
|
764
|
+
return openBlock(), createElementBlock("div", {
|
|
765
|
+
class: normalizeClass(["rounded-card flex items-start gap-3 border px-4 py-3.5 text-sm leading-relaxed", skin.value]),
|
|
766
|
+
role: __props.assertive ? "alert" : "status",
|
|
767
|
+
"aria-live": __props.assertive ? "assertive" : "polite"
|
|
768
|
+
}, [
|
|
769
|
+
_ctx.$slots.mark ? (openBlock(), createElementBlock("span", {
|
|
770
|
+
key: 0,
|
|
771
|
+
class: normalizeClass(["mt-px grid size-6 shrink-0 place-items-center rounded-full text-xs font-semibold", mark.value]),
|
|
772
|
+
"aria-hidden": "true"
|
|
773
|
+
}, [renderSlot(_ctx.$slots, "mark")], 2)) : createCommentVNode("", true),
|
|
774
|
+
createElementVNode("div", _hoisted_2$15, [_ctx.$slots.title ? (openBlock(), createElementBlock("p", _hoisted_3$10, [renderSlot(_ctx.$slots, "title")])) : createCommentVNode("", true), createElementVNode("div", { class: normalizeClass(_ctx.$slots.title ? "mt-1" : "") }, [renderSlot(_ctx.$slots, "default")], 2)]),
|
|
775
|
+
renderSlot(_ctx.$slots, "action")
|
|
776
|
+
], 10, _hoisted_1$17);
|
|
777
|
+
};
|
|
778
|
+
}
|
|
779
|
+
});
|
|
780
|
+
//#endregion
|
|
781
|
+
//#region src/components/BaseBadge.vue
|
|
782
|
+
var BaseBadge_default = /* @__PURE__ */ defineComponent({
|
|
783
|
+
__name: "BaseBadge",
|
|
784
|
+
props: { tone: { default: "neutral" } },
|
|
785
|
+
setup(__props) {
|
|
786
|
+
const TONES = {
|
|
787
|
+
neutral: "bg-muted text-ink-soft",
|
|
788
|
+
primary: "bg-primary/10 text-primary",
|
|
789
|
+
success: "bg-positive/12 text-positive",
|
|
790
|
+
warning: "bg-warning/15 text-warning",
|
|
791
|
+
danger: "bg-negative/12 text-negative"
|
|
792
|
+
};
|
|
793
|
+
const skin = computed(() => TONES[__props.tone]);
|
|
794
|
+
return (_ctx, _cache) => {
|
|
795
|
+
return openBlock(), createElementBlock("span", { class: normalizeClass(["rounded-cell inline-flex items-center gap-1 px-2.5 py-1 text-xs font-medium whitespace-nowrap", skin.value]) }, [renderSlot(_ctx.$slots, "default")], 2);
|
|
796
|
+
};
|
|
797
|
+
}
|
|
798
|
+
});
|
|
799
|
+
//#endregion
|
|
693
800
|
//#region src/components/BaseButton.vue?vue&type=script&setup=true&lang.ts
|
|
694
|
-
var _hoisted_1$
|
|
801
|
+
var _hoisted_1$16 = [
|
|
695
802
|
"type",
|
|
696
803
|
"disabled",
|
|
697
804
|
"aria-busy"
|
|
698
805
|
];
|
|
699
|
-
var _hoisted_2$
|
|
806
|
+
var _hoisted_2$14 = {
|
|
700
807
|
key: 0,
|
|
701
808
|
class: "size-4 animate-spin rounded-full border-2 border-current border-t-transparent",
|
|
702
809
|
"aria-hidden": "true"
|
|
@@ -734,15 +841,15 @@ var BaseButton_default = /* @__PURE__ */ defineComponent({
|
|
|
734
841
|
disabled: __props.disabled || __props.loading,
|
|
735
842
|
"aria-busy": __props.loading,
|
|
736
843
|
class: normalizeClass(["rounded-card focus-visible:outline-primary inline-flex items-center justify-center gap-2 font-medium transition-transform duration-100 select-none focus-visible:outline-2 focus-visible:outline-offset-2 active:scale-95 disabled:pointer-events-none disabled:opacity-50", [VARIANT_CLASS[__props.variant], SIZE_CLASS[__props.size]]])
|
|
737
|
-
}, [__props.loading ? (openBlock(), createElementBlock("span", _hoisted_2$
|
|
844
|
+
}, [__props.loading ? (openBlock(), createElementBlock("span", _hoisted_2$14)) : createCommentVNode("", true), renderSlot(_ctx.$slots, "default")], 10, _hoisted_1$16);
|
|
738
845
|
};
|
|
739
846
|
}
|
|
740
847
|
});
|
|
741
848
|
//#endregion
|
|
742
849
|
//#region src/components/BaseInput.vue?vue&type=script&setup=true&lang.ts
|
|
743
|
-
var _hoisted_1$
|
|
744
|
-
var _hoisted_2$
|
|
745
|
-
var _hoisted_3$
|
|
850
|
+
var _hoisted_1$15 = { class: "flex flex-col gap-1.5" };
|
|
851
|
+
var _hoisted_2$13 = ["for"];
|
|
852
|
+
var _hoisted_3$9 = [
|
|
746
853
|
"id",
|
|
747
854
|
"type",
|
|
748
855
|
"aria-invalid",
|
|
@@ -777,18 +884,18 @@ var BaseInput_default = /* @__PURE__ */ defineComponent({
|
|
|
777
884
|
if (__props.hint) return hintId;
|
|
778
885
|
});
|
|
779
886
|
return (_ctx, _cache) => {
|
|
780
|
-
return openBlock(), createElementBlock("div", _hoisted_1$
|
|
887
|
+
return openBlock(), createElementBlock("div", _hoisted_1$15, [
|
|
781
888
|
createElementVNode("label", {
|
|
782
889
|
for: unref(id),
|
|
783
890
|
class: normalizeClass(["text-ink text-sm font-medium", __props.labelHidden ? "sr-only" : ""])
|
|
784
|
-
}, toDisplayString(__props.label), 11, _hoisted_2$
|
|
891
|
+
}, toDisplayString(__props.label), 11, _hoisted_2$13),
|
|
785
892
|
withDirectives(createElementVNode("input", mergeProps({
|
|
786
893
|
id: unref(id),
|
|
787
894
|
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => model.value = $event),
|
|
788
895
|
type: __props.type,
|
|
789
896
|
"aria-invalid": Boolean(__props.error),
|
|
790
897
|
"aria-describedby": describedBy.value
|
|
791
|
-
}, _ctx.$attrs, { class: ["border-hair bg-surface text-ink rounded-card focus-visible:outline-primary h-11 border px-3 focus-visible:outline-2 focus-visible:outline-offset-1", __props.error ? "border-negative" : ""] }), null, 16, _hoisted_3$
|
|
898
|
+
}, _ctx.$attrs, { class: ["border-hair bg-surface text-ink rounded-card focus-visible:outline-primary h-11 border px-3 focus-visible:outline-2 focus-visible:outline-offset-1", __props.error ? "border-negative" : ""] }), null, 16, _hoisted_3$9), [[vModelDynamic, model.value]]),
|
|
792
899
|
__props.error ? (openBlock(), createElementBlock("p", {
|
|
793
900
|
key: 0,
|
|
794
901
|
id: errorId,
|
|
@@ -804,9 +911,9 @@ var BaseInput_default = /* @__PURE__ */ defineComponent({
|
|
|
804
911
|
});
|
|
805
912
|
//#endregion
|
|
806
913
|
//#region src/components/BaseSheet.vue?vue&type=script&setup=true&lang.ts
|
|
807
|
-
var _hoisted_1$
|
|
808
|
-
var _hoisted_2$
|
|
809
|
-
var _hoisted_3$
|
|
914
|
+
var _hoisted_1$14 = { class: "shell-frame md:rounded-shell relative flex max-h-full flex-col justify-end overflow-hidden" };
|
|
915
|
+
var _hoisted_2$12 = ["aria-label"];
|
|
916
|
+
var _hoisted_3$8 = { class: "flex shrink-0 items-start gap-3 px-6 pt-4 pb-5" };
|
|
810
917
|
var _hoisted_4$6 = { class: "min-w-0 flex-1" };
|
|
811
918
|
var _hoisted_5$4 = { class: "text-ink text-xl leading-tight font-semibold" };
|
|
812
919
|
var _hoisted_6$2 = {
|
|
@@ -885,7 +992,7 @@ var BaseSheet_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ define
|
|
|
885
992
|
key: 0,
|
|
886
993
|
class: "fixed inset-x-0 top-0 bottom-0 z-50 flex items-center justify-center",
|
|
887
994
|
style: normalizeStyle(viewportStyle.value)
|
|
888
|
-
}, [createElementVNode("div", _hoisted_1$
|
|
995
|
+
}, [createElementVNode("div", _hoisted_1$14, [createElementVNode("div", {
|
|
889
996
|
class: "bg-ink/45 absolute inset-0 backdrop-blur-[2px]",
|
|
890
997
|
onClick: close
|
|
891
998
|
}), createElementVNode("section", {
|
|
@@ -901,14 +1008,14 @@ var BaseSheet_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ define
|
|
|
901
1008
|
class: "flex shrink-0 justify-center pt-3",
|
|
902
1009
|
"aria-hidden": "true"
|
|
903
1010
|
}, [createElementVNode("span", { class: "bg-hair h-1.5 w-10 rounded-full" })], -1)),
|
|
904
|
-
createElementVNode("header", _hoisted_3$
|
|
1011
|
+
createElementVNode("header", _hoisted_3$8, [createElementVNode("div", _hoisted_4$6, [createElementVNode("h2", _hoisted_5$4, toDisplayString(__props.title), 1), __props.subtitle ? (openBlock(), createElementBlock("p", _hoisted_6$2, toDisplayString(__props.subtitle), 1)) : createCommentVNode("", true)]), createElementVNode("button", {
|
|
905
1012
|
type: "button",
|
|
906
1013
|
class: "text-ink-soft hover:bg-muted hover:text-ink -mt-1 flex size-10 shrink-0 items-center justify-center rounded-full transition-colors active:scale-90",
|
|
907
1014
|
"aria-label": __props.closeLabel,
|
|
908
1015
|
onClick: close
|
|
909
1016
|
}, [createVNode(unref(X), { class: "size-5" })], 8, _hoisted_7$2)]),
|
|
910
1017
|
createElementVNode("div", _hoisted_8$1, [renderSlot(_ctx.$slots, "default", {}, void 0, true)])
|
|
911
|
-
], 8, _hoisted_2$
|
|
1018
|
+
], 8, _hoisted_2$12)])], 4)) : createCommentVNode("", true)]),
|
|
912
1019
|
_: 3
|
|
913
1020
|
})]);
|
|
914
1021
|
};
|
|
@@ -925,8 +1032,55 @@ var _plugin_vue_export_helper_default = (sfc, props) => {
|
|
|
925
1032
|
//#region src/components/BaseSheet.vue
|
|
926
1033
|
var BaseSheet_default = /*#__PURE__*/ _plugin_vue_export_helper_default(BaseSheet_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-3f2e9ce4"]]);
|
|
927
1034
|
//#endregion
|
|
1035
|
+
//#region src/components/BaseCard.vue?vue&type=script&setup=true&lang.ts
|
|
1036
|
+
var _hoisted_1$13 = {
|
|
1037
|
+
key: 0,
|
|
1038
|
+
class: "border-hair/70 border-b px-5 py-4"
|
|
1039
|
+
};
|
|
1040
|
+
var _hoisted_2$11 = { class: "px-5 py-4" };
|
|
1041
|
+
var _hoisted_3$7 = {
|
|
1042
|
+
key: 1,
|
|
1043
|
+
class: "border-hair/70 bg-muted/30 border-t px-5 py-3.5"
|
|
1044
|
+
};
|
|
1045
|
+
//#endregion
|
|
1046
|
+
//#region src/components/BaseCard.vue
|
|
1047
|
+
var BaseCard_default = /* @__PURE__ */ defineComponent({
|
|
1048
|
+
__name: "BaseCard",
|
|
1049
|
+
props: {
|
|
1050
|
+
interactive: {
|
|
1051
|
+
type: Boolean,
|
|
1052
|
+
default: false
|
|
1053
|
+
},
|
|
1054
|
+
as: { default: "div" }
|
|
1055
|
+
},
|
|
1056
|
+
setup(__props) {
|
|
1057
|
+
/**
|
|
1058
|
+
* A surface with a border, and optionally a head and a foot.
|
|
1059
|
+
*
|
|
1060
|
+
* Every app here had written this div. That is not a crisis on its own — it is
|
|
1061
|
+
* four classes — but it is four classes that were slightly different in each,
|
|
1062
|
+
* so a card on one screen had a heavier border than a card on the next and
|
|
1063
|
+
* nobody could say why.
|
|
1064
|
+
*
|
|
1065
|
+
* `interactive` is for a card that is a link or a button: it adds the lift and
|
|
1066
|
+
* the press, and it is opt-in because a card holding a form should not move
|
|
1067
|
+
* when the pointer crosses it.
|
|
1068
|
+
*/
|
|
1069
|
+
return (_ctx, _cache) => {
|
|
1070
|
+
return openBlock(), createBlock(resolveDynamicComponent(__props.as), { class: normalizeClass(["border-hair bg-surface rounded-card border", __props.interactive ? "transition-[transform,box-shadow] duration-300 ease-out hover:-translate-y-0.5 hover:shadow-lg active:translate-y-0 active:shadow-sm" : ""]) }, {
|
|
1071
|
+
default: withCtx(() => [
|
|
1072
|
+
_ctx.$slots.head ? (openBlock(), createElementBlock("div", _hoisted_1$13, [renderSlot(_ctx.$slots, "head")])) : createCommentVNode("", true),
|
|
1073
|
+
createElementVNode("div", _hoisted_2$11, [renderSlot(_ctx.$slots, "default")]),
|
|
1074
|
+
_ctx.$slots.foot ? (openBlock(), createElementBlock("div", _hoisted_3$7, [renderSlot(_ctx.$slots, "foot")])) : createCommentVNode("", true)
|
|
1075
|
+
]),
|
|
1076
|
+
_: 3
|
|
1077
|
+
}, 8, ["class"]);
|
|
1078
|
+
};
|
|
1079
|
+
}
|
|
1080
|
+
});
|
|
1081
|
+
//#endregion
|
|
928
1082
|
//#region src/components/EmptyState.vue?vue&type=script&setup=true&lang.ts
|
|
929
|
-
var _hoisted_1$
|
|
1083
|
+
var _hoisted_1$12 = { class: "flex flex-col items-center gap-3 px-6 py-10 text-center" };
|
|
930
1084
|
var _hoisted_2$10 = {
|
|
931
1085
|
key: 0,
|
|
932
1086
|
class: "bg-muted text-primary rounded-card flex size-12 items-center justify-center"
|
|
@@ -950,7 +1104,7 @@ var EmptyState_default = /* @__PURE__ */ defineComponent({
|
|
|
950
1104
|
},
|
|
951
1105
|
setup(__props) {
|
|
952
1106
|
return (_ctx, _cache) => {
|
|
953
|
-
return openBlock(), createElementBlock("div", _hoisted_1$
|
|
1107
|
+
return openBlock(), createElementBlock("div", _hoisted_1$12, [
|
|
954
1108
|
_ctx.$slots.icon ? (openBlock(), createElementBlock("div", _hoisted_2$10, [renderSlot(_ctx.$slots, "icon")])) : createCommentVNode("", true),
|
|
955
1109
|
createElementVNode("h3", _hoisted_3$6, toDisplayString(__props.title), 1),
|
|
956
1110
|
__props.description ? (openBlock(), createElementBlock("p", _hoisted_4$5, toDisplayString(__props.description), 1)) : createCommentVNode("", true),
|
|
@@ -960,8 +1114,57 @@ var EmptyState_default = /* @__PURE__ */ defineComponent({
|
|
|
960
1114
|
}
|
|
961
1115
|
});
|
|
962
1116
|
//#endregion
|
|
1117
|
+
//#region src/components/ErrorBoundary.vue
|
|
1118
|
+
var ErrorBoundary_default = /* @__PURE__ */ defineComponent({
|
|
1119
|
+
__name: "ErrorBoundary",
|
|
1120
|
+
props: { resetKey: {} },
|
|
1121
|
+
emits: ["error"],
|
|
1122
|
+
setup(__props, { emit: __emit }) {
|
|
1123
|
+
const emit = __emit;
|
|
1124
|
+
const failed = ref(null);
|
|
1125
|
+
function reset() {
|
|
1126
|
+
failed.value = null;
|
|
1127
|
+
}
|
|
1128
|
+
onErrorCaptured((cause) => {
|
|
1129
|
+
failed.value = cause;
|
|
1130
|
+
emit("error", cause);
|
|
1131
|
+
return false;
|
|
1132
|
+
});
|
|
1133
|
+
watch(() => __props.resetKey, () => reset());
|
|
1134
|
+
return (_ctx, _cache) => {
|
|
1135
|
+
return failed.value ? renderSlot(_ctx.$slots, "fallback", {
|
|
1136
|
+
error: failed.value,
|
|
1137
|
+
reset
|
|
1138
|
+
}, void 0, void 0, 0) : renderSlot(_ctx.$slots, "default", {}, void 0, void 0, 1);
|
|
1139
|
+
};
|
|
1140
|
+
}
|
|
1141
|
+
});
|
|
1142
|
+
//#endregion
|
|
1143
|
+
//#region src/components/PageContainer.vue
|
|
1144
|
+
var PageContainer_default = /* @__PURE__ */ defineComponent({
|
|
1145
|
+
__name: "PageContainer",
|
|
1146
|
+
props: {
|
|
1147
|
+
width: { default: "wide" },
|
|
1148
|
+
as: { default: "div" }
|
|
1149
|
+
},
|
|
1150
|
+
setup(__props) {
|
|
1151
|
+
const WIDTHS = {
|
|
1152
|
+
wide: "max-w-[75rem]",
|
|
1153
|
+
reading: "max-w-[68ch]",
|
|
1154
|
+
full: ""
|
|
1155
|
+
};
|
|
1156
|
+
const measure = computed(() => WIDTHS[__props.width]);
|
|
1157
|
+
return (_ctx, _cache) => {
|
|
1158
|
+
return openBlock(), createBlock(resolveDynamicComponent(__props.as), { class: normalizeClass(["mx-auto w-full px-5 sm:px-8", measure.value]) }, {
|
|
1159
|
+
default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
|
|
1160
|
+
_: 3
|
|
1161
|
+
}, 8, ["class"]);
|
|
1162
|
+
};
|
|
1163
|
+
}
|
|
1164
|
+
});
|
|
1165
|
+
//#endregion
|
|
963
1166
|
//#region src/components/PageHeader.vue?vue&type=script&setup=true&lang.ts
|
|
964
|
-
var _hoisted_1$
|
|
1167
|
+
var _hoisted_1$11 = { class: "grid h-12 shrink-0 grid-cols-[2.5rem_1fr_2.5rem] items-center" };
|
|
965
1168
|
var _hoisted_2$9 = { class: "justify-self-start" };
|
|
966
1169
|
var _hoisted_3$5 = { class: "text-ink flex min-w-0 justify-center text-base font-semibold tabular-nums" };
|
|
967
1170
|
var _hoisted_4$4 = { class: "truncate" };
|
|
@@ -973,7 +1176,7 @@ var PageHeader_default = /* @__PURE__ */ defineComponent({
|
|
|
973
1176
|
props: { title: {} },
|
|
974
1177
|
setup(__props) {
|
|
975
1178
|
return (_ctx, _cache) => {
|
|
976
|
-
return openBlock(), createElementBlock("header", _hoisted_1$
|
|
1179
|
+
return openBlock(), createElementBlock("header", _hoisted_1$11, [
|
|
977
1180
|
createElementVNode("div", _hoisted_2$9, [renderSlot(_ctx.$slots, "left")]),
|
|
978
1181
|
createElementVNode("h1", _hoisted_3$5, [renderSlot(_ctx.$slots, "title", {}, () => [createElementVNode("span", _hoisted_4$4, toDisplayString(__props.title), 1)])]),
|
|
979
1182
|
createElementVNode("div", _hoisted_5$2, [renderSlot(_ctx.$slots, "right")])
|
|
@@ -982,6 +1185,38 @@ var PageHeader_default = /* @__PURE__ */ defineComponent({
|
|
|
982
1185
|
}
|
|
983
1186
|
});
|
|
984
1187
|
//#endregion
|
|
1188
|
+
//#region src/components/ProgressBar.vue?vue&type=script&setup=true&lang.ts
|
|
1189
|
+
var _hoisted_1$10 = ["aria-valuenow", "aria-label"];
|
|
1190
|
+
//#endregion
|
|
1191
|
+
//#region src/components/ProgressBar.vue
|
|
1192
|
+
var ProgressBar_default = /* @__PURE__ */ defineComponent({
|
|
1193
|
+
__name: "ProgressBar",
|
|
1194
|
+
props: {
|
|
1195
|
+
value: {},
|
|
1196
|
+
max: { default: 100 },
|
|
1197
|
+
label: {}
|
|
1198
|
+
},
|
|
1199
|
+
setup(__props) {
|
|
1200
|
+
const portion = computed(() => {
|
|
1201
|
+
if (!Number.isFinite(__props.value) || !Number.isFinite(__props.max) || __props.max <= 0) return 0;
|
|
1202
|
+
return Math.min(100, Math.max(0, __props.value / __props.max * 100));
|
|
1203
|
+
});
|
|
1204
|
+
return (_ctx, _cache) => {
|
|
1205
|
+
return openBlock(), createElementBlock("div", {
|
|
1206
|
+
class: "bg-muted h-1.5 w-full overflow-hidden rounded-full",
|
|
1207
|
+
role: "progressbar",
|
|
1208
|
+
"aria-valuenow": Math.round(portion.value),
|
|
1209
|
+
"aria-valuemin": "0",
|
|
1210
|
+
"aria-valuemax": "100",
|
|
1211
|
+
"aria-label": __props.label
|
|
1212
|
+
}, [createElementVNode("div", {
|
|
1213
|
+
class: "bg-primary h-full rounded-full transition-[width] duration-700 ease-out",
|
|
1214
|
+
style: normalizeStyle({ width: `${portion.value}%` })
|
|
1215
|
+
}, null, 4)], 8, _hoisted_1$10);
|
|
1216
|
+
};
|
|
1217
|
+
}
|
|
1218
|
+
});
|
|
1219
|
+
//#endregion
|
|
985
1220
|
//#region src/components/PriceCard.vue?vue&type=script&setup=true&lang.ts
|
|
986
1221
|
var _hoisted_1$9 = {
|
|
987
1222
|
key: 0,
|
|
@@ -1536,8 +1771,19 @@ function createI18nRuntime(options) {
|
|
|
1536
1771
|
*
|
|
1537
1772
|
* @see https://github.com/ramazandogna/rei-kit
|
|
1538
1773
|
*/
|
|
1539
|
-
|
|
1774
|
+
/**
|
|
1775
|
+
* The published version, replaced at build time from `package.json`.
|
|
1776
|
+
*
|
|
1777
|
+
* It was a literal `'0.0.0'` and nothing ever rewrote it, so every consumer
|
|
1778
|
+
* that imported this — and the showcase, which is how it was noticed — was
|
|
1779
|
+
* told the kit was at 0.0.0 whatever it actually was. A symbol in a public API
|
|
1780
|
+
* that reports something false is worse than one that is missing: nobody
|
|
1781
|
+
* checks a value that looks like it works.
|
|
1782
|
+
*
|
|
1783
|
+
* The fallback keeps `vitest` and `vite dev` honest, where no define runs.
|
|
1784
|
+
*/
|
|
1785
|
+
var VERSION = "0.4.0";
|
|
1540
1786
|
//#endregion
|
|
1541
|
-
export { AppError, BaseButton_default as BaseButton, BaseInput_default as BaseInput, BaseSheet_default as BaseSheet, EmptyState_default as EmptyState, GoogleButton_default as GoogleButton, LocaleLinks_default as LocaleLinks, PageHeader_default as PageHeader, PriceCard_default as PriceCard, SectionHeading_default as SectionHeading, SegmentedControl_default as SegmentedControl, SettingsGroup_default as SettingsGroup, SettingsRow_default as SettingsRow, SkeletonList_default as SkeletonList, StatCard_default as StatCard, TabBar_default as TabBar, ToneDot_default as ToneDot, VERSION, addDays, applyTheme, createI18nRuntime, downloadJson, eachDayOfYear, formatDate, fromDateKey, isApplePortable, isInstalled, isThemePreference, lastNDays, leadingBlanks, needsIosInstall, readStoredTheme, registerErrorMapper, relativeDayLabel, safeRedirect, setFormatLocale, setThemeStorageKey, startOfWeek, tapFeedback, toAppError, toDateKey, todayKey, useDebouncedCallback, useDragScroll, useOnline, useTheme, useToday, useVisualViewport };
|
|
1787
|
+
export { AppError, BaseAlert_default as BaseAlert, BaseBadge_default as BaseBadge, BaseButton_default as BaseButton, BaseCard_default as BaseCard, BaseInput_default as BaseInput, BaseSheet_default as BaseSheet, EmptyState_default as EmptyState, ErrorBoundary_default as ErrorBoundary, GoogleButton_default as GoogleButton, LocaleLinks_default as LocaleLinks, PageContainer_default as PageContainer, PageHeader_default as PageHeader, PriceCard_default as PriceCard, ProgressBar_default as ProgressBar, SectionHeading_default as SectionHeading, SegmentedControl_default as SegmentedControl, SettingsGroup_default as SettingsGroup, SettingsRow_default as SettingsRow, SkeletonList_default as SkeletonList, StatCard_default as StatCard, TabBar_default as TabBar, ToneDot_default as ToneDot, VERSION, addDays, applyTheme, createI18nRuntime, downloadJson, eachDayOfYear, formatDate, fromDateKey, isApplePortable, isInstalled, isThemePreference, lastNDays, leadingBlanks, needsIosInstall, readStoredTheme, registerErrorMapper, relativeDayLabel, safeRedirect, setFormatLocale, setThemeStorageKey, startOfWeek, tapFeedback, toAppError, toDateKey, todayKey, useDebouncedCallback, useDragScroll, useMediaQuery, useOnline, useTheme, useToday, useVisualViewport };
|
|
1542
1788
|
|
|
1543
1789
|
//# sourceMappingURL=index.js.map
|