rei-kit 0.9.0 → 0.10.0

package/dist/components/BaseInput.vue.d.ts

@@ -8,9 +8,28 @@ type __VLS_Props = {
      * leave the input with no accessible name at all.
      */
     labelHidden?: boolean | undefined;
-    type?: 'text' | 'email' | 'password' | 'number' | undefined;
+    /**
+     * Every type a text field can be, because the ones missing were the ones
+     * apps needed: `date` and `search` were hand-written three times each and
+     * `url` twice, in files that already imported this component.
+     */
+    type?: 'text' | 'email' | 'password' | 'number' | 'search' | 'tel' | 'url' | 'date' | 'time' | 'datetime-local' | undefined;
     /** `sm` for a field inside a row rather than in a form of its own. */
     size?: 'sm' | 'md' | undefined;
+    /**
+     * `unstyled` keeps the wiring and drops the surface.
+     *
+     * The label, the generated id, `aria-describedby` and the error are what a
+     * field is; the border and the height are what it looks like. A search box
+     * inside a bordered row, a url field in an editor popover — those places
+     * were hand-writing the whole thing to avoid the appearance, and losing the
+     * wiring with it.
+     *
+     * The same reasoning as `BaseButton`'s `unstyled`, and the same test: a
+     * primitive is finished when the app can take its behaviour without its
+     * paint.
+     */
+    variant?: 'default' | 'unstyled' | undefined;
 };
 type __VLS_ModelProps = {
     modelValue?: string | undefined;

package/dist/components/BaseSelect.vue.d.ts

@@ -22,6 +22,20 @@ declare const __VLS_export: <T extends string | number>(__VLS_props: NonNullable
          * Every hand-written select across the three consuming apps was this one.
          */
         size?: "sm" | "md" | undefined;
+        /**
+         * `unstyled` keeps the wiring and drops the surface.
+         *
+         * The label, the generated id, `aria-describedby` and the error are what a
+         * field is; the border and the height are what it looks like. A search box
+         * inside a bordered row, a url field in an editor popover — those places
+         * were hand-writing the whole thing to avoid the appearance, and losing the
+         * wiring with it.
+         *
+         * The same reasoning as `BaseButton`'s `unstyled`, and the same test: a
+         * primitive is finished when the app can take its behaviour without its
+         * paint.
+         */
+        variant?: "default" | "unstyled" | undefined;
     } & {
         modelValue?: T | undefined;
     }) & {

package/dist/components/BaseTextarea.vue.d.ts

@@ -4,8 +4,27 @@ type __VLS_Props = {
     hint?: string | undefined;
     labelHidden?: boolean | undefined;
     rows?: number | undefined;
-    /** `sm` for editing in place, inside a row that is already small. */
+    /**
+     * `sm` tightens the label and the spacing. It does **not** shrink the text:
+     * iOS zooms the viewport when it focuses a field under 16px and never zooms
+     * back, which is why both phone apps force 16px on form elements in their
+     * base layer.
+     */
     size?: 'sm' | 'md' | undefined;
+    /**
+     * `unstyled` keeps the wiring and drops the surface.
+     *
+     * The label, the generated id, `aria-describedby` and the error are what a
+     * field is; the border and the height are what it looks like. A search box
+     * inside a bordered row, a url field in an editor popover — those places
+     * were hand-writing the whole thing to avoid the appearance, and losing the
+     * wiring with it.
+     *
+     * The same reasoning as `BaseButton`'s `unstyled`, and the same test: a
+     * primitive is finished when the app can take its behaviour without its
+     * paint.
+     */
+    variant?: 'default' | 'unstyled' | undefined;
 };
 type __VLS_ModelProps = {
     modelValue?: string | undefined;

package/dist/index.js

@@ -1093,6 +1093,7 @@ var _hoisted_1$20 = [
 	"aria-invalid",
 	"aria-describedby"
 ];
+var CONTROL_CLASS = "h-11 text-base";
 //#endregion
 //#region src/components/BaseInput.vue
 var BaseInput_default = /* @__PURE__ */ defineComponent({
@@ -1107,17 +1108,14 @@ var BaseInput_default = /* @__PURE__ */ defineComponent({
 			default: false
 		},
 		type: { default: "text" },
-		size: { default: "md" }
+		size: { default: "md" },
+		variant: { default: "default" }
 	}, {
 		"modelValue": {},
 		"modelModifiers": {}
 	}),
 	emits: ["update:modelValue"],
 	setup(__props) {
-		const SIZE_CLASS = {
-			sm: "h-11 text-sm",
-			md: "h-11 text-base"
-		};
 		const model = useModel(__props, "modelValue");
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(FormField_default, {
@@ -1133,7 +1131,11 @@ var BaseInput_default = /* @__PURE__ */ defineComponent({
 					type: __props.type,
 					"aria-invalid": invalid,
 					"aria-describedby": describedBy
-				}, _ctx.$attrs, { class: ["border-hair bg-surface text-ink rounded-card focus-visible:outline-primary border px-3 focus-visible:outline-2 focus-visible:outline-offset-1", [SIZE_CLASS[__props.size], invalid ? "border-negative" : ""]] }), null, 16, _hoisted_1$20), [[vModelDynamic, model.value]])]),
+				}, _ctx.$attrs, { class: [
+					__props.variant === "unstyled" ? "" : "border-hair bg-surface text-ink rounded-card focus-visible:outline-primary border px-3 focus-visible:outline-2 focus-visible:outline-offset-1",
+					__props.variant === "unstyled" ? "text-base" : CONTROL_CLASS,
+					__props.variant !== "unstyled" && invalid ? "border-negative" : ""
+				] }), null, 16, _hoisted_1$20), [[vModelDynamic, model.value]])]),
 				_: 1
 			}, 8, [
 				"label",
@@ -1476,7 +1478,8 @@ var BaseSelect_default = /* @__PURE__ */ defineComponent({
 			default: false
 		},
 		placeholder: { default: "" },
-		size: { default: "md" }
+		size: { default: "md" },
+		variant: { default: "default" }
 	}, {
 		"modelValue": {},
 		"modelModifiers": {}
@@ -1501,7 +1504,11 @@ var BaseSelect_default = /* @__PURE__ */ defineComponent({
 					"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => model.value = $event),
 					"aria-invalid": invalid,
 					"aria-describedby": describedBy,
-					class: normalizeClass(["border-hair bg-surface text-ink rounded-card focus-visible:outline-primary w-full appearance-none border py-0 pr-10 pl-3 focus-visible:outline-2 focus-visible:outline-offset-1", [SIZE_CLASS[__props.size], invalid ? "border-negative" : ""]])
+					class: normalizeClass(["w-full appearance-none", [
+						__props.variant === "unstyled" ? "" : "border-hair bg-surface text-ink rounded-card focus-visible:outline-primary border py-0 pr-10 pl-3 focus-visible:outline-2 focus-visible:outline-offset-1",
+						__props.variant === "unstyled" ? "" : SIZE_CLASS[__props.size],
+						__props.variant !== "unstyled" && invalid ? "border-negative" : ""
+					]])
 				}, [__props.placeholder ? (openBlock(), createElementBlock("option", _hoisted_3$7, toDisplayString(__props.placeholder), 1)) : createCommentVNode("", true), (openBlock(true), createElementBlock(Fragment, null, renderList(__props.options, (option) => {
 					return openBlock(), createElementBlock("option", {
 						key: option.value,
@@ -1545,7 +1552,8 @@ var BaseTextarea_default = /* @__PURE__ */ defineComponent({
 			default: false
 		},
 		rows: { default: 4 },
-		size: { default: "md" }
+		size: { default: "md" },
+		variant: { default: "default" }
 	}, {
 		"modelValue": {},
 		"modelModifiers": {}
@@ -1567,7 +1575,11 @@ var BaseTextarea_default = /* @__PURE__ */ defineComponent({
 					rows: __props.rows,
 					"aria-invalid": invalid,
 					"aria-describedby": describedBy
-				}, _ctx.$attrs, { class: ["border-hair bg-surface text-ink rounded-card focus-visible:outline-primary resize-y border px-3 py-2 leading-relaxed focus-visible:outline-2 focus-visible:outline-offset-1", [__props.size === "sm" ? "text-sm" : "text-base", invalid ? "border-negative" : ""]] }), null, 16, _hoisted_1$14), [[vModelText, model.value]])]),
+				}, _ctx.$attrs, { class: [
+					__props.variant === "unstyled" ? "" : "border-hair bg-surface text-ink rounded-card focus-visible:outline-primary resize-y border px-3 py-2 leading-relaxed focus-visible:outline-2 focus-visible:outline-offset-1",
+					"text-base",
+					__props.variant !== "unstyled" && invalid ? "border-negative" : ""
+				] }), null, 16, _hoisted_1$14), [[vModelText, model.value]])]),
 				_: 1
 			}, 8, [
 				"label",
@@ -2385,7 +2397,7 @@ function createI18nRuntime(options) {
 *
 * The fallback keeps `vitest` and `vite dev` honest, where no define runs.
 */
-var VERSION = "0.9.0";
+var VERSION = "0.10.0";
 //#endregion
 export { AppError, BaseAlert_default as BaseAlert, BaseBadge_default as BaseBadge, BaseButton_default as BaseButton, BaseCard_default as BaseCard, BaseCheckbox_default as BaseCheckbox, BaseInput_default as BaseInput, BaseRadioGroup_default as BaseRadioGroup, BaseSelect_default as BaseSelect, BaseSheet_default as BaseSheet, BaseTextarea_default as BaseTextarea, EmptyState_default as EmptyState, ErrorBoundary_default as ErrorBoundary, FormField_default as FormField, 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, ToastHost_default as ToastHost, 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, useToast, useToday, useVisualViewport };