rei-kit 3.5.0 → 3.6.0

package/README.md

@@ -66,7 +66,7 @@ demonstrates both, including the one that does not work.
 
 ### 2. The smallest of six, measured, with the trade stated
 
-At ten components — a real screen — **31.7 KB against 104 to 195** for the
+At ten components — a real screen — **31.8 KB against 104 to 195** for the
 five kits measured beside it. The gap is not the total, it is the slope:
 seven components past the first three cost this kit 5 KB and cost them 60 to
 125, because the stylesheet here is flat and theirs is inside the JavaScript.
@@ -165,7 +165,7 @@ app, and the case *least* favourable to this kit:
 
 | Kit                  |         JS |         CSS |       Total |
 | -------------------- | ---------: | ----------: | ----------: |
-| **rei-kit 3.5.0**    | **3.7 KB** | **23.1 KB** | **26.8 KB** |
+| **rei-kit 3.6.0**    | **3.7 KB** | **23.1 KB** | **26.8 KB** |
 | element-plus 2.14.6  |    27.3 KB |      6.0 KB |     33.3 KB |
 | naive-ui 2.45.3      |    51.2 KB |           — |     51.2 KB |
 | primevue 5.0.1       |    53.6 KB |           — |     53.6 KB |
@@ -177,7 +177,7 @@ a data table, a tooltip and a card. A screen rather than a demo:
 
 | Kit                  |         JS |         CSS |        Total |
 | -------------------- | ---------: | ----------: | -----------: |
-| **rei-kit 3.5.0**    | **8.6 KB** | **23.1 KB** | **31.7 KB**  |
+| **rei-kit 3.6.0**    | **8.6 KB** | **23.1 KB** | **31.8 KB**  |
 | element-plus 2.14.6  |    90.1 KB |     14.0 KB |    104.1 KB  |
 | naive-ui 2.45.3      |   132.4 KB |           — |    132.4 KB  |
 | primevue 5.0.1       |   135.8 KB |           — |    135.8 KB  |
@@ -185,7 +185,7 @@ a data table, a tooltip and a card. A screen rather than a demo:
 | ant-design-vue 4.2.6 |   195.4 KB |           — |    195.4 KB  |
 
 **The slope is the point, not the total.** Seven more components cost this kit
-**4.9 KB**, because the stylesheet does not move and only the JavaScript grows.
+**5.0 KB**, because the stylesheet does not move and only the JavaScript grows.
 The kits that put their styles in the JavaScript have no flat part at all, so
 the same seven cost them **60 to 125 KB**. A quarter smaller at three
 components; **3.3× smaller at ten**.
@@ -234,7 +234,7 @@ Each claim here is enforced by something that fails, not by a promise.
 
 ## Status
 
-**v3.5.0 — three consumers.**
+**v3.6.0 — three consumers.**
 
 |              |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             |
 | ------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |

package/dist/app.js

@@ -1,5 +1,5 @@
 import { a as BaseCheckbox_default, o as BaseSheet_default, r as horizontalStep, s as inertOutside, t as focusTarget } from "./focus-target-BtcoJdmz.js";
-import { _ as toRedirectPath, c as useToast, d as isThemePreference, g as safeRedirect, h as tapFeedback, i as BaseInput_default, l as useOnline, m as useTheme, r as GoogleButton_default, s as BaseAlert_default, t as announce } from "./use-announce-BGZnV78W.js";
+import { _ as toRedirectPath, c as useToast, d as isThemePreference, g as safeRedirect, h as tapFeedback, i as BaseInput_default, l as useOnline, m as useTheme, r as GoogleButton_default, s as BaseAlert_default, t as announce } from "./use-announce-B8Ln-LsE.js";
 import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.js";
 import { t as BaseButton_default } from "./BaseButton-BD2HKB1L.js";
 import { t as SettingsRow_default } from "./SettingsRow-C6Spi7Np.js";

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

