rei-kit 4.2.0 → 4.3.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/README.md +7 -7
- package/dist/components/BaseCheckboxGroup.vue.d.ts +59 -0
- package/dist/components/SectionHeading.vue.d.ts +15 -5
- package/dist/index.d.ts +20 -2
- package/dist/index.js +104 -8
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# rei-kit
|
|
2
2
|
|
|
3
|
-
**One kit. Every look.**
|
|
3
|
+
**One kit. Every look.** 106 accessible components for Vue 3 and Tailwind 4.
|
|
4
4
|
Change the **material** with one attribute and the **palette** with another —
|
|
5
5
|
every component follows, and none of them knows your brand.
|
|
6
6
|
|
|
@@ -83,7 +83,7 @@ go red, and several of them exist nowhere else:
|
|
|
83
83
|
| -------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
84
84
|
| **`direction-styles.spec.ts`** | One case per file, reading each stylesheet for a property that picks a side — `padding-left` where `padding-inline-start` was meant — and for a one-sided gradient with no right-to-left counterpart. It found 61 on its first run. |
|
|
85
85
|
| **`direction-keys.spec.ts`** | One case per control, pressing **ArrowLeft in a right-to-left document** and asserting it went *forward*. Ten components were walking backwards through themselves. It type-checks, it renders, it passes axe, and only an Arabic reader sees it. |
|
|
86
|
-
| **`examples-axe.spec.ts`** | axe on all
|
|
86
|
+
| **`examples-axe.spec.ts`** | axe on all 106 usage examples, **and again with each one opened** — a menu, a dialog, a combobox list is exactly where the ARIA lives and where a closed-state audit says nothing. |
|
|
87
87
|
| **`focus.spec.ts`** | Reads every component for a focus ring. A missing one compiles, renders and passes every other check. |
|
|
88
88
|
| **`public-api.spec.ts`** | Names every runtime export of all six entries. A kit compiles fine without an export nothing inside it calls. |
|
|
89
89
|
| **`type-surface.ts`** | Re-exports every published type and is type-checked twice, because a test cannot see types — they are gone by the time one runs. |
|
|
@@ -165,7 +165,7 @@ app, and the case *least* favourable to this kit:
|
|
|
165
165
|
|
|
166
166
|
| Kit | JS | CSS | Total |
|
|
167
167
|
| -------------------- | ---------: | ----------: | ----------: |
|
|
168
|
-
| **rei-kit 4.
|
|
168
|
+
| **rei-kit 4.3.0** | **3.7 KB** | **23.2 KB** | **26.8 KB** |
|
|
169
169
|
| element-plus 2.14.6 | 27.3 KB | 6.0 KB | 33.3 KB |
|
|
170
170
|
| naive-ui 2.45.3 | 51.2 KB | — | 51.2 KB |
|
|
171
171
|
| 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:
|
|
|
177
177
|
|
|
178
178
|
| Kit | JS | CSS | Total |
|
|
179
179
|
| -------------------- | ---------: | ----------: | -----------: |
|
|
180
|
-
| **rei-kit 4.
|
|
180
|
+
| **rei-kit 4.3.0** | **8.6 KB** | **23.2 KB** | **31.8 KB** |
|
|
181
181
|
| element-plus 2.14.6 | 90.1 KB | 14.0 KB | 104.1 KB |
|
|
182
182
|
| naive-ui 2.45.3 | 132.4 KB | — | 132.4 KB |
|
|
183
183
|
| primevue 5.0.1 | 135.8 KB | — | 135.8 KB |
|
|
@@ -191,7 +191,7 @@ the same seven cost them **60 to 125 KB**. A quarter smaller at three
|
|
|
191
191
|
components; **3.3× smaller at ten**.
|
|
192
192
|
|
|
193
193
|
That is the trade, stated rather than left to be inferred: rei-kit's CSS
|
|
194
|
-
column is the entire `mobile.css` preset — all
|
|
194
|
+
column is the entire `mobile.css` preset — all 106 components, four materials,
|
|
195
195
|
ten palettes — and it is the same 23.1 KB whether an app imports three
|
|
196
196
|
components or every one of them. An app using very little of the kit carries
|
|
197
197
|
stylesheet it does not need; an app using a screenful stops paying anything
|
|
@@ -222,7 +222,7 @@ Each claim here is enforced by something that fails, not by a promise.
|
|
|
222
222
|
|
|
223
223
|
| Standard | How it is held |
|
|
224
224
|
| ---------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
225
|
-
| **Open for extension, closed for edits** | A new look is a token, a material or a palette — never an edit to a component. Materials and palettes restyle all
|
|
225
|
+
| **Open for extension, closed for edits** | A new look is a token, a material or a palette — never an edit to a component. Materials and palettes restyle all 106 without touching one, and a test fails if a component holds a colour. |
|
|
226
226
|
| **Single responsibility** | One part, one job. Label-and-error wiring lives in `FormField`, not in five inputs; taking the page behind a layer out of reach lives in one helper the modal, the sheet and the guide share. |
|
|
227
227
|
| **Depend on roles, not values** | Components read `primary`, `surface`, `--shadow-card` — never a hex or a pixel shadow. An app's brand wins in both modes, tested. |
|
|
228
228
|
| **WAI-ARIA Authoring Practices** | Menus, comboboxes, tabs, sliders, dialogs and accordions follow their APG pattern: arrows move, Tab leaves, Escape closes, focus returns. Behaviour tests drive each with the keyboard. |
|
|
@@ -238,7 +238,7 @@ Each claim here is enforced by something that fails, not by a promise.
|
|
|
238
238
|
|
|
239
239
|
| | |
|
|
240
240
|
| ------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
241
|
-
| Components |
|
|
241
|
+
| Components | 106 (`AuthForm`, `BaseTable`, `BaseCombobox`, `BaseSlider`, `TabShell`, `BaseModal`, `BaseTabs`, `BaseTooltip`, `BasePagination`, `BaseBreadcrumb`, `BaseDisclosure`, `BaseAccordion`, `NavLinks`, `OfflineBanner`, `FabButton`, `BaseButton`, `BaseCard`, `BaseInput`, `BaseSelect`, `BaseTextarea`, `BaseCheckbox`, `BaseSwitch`, `BaseRadioGroup`, `BaseMenu`, `BaseAvatar`, `BaseSpinner`, `BaseAlert`, `BaseBadge`, `BaseSheet`, `ProgressBar`, `PriceCard`, `ToastHost`, `TabBar`, `GoogleButton`, `LocaleLinks`, `LocaleSheet`, `AuthShell`, `TourShell`, `InstallPrompt`, `UpdatePrompt`, `InstallSettings`, `SkeletonList`, `PageContainer`, `ErrorBoundary`, etc.) |
|
|
242
242
|
| Composables | 14 (`useToast`, `useTheme`, `useMaterial`, `usePalette`, `useToday`, `useMediaQuery`, `useOnline`, `useInstall`, `useSnooze`, `useThemeSync`, `useVisualViewport`, `useDragScroll`, `useDebouncedCallback`, `useAnnounce`) |
|
|
243
243
|
| Utilities | 48 functions and 5 constants (`applyTheme`, `applyMaterial`, `applyPalette`, `MATERIALS`, `PALETTES`, `formatDate`, `fieldErrors`, `toAuthMessageKey`, `createAuthGuard`, `createQueryDefaults`, `createWriteReport`, `toRedirectPath`, `Supabase error mapper`, i18n runtime, etc.) |
|
|
244
244
|
| Entry Points | `rei-kit`, `rei-kit/app`, `rei-kit/web`, `rei-kit/pwa`, `rei-kit/motion`, `rei-kit/supabase`, `rei-kit/mobile.css`, `rei-kit/web.css`, and each stylesheet on its own |
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
/** One answer in a group of checkboxes. */
|
|
2
|
+
export interface CheckboxOption<V extends string = string> {
|
|
3
|
+
value: V;
|
|
4
|
+
label: string;
|
|
5
|
+
/** A reason this one cannot be chosen, shown under its label. */
|
|
6
|
+
hint?: string | undefined;
|
|
7
|
+
disabled?: boolean | undefined;
|
|
8
|
+
}
|
|
9
|
+
declare const __VLS_export: <V extends string = string>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
|
|
10
|
+
props: import('vue').PublicProps & __VLS_PrettifyLocal<({
|
|
11
|
+
options: readonly CheckboxOption<V>[];
|
|
12
|
+
legend: string;
|
|
13
|
+
/** Shown under the group, and it marks every box invalid. */
|
|
14
|
+
error?: string | undefined;
|
|
15
|
+
hint?: string | undefined;
|
|
16
|
+
/**
|
|
17
|
+
* Hides the question but keeps it as the group's accessible name — for a
|
|
18
|
+
* group whose surroundings already ask it. Dropping the legend instead
|
|
19
|
+
* leaves the set named nothing at all.
|
|
20
|
+
*/
|
|
21
|
+
legendHidden?: boolean | undefined;
|
|
22
|
+
/**
|
|
23
|
+
* Adds a box above the others that chooses or clears all of them, named by
|
|
24
|
+
* this string. Empty means no such box: it earns its place on a list long
|
|
25
|
+
* enough that ticking each one is work, and gets in the way on three.
|
|
26
|
+
*
|
|
27
|
+
* It never chooses a disabled option, so pressing it twice is not a way to
|
|
28
|
+
* select something the form has ruled out.
|
|
29
|
+
*/
|
|
30
|
+
selectAllLabel?: string | undefined;
|
|
31
|
+
/** Disables every box, including the select-all. */
|
|
32
|
+
disabled?: boolean | undefined;
|
|
33
|
+
/**
|
|
34
|
+
* Lay the boxes out in two columns from the `sm` breakpoint. One column on
|
|
35
|
+
* a phone either way: a two-column list of checkboxes on a 390px screen is
|
|
36
|
+
* two columns of truncated labels.
|
|
37
|
+
*/
|
|
38
|
+
columns?: 1 | 2 | undefined;
|
|
39
|
+
} & {
|
|
40
|
+
modelValue?: V[];
|
|
41
|
+
}) & {
|
|
42
|
+
"onUpdate:modelValue"?: (value: V[]) => any;
|
|
43
|
+
}> & (typeof globalThis extends {
|
|
44
|
+
__VLS_PROPS_FALLBACK: infer P;
|
|
45
|
+
} ? P : {});
|
|
46
|
+
expose: (exposed: {}) => void;
|
|
47
|
+
attrs: any;
|
|
48
|
+
slots: {};
|
|
49
|
+
emit: (event: "update:modelValue", value: V[]) => void;
|
|
50
|
+
}>) => import('vue').VNode & {
|
|
51
|
+
__ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
|
|
52
|
+
};
|
|
53
|
+
declare const _default: typeof __VLS_export;
|
|
54
|
+
export default _default;
|
|
55
|
+
type __VLS_PrettifyLocal<T> = (T extends any ? {
|
|
56
|
+
[K in keyof T]: T[K];
|
|
57
|
+
} : {
|
|
58
|
+
[K in keyof T as K]: T[K];
|
|
59
|
+
}) & {};
|
|
@@ -4,7 +4,16 @@ export interface Tone {
|
|
|
4
4
|
fill: string;
|
|
5
5
|
/** Tinted surface for the pill, e.g. `bg-positive/5 border-positive/25`. */
|
|
6
6
|
card: string;
|
|
7
|
-
/**
|
|
7
|
+
/**
|
|
8
|
+
* Foreground for the label. `text-ink`, in almost every case.
|
|
9
|
+
*
|
|
10
|
+
* Not the role: `text-positive` on a `bg-positive/5` pill is a colour on a
|
|
11
|
+
* faint wash of itself, and it measures about 2:1 painted — the fault
|
|
12
|
+
* `BaseBadge`, `BaseChip`, `BaseAlert`, `BaseListbox` and `PriceCard` were
|
|
13
|
+
* all fixed for in 2.25.0. This one takes its classes from the app, so no
|
|
14
|
+
* source-reading test could see it; the contrast scan on the showcase
|
|
15
|
+
* caught it once the playground started rendering it.
|
|
16
|
+
*/
|
|
8
17
|
text: string;
|
|
9
18
|
}
|
|
10
19
|
/**
|
|
@@ -17,10 +26,11 @@ export interface Tone {
|
|
|
17
26
|
*/
|
|
18
27
|
type __VLS_Props = {
|
|
19
28
|
/**
|
|
20
|
-
* The colour classes for the dot and the label, as written-out
|
|
21
|
-
* `Tone` is a
|
|
22
|
-
* the app's own, and Tailwind reads source as plain
|
|
23
|
-
* at runtime never reaches the stylesheet.
|
|
29
|
+
* The colour classes for the dot, the pill and the label, as written-out
|
|
30
|
+
* class names. `Tone` is a set of classes rather than a role token because
|
|
31
|
+
* the categories here are the app's own, and Tailwind reads source as plain
|
|
32
|
+
* text: a class assembled at runtime never reaches the stylesheet. Put the
|
|
33
|
+
* role on `fill` and `card` and leave `text` as `text-ink`.
|
|
24
34
|
*/
|
|
25
35
|
tone: Tone;
|
|
26
36
|
label: string;
|
package/dist/index.d.ts
CHANGED
|
@@ -208,6 +208,24 @@ export type { ComboboxOption } from './components/BaseCombobox.vue';
|
|
|
208
208
|
* @see {@link BaseSwitch} — the near-neighbour this is mistaken for
|
|
209
209
|
*/
|
|
210
210
|
export { default as BaseCheckbox } from './components/BaseCheckbox.vue';
|
|
211
|
+
/**
|
|
212
|
+
* Several answers from a set that is all on screen.
|
|
213
|
+
*
|
|
214
|
+
* @example
|
|
215
|
+
* ```vue
|
|
216
|
+
* <BaseCheckboxGroup
|
|
217
|
+
* v-model="days"
|
|
218
|
+
* legend="Remind me on"
|
|
219
|
+
* :options="weekdays"
|
|
220
|
+
* select-all-label="Every weekday"
|
|
221
|
+
* :columns="2"
|
|
222
|
+
* />
|
|
223
|
+
* ```
|
|
224
|
+
*
|
|
225
|
+
* @see {@link BaseListbox}, {@link BaseRadioGroup} — the near-neighbours this is mistaken for
|
|
226
|
+
*/
|
|
227
|
+
export { default as BaseCheckboxGroup } from './components/BaseCheckboxGroup.vue';
|
|
228
|
+
export type { CheckboxOption } from './components/BaseCheckboxGroup.vue';
|
|
211
229
|
/**
|
|
212
230
|
* A set of radios, and the reason there is no `BaseRadio`.
|
|
213
231
|
*
|
|
@@ -216,7 +234,7 @@ export { default as BaseCheckbox } from './components/BaseCheckbox.vue';
|
|
|
216
234
|
* <BaseRadioGroup v-model="plan" legend="Plan" :options="plans" />
|
|
217
235
|
* ```
|
|
218
236
|
*
|
|
219
|
-
* @see {@link BaseListbox}, {@link BaseSelect} — the near-neighbours this is mistaken for
|
|
237
|
+
* @see {@link BaseCheckboxGroup}, {@link BaseListbox}, {@link BaseSelect} — the near-neighbours this is mistaken for
|
|
220
238
|
*/
|
|
221
239
|
export { default as BaseRadioGroup } from './components/BaseRadioGroup.vue';
|
|
222
240
|
/**
|
|
@@ -764,7 +782,7 @@ export { default as BaseKbd } from './components/BaseKbd.vue';
|
|
|
764
782
|
* <BaseListbox v-model="chosen" mode="multiple" :options="people" label="People with access" />
|
|
765
783
|
* ```
|
|
766
784
|
*
|
|
767
|
-
* @see {@link BaseRadioGroup}, {@link BaseSelect}, {@link TransferList} — the near-neighbours this is mistaken for
|
|
785
|
+
* @see {@link BaseCheckboxGroup}, {@link BaseRadioGroup}, {@link BaseSelect}, {@link TransferList} — the near-neighbours this is mistaken for
|
|
768
786
|
*/
|
|
769
787
|
export { default as BaseListbox } from './components/BaseListbox.vue';
|
|
770
788
|
export type { ListboxOption } from './components/BaseListbox.vue';
|
package/dist/index.js
CHANGED
|
@@ -272,7 +272,7 @@ function useDebouncedCallback(callback, delay = 800) {
|
|
|
272
272
|
}
|
|
273
273
|
//#endregion
|
|
274
274
|
//#region src/components/BaseAvatar.vue?vue&type=script&setup=true&lang.ts
|
|
275
|
-
var _hoisted_1$
|
|
275
|
+
var _hoisted_1$52 = [
|
|
276
276
|
"role",
|
|
277
277
|
"aria-label",
|
|
278
278
|
"aria-hidden"
|
|
@@ -337,7 +337,7 @@ var BaseAvatar_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__P
|
|
|
337
337
|
d: "M3.75 17c0-3.05 2.8-5.25 6.25-5.25S16.25 13.95 16.25 17",
|
|
338
338
|
"stroke-width": "1.5",
|
|
339
339
|
"stroke-linecap": "round"
|
|
340
|
-
}, null, -1)])]))], 10, _hoisted_1$
|
|
340
|
+
}, null, -1)])]))], 10, _hoisted_1$52);
|
|
341
341
|
};
|
|
342
342
|
}
|
|
343
343
|
}), [["__scopeId", "data-v-47586bec"]]);
|
|
@@ -362,7 +362,7 @@ var BaseBadge_default = /* @__PURE__ */ defineComponent({
|
|
|
362
362
|
});
|
|
363
363
|
//#endregion
|
|
364
364
|
//#region src/components/BaseMenu.vue?vue&type=script&setup=true&lang.ts
|
|
365
|
-
var _hoisted_1$
|
|
365
|
+
var _hoisted_1$51 = [
|
|
366
366
|
"aria-label",
|
|
367
367
|
"aria-expanded",
|
|
368
368
|
"aria-controls"
|
|
@@ -441,7 +441,7 @@ var BaseMenu_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PUR
|
|
|
441
441
|
"aria-haspopup": true,
|
|
442
442
|
"aria-controls": open.value ? unref(id) : void 0,
|
|
443
443
|
onClick: _cache[0] || (_cache[0] = ($event) => open.value = !open.value)
|
|
444
|
-
}, [renderSlot(_ctx.$slots, "trigger", { open: open.value }, void 0, true)], 8, _hoisted_1$
|
|
444
|
+
}, [renderSlot(_ctx.$slots, "trigger", { open: open.value }, void 0, true)], 8, _hoisted_1$51), open.value ? (openBlock(), createElementBlock("div", {
|
|
445
445
|
key: 0,
|
|
446
446
|
id: unref(id),
|
|
447
447
|
ref_key: "panel",
|
|
@@ -574,7 +574,7 @@ function useVirtualWindow({ count, rowHeight, threshold }) {
|
|
|
574
574
|
}
|
|
575
575
|
//#endregion
|
|
576
576
|
//#region src/components/BaseCombobox.vue?vue&type=script&setup=true&lang.ts
|
|
577
|
-
var _hoisted_1$
|
|
577
|
+
var _hoisted_1$50 = ["for"];
|
|
578
578
|
var _hoisted_2$43 = [
|
|
579
579
|
"aria-label",
|
|
580
580
|
"disabled",
|
|
@@ -816,7 +816,7 @@ var BaseCombobox_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
|
|
|
816
816
|
createElementVNode("label", {
|
|
817
817
|
for: unref(id),
|
|
818
818
|
class: "rk-combo-label"
|
|
819
|
-
}, toDisplayString(__props.label), 9, _hoisted_1$
|
|
819
|
+
}, toDisplayString(__props.label), 9, _hoisted_1$50),
|
|
820
820
|
createElementVNode("div", { class: normalizeClass(["rk-combo-field", multiple.value ? "is-multiple control" : ""]) }, [
|
|
821
821
|
(openBlock(true), createElementBlock(Fragment, null, renderList(multiple.value ? chosenOptions.value : [], (option) => {
|
|
822
822
|
return openBlock(), createElementBlock("span", {
|
|
@@ -919,6 +919,102 @@ var BaseCombobox_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
|
|
|
919
919
|
}
|
|
920
920
|
}), [["__scopeId", "data-v-f02a0924"]]);
|
|
921
921
|
//#endregion
|
|
922
|
+
//#region src/components/BaseCheckboxGroup.vue?vue&type=script&setup=true&lang.ts
|
|
923
|
+
var _hoisted_1$49 = ["aria-describedby", "aria-invalid"];
|
|
924
|
+
//#endregion
|
|
925
|
+
//#region src/components/BaseCheckboxGroup.vue
|
|
926
|
+
var BaseCheckboxGroup_default = /* @__PURE__ */ defineComponent({
|
|
927
|
+
__name: "BaseCheckboxGroup",
|
|
928
|
+
props: /*@__PURE__*/ mergeModels({
|
|
929
|
+
options: {},
|
|
930
|
+
legend: {},
|
|
931
|
+
error: { default: "" },
|
|
932
|
+
hint: { default: "" },
|
|
933
|
+
legendHidden: {
|
|
934
|
+
type: Boolean,
|
|
935
|
+
default: false
|
|
936
|
+
},
|
|
937
|
+
selectAllLabel: { default: "" },
|
|
938
|
+
disabled: {
|
|
939
|
+
type: Boolean,
|
|
940
|
+
default: false
|
|
941
|
+
},
|
|
942
|
+
columns: { default: 1 }
|
|
943
|
+
}, {
|
|
944
|
+
"modelValue": { default: () => [] },
|
|
945
|
+
"modelModifiers": {}
|
|
946
|
+
}),
|
|
947
|
+
emits: ["update:modelValue"],
|
|
948
|
+
setup(__props) {
|
|
949
|
+
const model = useModel(__props, "modelValue");
|
|
950
|
+
const id = useId();
|
|
951
|
+
const errorId = `${id}-error`;
|
|
952
|
+
const hintId = `${id}-hint`;
|
|
953
|
+
const describedBy = computed(() => {
|
|
954
|
+
if (__props.error) return errorId;
|
|
955
|
+
if (__props.hint) return hintId;
|
|
956
|
+
});
|
|
957
|
+
const choosable = computed(() => __props.options.filter((option) => !option.disabled));
|
|
958
|
+
const allChosen = computed(() => choosable.value.length > 0 && choosable.value.every((option) => model.value.includes(option.value)));
|
|
959
|
+
const someChosen = computed(() => !allChosen.value && choosable.value.some((option) => model.value.includes(option.value)));
|
|
960
|
+
function toggle(value, chosen) {
|
|
961
|
+
model.value = chosen ? [...model.value, value] : model.value.filter((chosenValue) => chosenValue !== value);
|
|
962
|
+
}
|
|
963
|
+
function toggleAll(chosen) {
|
|
964
|
+
const locked = model.value.filter((value) => __props.options.some((option) => option.value === value && option.disabled));
|
|
965
|
+
model.value = chosen ? [...locked, ...choosable.value.map((option) => option.value)] : locked;
|
|
966
|
+
}
|
|
967
|
+
return (_ctx, _cache) => {
|
|
968
|
+
return openBlock(), createElementBlock("fieldset", {
|
|
969
|
+
class: "flex flex-col gap-2",
|
|
970
|
+
"aria-describedby": describedBy.value,
|
|
971
|
+
"aria-invalid": Boolean(__props.error)
|
|
972
|
+
}, [
|
|
973
|
+
createElementVNode("legend", { class: normalizeClass(["text-ink mb-1 text-sm font-medium", __props.legendHidden ? "sr-only" : ""]) }, toDisplayString(__props.legend), 3),
|
|
974
|
+
__props.selectAllLabel ? (openBlock(), createBlock(BaseCheckbox_default, {
|
|
975
|
+
key: 0,
|
|
976
|
+
"model-value": allChosen.value,
|
|
977
|
+
label: __props.selectAllLabel,
|
|
978
|
+
indeterminate: someChosen.value,
|
|
979
|
+
disabled: __props.disabled || choosable.value.length === 0,
|
|
980
|
+
class: "border-hair/70 border-b pb-2",
|
|
981
|
+
"onUpdate:modelValue": toggleAll
|
|
982
|
+
}, null, 8, [
|
|
983
|
+
"model-value",
|
|
984
|
+
"label",
|
|
985
|
+
"indeterminate",
|
|
986
|
+
"disabled"
|
|
987
|
+
])) : createCommentVNode("", true),
|
|
988
|
+
createElementVNode("div", { class: normalizeClass(["grid gap-2", __props.columns === 2 ? "sm:grid-cols-2" : ""]) }, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.options, (option) => {
|
|
989
|
+
return openBlock(), createBlock(BaseCheckbox_default, {
|
|
990
|
+
key: option.value,
|
|
991
|
+
"model-value": model.value.includes(option.value),
|
|
992
|
+
label: option.label,
|
|
993
|
+
hint: option.hint ?? "",
|
|
994
|
+
disabled: __props.disabled || option.disabled,
|
|
995
|
+
"onUpdate:modelValue": (chosen) => toggle(option.value, chosen)
|
|
996
|
+
}, null, 8, [
|
|
997
|
+
"model-value",
|
|
998
|
+
"label",
|
|
999
|
+
"hint",
|
|
1000
|
+
"disabled",
|
|
1001
|
+
"onUpdate:modelValue"
|
|
1002
|
+
]);
|
|
1003
|
+
}), 128))], 2),
|
|
1004
|
+
__props.error ? (openBlock(), createElementBlock("p", {
|
|
1005
|
+
key: 1,
|
|
1006
|
+
id: errorId,
|
|
1007
|
+
class: "text-negative text-xs"
|
|
1008
|
+
}, toDisplayString(__props.error), 1)) : __props.hint ? (openBlock(), createElementBlock("p", {
|
|
1009
|
+
key: 2,
|
|
1010
|
+
id: hintId,
|
|
1011
|
+
class: "text-ink-soft text-xs"
|
|
1012
|
+
}, toDisplayString(__props.hint), 1)) : createCommentVNode("", true)
|
|
1013
|
+
], 8, _hoisted_1$49);
|
|
1014
|
+
};
|
|
1015
|
+
}
|
|
1016
|
+
});
|
|
1017
|
+
//#endregion
|
|
922
1018
|
//#region src/components/BaseRadioGroup.vue?vue&type=script&setup=true&lang.ts
|
|
923
1019
|
var _hoisted_1$48 = ["aria-describedby"];
|
|
924
1020
|
var _hoisted_2$42 = [
|
|
@@ -5198,8 +5294,8 @@ function createI18nRuntime(options) {
|
|
|
5198
5294
|
*
|
|
5199
5295
|
* The fallback keeps `vitest` and `vite dev` honest, where no define runs.
|
|
5200
5296
|
*/
|
|
5201
|
-
var VERSION = "4.
|
|
5297
|
+
var VERSION = "4.3.0";
|
|
5202
5298
|
//#endregion
|
|
5203
|
-
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 };
|
|
5299
|
+
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, BaseCheckboxGroup_default as BaseCheckboxGroup, 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 };
|
|
5204
5300
|
|
|
5205
5301
|
//# sourceMappingURL=index.js.map
|