rei-kit 2.14.0 → 2.15.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 +4 -4
- package/dist/components/SliderField.vue.d.ts +59 -0
- package/dist/index.d.ts +5 -0
- package/dist/index.js +390 -301
- package/dist/index.js.map +1 -1
- package/dist/styles.css +92 -54
- package/dist/web/BaseTooltip.vue.d.ts +17 -0
- package/dist/web.js +72 -29
- package/dist/web.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.** 90 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
|
|
|
@@ -112,7 +112,7 @@ Each claim here is enforced by something that fails, not by a promise.
|
|
|
112
112
|
|
|
113
113
|
| Standard | How it is held |
|
|
114
114
|
| ---------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
115
|
-
| **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
|
|
115
|
+
| **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 90 without touching one, and a test fails if a component holds a colour. |
|
|
116
116
|
| **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. |
|
|
117
117
|
| **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. |
|
|
118
118
|
| **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. |
|
|
@@ -124,11 +124,11 @@ Each claim here is enforced by something that fails, not by a promise.
|
|
|
124
124
|
|
|
125
125
|
## Status
|
|
126
126
|
|
|
127
|
-
**v2.
|
|
127
|
+
**v2.15.0 — three consumers.**
|
|
128
128
|
|
|
129
129
|
| | |
|
|
130
130
|
| ------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
131
|
-
| Components |
|
|
131
|
+
| Components | 90 (`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.) |
|
|
132
132
|
| Composables | 16 (`useToast`, `useTheme`, `useMaterial`, `usePalette`, `useToday`, `useMediaQuery`, `useInstall`, `watchInstallability`, `createTabTransition`, `useThemeSync`, `useVisualViewport`, etc.) |
|
|
133
133
|
| Utilities | 33 (`applyTheme`, `applyMaterial`, `applyPalette`, `MATERIALS`, `PALETTES`, `formatDate`, `fieldErrors`, `toAuthMessageKey`, `createAuthGuard`, `createQueryDefaults`, `createWriteReport`, `toRedirectPath`, `Supabase error mapper`, i18n runtime, etc.) |
|
|
134
134
|
| Entry Points | `rei-kit`, `rei-kit/app`, `rei-kit/web`, `rei-kit/pwa`, `rei-kit/supabase`, `rei-kit/mobile.css`, `rei-kit/web.css`, and each stylesheet on its own |
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* One number, reached either way: dragged along a range or typed exactly.
|
|
3
|
+
*
|
|
4
|
+
* The pair exists because the two controls answer different halves of the
|
|
5
|
+
* same question. A slider is for finding a value — you can see where you are
|
|
6
|
+
* in the range and what "a bit more" looks like — and it is hopeless at
|
|
7
|
+
* landing on 37 out of 500. A number field lands on 37 immediately and tells
|
|
8
|
+
* you nothing about whether 37 is a lot. Anything with a wide range and an
|
|
9
|
+
* exact answer somewhere in it — a price ceiling, an opacity, a timeout —
|
|
10
|
+
* wants both, and apps kept building the pair by hand.
|
|
11
|
+
*
|
|
12
|
+
* ## Both controls carry the same name, and that is on purpose
|
|
13
|
+
*
|
|
14
|
+
* A screen reader announces two controls here, not one, because there are
|
|
15
|
+
* two: each can be focused and each changes the value. Giving them one name
|
|
16
|
+
* is what says they are the same answer rather than two settings that happen
|
|
17
|
+
* to sit together. The number field's label is visually hidden, since the
|
|
18
|
+
* slider's is right above it.
|
|
19
|
+
*
|
|
20
|
+
* ## Typing is allowed to be wrong on the way
|
|
21
|
+
*
|
|
22
|
+
* The field clamps on commit, not on every keystroke: clamping as you type
|
|
23
|
+
* turns "50" into "5" and then into "50" again while you are still typing it
|
|
24
|
+
* — for a range starting at 10, the 5 is rewritten before the 0 arrives.
|
|
25
|
+
* `NumberInput` already holds that line; this passes the range through and
|
|
26
|
+
* stays out of it.
|
|
27
|
+
*/
|
|
28
|
+
type __VLS_Props = {
|
|
29
|
+
/** Names both controls. Already translated. */
|
|
30
|
+
label: string;
|
|
31
|
+
min?: number | undefined;
|
|
32
|
+
max?: number | undefined;
|
|
33
|
+
step?: number | undefined;
|
|
34
|
+
/** Names the number field's step-down button. Already translated. */
|
|
35
|
+
decrementLabel: string;
|
|
36
|
+
/** Names the number field's step-up button. Already translated. */
|
|
37
|
+
incrementLabel: string;
|
|
38
|
+
hint?: string | undefined;
|
|
39
|
+
disabled?: boolean | undefined;
|
|
40
|
+
/**
|
|
41
|
+
* Turns the number into something a person would say — "45 minutes", "₺12".
|
|
42
|
+
*
|
|
43
|
+
* The slider's readout is the number field here, so this is only what a
|
|
44
|
+
* screen reader hears for the slider: `aria-valuetext`, which without it
|
|
45
|
+
* is a bare number and a bare number is not an answer to anything.
|
|
46
|
+
*/
|
|
47
|
+
format?: ((value: number) => string) | undefined;
|
|
48
|
+
};
|
|
49
|
+
type __VLS_ModelProps = {
|
|
50
|
+
modelValue?: number;
|
|
51
|
+
};
|
|
52
|
+
type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
|
|
53
|
+
declare const __VLS_export: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
|
|
54
|
+
"update:modelValue": (value: number) => any;
|
|
55
|
+
}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
|
|
56
|
+
"onUpdate:modelValue"?: (value: number) => any;
|
|
57
|
+
}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
58
|
+
declare const _default: typeof __VLS_export;
|
|
59
|
+
export default _default;
|
package/dist/index.d.ts
CHANGED
|
@@ -60,6 +60,11 @@ export { default as BaseCheckbox } from './components/BaseCheckbox.vue';
|
|
|
60
60
|
export { default as BaseRadioGroup } from './components/BaseRadioGroup.vue';
|
|
61
61
|
export { default as BaseSelect } from './components/BaseSelect.vue';
|
|
62
62
|
export { default as BaseSlider } from './components/BaseSlider.vue';
|
|
63
|
+
/**
|
|
64
|
+
* A slider and a number field on one value: drag to find it, type to land
|
|
65
|
+
* on it. See `SliderField.vue` for why both carry the same name.
|
|
66
|
+
*/
|
|
67
|
+
export { default as SliderField } from './components/SliderField.vue';
|
|
63
68
|
export { default as BaseSpinner } from './components/BaseSpinner.vue';
|
|
64
69
|
export { default as BaseSwitch } from './components/BaseSwitch.vue';
|
|
65
70
|
export { default as BaseTable } from './components/BaseTable.vue';
|