@@ -42,6 +42,25 @@ declare const __VLS_export: <T extends string | number | undefined = string>(__V
          * its errors impossible without hand-writing the control.
          */
         fieldId?: string | undefined;
+        /**
+         * Classes for the control itself, rather than for the field around it.
+         *
+         * `class` lands on the field, because that is where Vue puts a
+         * component's class and because a layout class means "space this field".
+         * That leaves `variant="unstyled"` with no way to paint the control it
+         * just stripped — the point of stripping it — which is why an app with a
+         * large amount field wrote the whole thing by hand instead.
+         *
+         * It appends, so with the default variant a conflict is settled by
+         * Tailwind's own order rather than by writing it here; reach for it with
+         * `unstyled`, where there is nothing to settle.
+         *
+         * Under `unstyled` it also takes over the 16px floor that stops iOS
+         * zooming on focus: `text-base` cannot be beaten by a larger utility, so
+         * the kit stops asserting it rather than overrule a caller who asked to
+         * paint the control. Keep the control at 16px or more.
+         */
+        controlClass?: string | undefined;
     } & Omit<InputHTMLAttributes, "type" | "size">) & {
         "onUpdate:modelValue"?: (value: T) => any;
     }> & (typeof globalThis extends {

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

@@ -44,6 +44,20 @@ declare const __VLS_export: <T extends string | number>(__VLS_props: NonNullable
          * its errors impossible without hand-writing the control.
          */
         fieldId?: string | undefined;
+        /**
+         * Classes for the control itself, rather than for the field around it.
+         *
+         * `class` lands on the field, because that is where Vue puts a
+         * component's class and because a layout class means "space this field".
+         * That leaves `variant="unstyled"` with no way to paint the control it
+         * just stripped — the point of stripping it — which is why an app with a
+         * large amount field wrote the whole thing by hand instead.
+         *
+         * It appends, so with the default variant a conflict is settled by
+         * Tailwind's own order rather than by writing it here; reach for it with
+         * `unstyled`, where there is nothing to settle.
+         */
+        controlClass?: string | undefined;
     } & {
         modelValue?: T | undefined;
     }) & {

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

@@ -35,6 +35,20 @@ type __VLS_Props = {
      * its errors impossible without hand-writing the control.
      */
     fieldId?: string | undefined;
+    /**
+     * Classes for the control itself, rather than for the field around it.
+     *
+     * `class` lands on the field, because that is where Vue puts a
+     * component's class and because a layout class means "space this field".
+     * That leaves `variant="unstyled"` with no way to paint the control it
+     * just stripped — the point of stripping it — which is why an app with a
+     * large amount field wrote the whole thing by hand instead.
+     *
+     * It appends, so with the default variant a conflict is settled by
+     * Tailwind's own order rather than by writing it here; reach for it with
+     * `unstyled`, where there is nothing to settle.
+     */
+    controlClass?: string | undefined;
 };
 /**
  * Focus the control, for a caller that owns when it happens.

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

@@ -51,6 +51,20 @@ type __VLS_Props = {
     /** The input's `id`, for an `ErrorSummary` that links to this field. */
     fieldId?: string | undefined;
     size?: 'sm' | 'md' | undefined;
+    /**
+     * Classes for the control itself, rather than for the field around it.
+     *
+     * `class` lands on the field, because that is where Vue puts a
+     * component's class and because a layout class means "space this field".
+     * That leaves `variant="unstyled"` with no way to paint the control it
+     * just stripped — the point of stripping it — which is why an app with a
+     * large amount field wrote the whole thing by hand instead.
+     *
+     * It appends, so with the default variant a conflict is settled by
+     * Tailwind's own order rather than by writing it here; reach for it with
+     * `unstyled`, where there is nothing to settle.
+     */
+    controlClass?: string | undefined;
 } & /* @vue-ignore */ Omit<InputHTMLAttributes, 'size' | 'type'>;
 /**
  * Focus the control, for a caller that owns when it happens.

package/dist/index.js

@@ -1,7 +1,7 @@
 import { a as addDays, c as lastNDays, d as toDateKey, f as todayKey, i as needsIosInstall, l as leadingBlanks, n as isApplePortable, o as eachDayOfYear, r as isInstalled, s as fromDateKey, t as SettingsGroup_default, u as startOfWeek } from "./SettingsGroup-BXkajKGl.js";
 import { a as formatNumber, i as formatDate, o as setFormatLocale, r as watchVisibility } from "./environment-Cz5KiC1t.js";
 import { a as BaseCheckbox_default, c as useBoundValue, d as ensureSheetRoot, i as textDirection, l as useVisualViewport, n as elementDirection, o as BaseSheet_default, r as horizontalStep, t as focusTarget, u as SHEET_ROOT_ID } from "./focus-target-BtcoJdmz.js";
-import { _ as toRedirectPath, a as useFieldAttrs, c as useToast, d as isThemePreference, f as readStoredTheme, g as safeRedirect, h as tapFeedback, i as BaseInput_default, l as useOnline, m as useTheme, n as useAnnounce, o as FormField_default, p as setThemeStorageKey, r as GoogleButton_default, s as BaseAlert_default, t as announce, u as applyTheme } from "./use-announce-BGZnV78W.js";
+import { _ as toRedirectPath, a as useFieldAttrs, c as useToast, d as isThemePreference, f as readStoredTheme, g as safeRedirect, h as tapFeedback, i as BaseInput_default, l as useOnline, m as useTheme, n as useAnnounce, o as FormField_default, p as setThemeStorageKey, r as GoogleButton_default, s as BaseAlert_default, t as announce, u as applyTheme } from "./use-announce-B8Ln-LsE.js";
 import { n as registerErrorMapper, r as toAppError, t as AppError } from "./app-error-DF9cijE0.js";
 import { a as BaseSkeleton_default, c as useMediaQuery, l as useDragScroll, n as ScrollArea_default, o as useMenuKeys, s as useAnchoredPanel, t as BaseListbox_default } from "./BaseListbox-D-NQ6nDd.js";
 import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.js";
@@ -1015,7 +1015,8 @@ var BaseSelect_default = /* @__PURE__ */ defineComponent({
 		placeholder: { default: "" },
 		size: { default: "md" },
 		variant: { default: "default" },
-		fieldId: { default: () => void 0 }
+		fieldId: { default: () => void 0 },
+		controlClass: { default: () => void 0 }
 	}, {
 		"modelValue": {},
 		"modelModifiers": {}
@@ -1063,7 +1064,8 @@ var BaseSelect_default = /* @__PURE__ */ defineComponent({
 					class: normalizeClass(["w-full appearance-none", [
 						__props.variant === "unstyled" ? "" : "control text-ink rounded-card focus-visible:outline-primary 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.variant !== "unstyled" && invalid ? "border-negative" : "",
+						__props.controlClass
 					]])
 				}, [__props.placeholder ? (openBlock(), createElementBlock("option", _hoisted_3$28, toDisplayString(__props.placeholder), 1)) : createCommentVNode("", true), (openBlock(true), createElementBlock(Fragment, null, renderList(__props.options, (option) => {
 					return openBlock(), createElementBlock("option", {
@@ -1621,7 +1623,8 @@ var BaseTextarea_default = /* @__PURE__ */ defineComponent({
 		rows: { default: 4 },
 		size: { default: "md" },
 		variant: { default: "default" },
-		fieldId: { default: () => void 0 }
+		fieldId: { default: () => void 0 },
+		controlClass: { default: () => void 0 }
 	},
 	emits: ["update:modelValue"],
 	setup(__props, { expose: __expose, emit: __emit }) {
@@ -1667,7 +1670,8 @@ var BaseTextarea_default = /* @__PURE__ */ defineComponent({
 				}, unref(controlAttrs), { class: [
 					__props.variant === "unstyled" ? "" : "control text-ink rounded-card focus-visible:outline-primary resize-y px-3 py-2 leading-relaxed focus-visible:outline-2 focus-visible:outline-offset-1",
 					"text-base",
-					__props.variant !== "unstyled" && invalid ? "border-negative" : ""
+					__props.variant !== "unstyled" && invalid ? "border-negative" : "",
+					__props.controlClass
 				] }), null, 16, _hoisted_1$40), [[vModelText, unref(model)]])]),
 				_: 1
 			}, 8, [
@@ -4763,7 +4767,8 @@ var PasswordInput_default = /* @__PURE__ */ defineComponent({
 			default: false
 		},
 		fieldId: { default: () => void 0 },
-		size: { default: "md" }
+		size: { default: "md" },
+		controlClass: { default: () => void 0 }
 	},
 	emits: ["update:modelValue", "toggle"],
 	setup(__props, { expose: __expose, emit: __emit }) {
@@ -4849,7 +4854,11 @@ var PasswordInput_default = /* @__PURE__ */ defineComponent({
 					autocapitalize: "none",
 					spellcheck: false
 				}, unref(controlAttrs), {
-					class: ["control text-ink rounded-card focus-visible:outline-primary w-full ps-3 pe-11 focus-visible:outline-2 focus-visible:outline-offset-1", [CONTROL_CLASS, invalid ? "border-negative" : ""]],
+					class: ["control text-ink rounded-card focus-visible:outline-primary w-full ps-3 pe-11 focus-visible:outline-2 focus-visible:outline-offset-1", [
+						CONTROL_CLASS,
+						invalid ? "border-negative" : "",
+						__props.controlClass
+					]],
 					onInput: _cache[0] || (_cache[0] = ($event) => emit("update:modelValue", $event.target.value))
 				}), null, 16, _hoisted_2$2), createElementVNode("button", {
 					type: "button",
@@ -5189,7 +5198,7 @@ function createI18nRuntime(options) {
 *
 * The fallback keeps `vitest` and `vite dev` honest, where no define runs.
 */
-var VERSION = "3.5.0";
+var VERSION = "3.6.0";
 //#endregion
 export { ActivityGrid_default as ActivityGrid, AnnounceHost_default as AnnounceHost, AppError, AvatarStack_default as AvatarStack, BarChart_default as BarChart, BaseAlert_default as BaseAlert, BaseAvatar_default as BaseAvatar, BaseBadge_default as BaseBadge, BaseButton_default as BaseButton, BaseCalendar_default as BaseCalendar, BaseCard_default as BaseCard, BaseCheckbox_default as BaseCheckbox, BaseChip_default as BaseChip, BaseCombobox_default as BaseCombobox, BaseDatePicker_default as BaseDatePicker, BaseInput_default as BaseInput, BaseKbd_default as BaseKbd, BaseLink_default as BaseLink, BaseListbox_default as BaseListbox, BaseMenu_default as BaseMenu, BasePopconfirm_default as BasePopconfirm, BasePopover_default as BasePopover, BaseRadioGroup_default as BaseRadioGroup, BaseRating_default as BaseRating, BaseSelect_default as BaseSelect, BaseSeparator_default as BaseSeparator, BaseSheet_default as BaseSheet, BaseSkeleton_default as BaseSkeleton, BaseSlider_default as BaseSlider, BaseSpinner_default as BaseSpinner, BaseStepper_default as BaseStepper, BaseSwitch_default as BaseSwitch, BaseTable_default as BaseTable, BaseTextarea_default as BaseTextarea, BaseTimeline_default as BaseTimeline, CircularProgress_default as CircularProgress, CodeBlock_default as CodeBlock, ColorPicker_default as ColorPicker, CopyButton_default as CopyButton, DescriptionList_default as DescriptionList, DonutChart_default as DonutChart, EmptyState_default as EmptyState, ErrorBoundary_default as ErrorBoundary, ErrorSummary_default as ErrorSummary, FileDrop_default as FileDrop, FormField_default as FormField, GoogleButton_default as GoogleButton, LocaleLinks_default as LocaleLinks, MATERIALS, NumberInput_default as NumberInput, PALETTES, PageContainer_default as PageContainer, PageHeader_default as PageHeader, PasswordInput_default as PasswordInput, PinInput_default as PinInput, PriceCard_default as PriceCard, ProgressBar_default as ProgressBar, SHEET_ROOT_ID, ScrollArea_default as ScrollArea, SectionHeading_default as SectionHeading, SegmentedControl_default as SegmentedControl, SettingsGroup_default as SettingsGroup, SettingsRow_default as SettingsRow, SkeletonList_default as SkeletonList, SliderField_default as SliderField, StatCard_default as StatCard, TabBar_default as TabBar, TagsInput_default as TagsInput, TimePicker_default as TimePicker, ToastHost_default as ToastHost, ToggleGroup_default as ToggleGroup, ToneDot_default as ToneDot, VERSION, VirtualList_default as VirtualList, addDays, announce, applyMaterial, applyPalette, applyTheme, createI18nRuntime, downloadJson, eachDayOfYear, elementDirection, ensureSheetRoot, formatDate, formatNumber, fromDateKey, horizontalStep, isApplePortable, isInstalled, isMaterial, isPaletteName, isThemePreference, lastNDays, leadingBlanks, needsIosInstall, readStoredTheme, registerErrorMapper, relativeDayLabel, safeRedirect, setFormatLocale, setMaterialStorageKey, setPaletteStorageKey, setThemeStorageKey, startOfWeek, tapFeedback, textDirection, toAppError, toDateKey, toRedirectPath, todayKey, useAnnounce, useDebouncedCallback, useDragScroll, useMaterial, useMediaQuery, useOnline, usePalette, useTheme, useToast, useToday, useVisualViewport };