@bridge-ui/vue 0.0.7 → 0.0.8
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/ai/AGENTS.md +31 -0
- package/ai/README.md +35 -0
- package/ai/guidelines/core.md +44 -0
- package/ai/llms.txt +38 -0
- package/ai/skills/bridge-ui-components/SKILL.md +37 -0
- package/ai/skills/bridge-ui-forms/SKILL.md +38 -0
- package/ai/skills/bridge-ui-overlays/SKILL.md +37 -0
- package/ai/skills/bridge-ui-setup/SKILL.md +38 -0
- package/bin/__tests__/ai.test.ts +319 -0
- package/bin/ai.mjs +469 -0
- package/dist/Adapters/I18n/useI18nAdapter.d.ts +1 -1
- package/dist/Adapters/Icon/useIconAdapter.d.ts +1 -1
- package/dist/Components/Autocomplete/Autocomplete.vue.d.ts +5 -5
- package/dist/Components/Autocomplete/composables/useAutocomplete.d.ts +3 -2
- package/dist/Components/Autocomplete/composables/useAutocomplete.js +6 -2
- package/dist/Components/Avatar/composables/useAvatar.d.ts +1 -1
- package/dist/Components/BaseField/BaseField.js +5 -0
- package/dist/Components/BaseField/BaseField.vue.d.ts +15 -0
- package/dist/Components/BaseField/BaseField.vue_vue_type_script_setup_true_lang.js +41 -0
- package/dist/Components/BaseField/BaseFieldLabel.js +5 -0
- package/dist/Components/{OtpField/OtpFieldLabel.vue.d.ts → BaseField/BaseFieldLabel.vue.d.ts} +2 -2
- package/dist/Components/{OtpField/OtpFieldLabel.vue_vue_type_script_setup_true_lang.js → BaseField/BaseFieldLabel.vue_vue_type_script_setup_true_lang.js} +2 -2
- package/dist/Components/BaseField/baseField.types.d.ts +222 -0
- package/dist/Components/BaseField/composables/useBaseField.d.ts +55 -0
- package/dist/Components/BaseField/composables/useBaseField.js +131 -0
- package/dist/Components/BaseField/index.d.ts +4 -0
- package/dist/Components/BaseField/index.js +3 -0
- package/dist/Components/Button/composables/useButton.d.ts +1 -1
- package/dist/Components/Checkbox/composables/useCheckbox.d.ts +1 -1
- package/dist/Components/Checkbox/composables/useCheckbox.js +1 -1
- package/dist/Components/Chip/Chip.vue.d.ts +1 -1
- package/dist/Components/Chip/composables/useChip.d.ts +1 -1
- package/dist/Components/Drawer/Drawer.vue.d.ts +2 -2
- package/dist/Components/Drawer/composables/useDrawer.d.ts +1 -1
- package/dist/Components/FormControl/composables/useFormControl.d.ts +11 -2
- package/dist/Components/FormControl/composables/useFormControl.js +57 -53
- package/dist/Components/FormControl/index.d.ts +1 -1
- package/dist/Components/FormField/composables/useFormField.d.ts +5 -1
- package/dist/Components/FormField/composables/useFormField.js +1 -1
- package/dist/Components/ListItem/ListItem.vue.d.ts +1 -1
- package/dist/Components/ListItem/composables/useListItem.d.ts +1 -1
- package/dist/Components/Listbox/Listbox.vue.d.ts +3 -3
- package/dist/Components/Listbox/Listbox.vue_vue_type_script_setup_true_lang.js +2 -1
- package/dist/Components/Listbox/composables/useListbox.d.ts +10 -1
- package/dist/Components/Listbox/composables/useListbox.js +20 -20
- package/dist/Components/Listbox/index.d.ts +1 -0
- package/dist/Components/Listbox/listbox.types.d.ts +6 -0
- package/dist/Components/Menu/Menu.vue.d.ts +2 -2
- package/dist/Components/Modal/Modal.vue.d.ts +2 -2
- package/dist/Components/Modal/composables/useModal.d.ts +1 -1
- package/dist/Components/NumberField/NumberField.vue.d.ts +2 -2
- package/dist/Components/NumberField/composables/useNumberField.d.ts +2 -2
- package/dist/Components/NumberField/composables/useNumberField.js +4 -1
- package/dist/Components/OtpField/OtpField.vue.d.ts +3 -3
- package/dist/Components/OtpField/OtpField.vue_vue_type_script_setup_true_lang.js +34 -52
- package/dist/Components/OtpField/composables/useOtpField.d.ts +40 -213
- package/dist/Components/OtpField/composables/useOtpField.js +92 -150
- package/dist/Components/OtpField/otpField.types.d.ts +10 -180
- package/dist/Components/PasswordField/composables/usePasswordField.d.ts +2 -2
- package/dist/Components/PasswordField/composables/usePasswordField.js +4 -1
- package/dist/Components/Radio/composables/useRadio.d.ts +1 -1
- package/dist/Components/Radio/composables/useRadio.js +1 -1
- package/dist/Components/Select/Select.vue.d.ts +4 -4
- package/dist/Components/Select/composables/useSelect.d.ts +3 -2
- package/dist/Components/Select/composables/useSelect.js +6 -2
- package/dist/Components/Slider/Slider.js +5 -0
- package/dist/Components/Slider/Slider.vue.d.ts +25 -0
- package/dist/Components/Slider/Slider.vue_vue_type_script_setup_true_lang.js +113 -0
- package/dist/Components/Slider/composables/useSlider.d.ts +482 -0
- package/dist/Components/Slider/composables/useSlider.js +287 -0
- package/dist/Components/Slider/index.d.ts +4 -0
- package/dist/Components/Slider/index.js +3 -0
- package/dist/Components/Slider/slider.types.d.ts +169 -0
- package/dist/Components/Snackbar/Snackbar.vue.d.ts +2 -2
- package/dist/Components/Switch/composables/useSwitch.d.ts +1 -1
- package/dist/Components/Switch/composables/useSwitch.js +1 -1
- package/dist/Components/Tabs/Tabs.vue.d.ts +2 -2
- package/dist/Components/TextField/composables/useTextField.d.ts +2 -2
- package/dist/Components/TextField/composables/useTextField.js +1 -1
- package/dist/Components/Textarea/composables/useTextarea.d.ts +2 -2
- package/dist/Components/Textarea/composables/useTextarea.js +1 -0
- package/dist/Utils/index.d.ts +3 -3
- package/dist/Utils/index.js +5 -2
- package/dist/augments.d.ts +29 -17
- package/dist/index.d.ts +5 -1
- package/dist/index.js +59 -55
- package/docs/README.md +56 -0
- package/docs/components/Alert.md +96 -0
- package/docs/components/Autocomplete.md +198 -0
- package/docs/components/Avatar.md +60 -0
- package/docs/components/Badge.md +47 -0
- package/docs/components/BaseField.md +126 -0
- package/docs/components/BridgeUIProvider.md +151 -0
- package/docs/components/Button.md +93 -0
- package/docs/components/Card.md +287 -0
- package/docs/components/Checkbox.md +87 -0
- package/docs/components/Divider.md +56 -0
- package/docs/components/Drawer.md +137 -0
- package/docs/components/FormControl.md +66 -0
- package/docs/components/FormField.md +71 -0
- package/docs/components/I18n.md +125 -0
- package/docs/components/Icon.md +88 -0
- package/docs/components/Label.md +31 -0
- package/docs/components/Link.md +71 -0
- package/docs/components/List.md +167 -0
- package/docs/components/Menu.md +97 -0
- package/docs/components/Modal.md +154 -0
- package/docs/components/NumberField.md +80 -0
- package/docs/components/OtpField.md +133 -0
- package/docs/components/PasswordField.md +82 -0
- package/docs/components/Progress.md +68 -0
- package/docs/components/Radio.md +91 -0
- package/docs/components/Select.md +181 -0
- package/docs/components/Skeleton.md +38 -0
- package/docs/components/Slider.md +140 -0
- package/docs/components/Snackbar.md +99 -0
- package/docs/components/Spinner.md +61 -0
- package/docs/components/Switch.md +72 -0
- package/docs/components/Tabs.md +207 -0
- package/docs/components/TextField.md +72 -0
- package/docs/components/Textarea.md +80 -0
- package/docs/components/Tooltip.md +125 -0
- package/docs/components/useBreakpoint.md +100 -0
- package/docs/components/useDialogAction.md +97 -0
- package/docs/components/useDrawerAction.md +75 -0
- package/docs/components/useModalAction.md +75 -0
- package/docs/components/useSnackbarAction.md +85 -0
- package/docs/examples/i18n-dictionary.ts +48 -0
- package/docs/examples/i18n-vue-i18n.ts +34 -0
- package/docs/examples/icon-fontawesome.ts +112 -0
- package/docs/examples/icon-heroicons.ts +57 -0
- package/docs/examples/icon-lucide.ts +57 -0
- package/docs/examples/icon-phosphor.ts +57 -0
- package/docs/examples/icon-tabler.ts +57 -0
- package/package.json +12 -5
- package/dist/Components/OtpField/OtpFieldLabel.js +0 -5
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { hasNamedSlot as e, hasSlotOrProp as t, isPropPresent as n, resolveNamedSlot as r } from "../../Utils/slotOrProp.js";
|
|
2
2
|
import i from "../Label/Label.js";
|
|
3
3
|
import { Fragment as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createTextVNode as l, defineComponent as u, mergeProps as d, normalizeProps as f, openBlock as p, resolveDynamicComponent as m, toDisplayString as h, unref as g, withCtx as _ } from "vue";
|
|
4
|
-
//#region src/Components/
|
|
4
|
+
//#region src/Components/BaseField/BaseFieldLabel.vue?vue&type=script&setup=true&lang.ts
|
|
5
5
|
var v = /* @__PURE__ */ u({
|
|
6
|
-
__name: "
|
|
6
|
+
__name: "BaseFieldLabel",
|
|
7
7
|
props: { api: {} },
|
|
8
8
|
setup(u) {
|
|
9
9
|
return (v, y) => g(t)(u.api.slots, "label", u.api.merged.value.label) ? (p(), o(g(i), f(d({ key: 0 }, u.api.fieldLabelProps.value)), {
|
|
@@ -0,0 +1,222 @@
|
|
|
1
|
+
import { HTMLAttributes, Slot } from 'vue';
|
|
2
|
+
import { BaseFieldInvalidated, BaseFieldSize, MergeHtmlProps, MergeProps } from '@bridge-ui/core';
|
|
3
|
+
import { UseBaseFieldReturn } from './composables/useBaseField';
|
|
4
|
+
import { LabelProps } from '../Label/label.types';
|
|
5
|
+
export interface BaseFieldSizeOverrides {}
|
|
6
|
+
export interface BaseFieldClasses {
|
|
7
|
+
/**
|
|
8
|
+
* Classes merged onto the corner label in the header row.
|
|
9
|
+
*/
|
|
10
|
+
corner?: string;
|
|
11
|
+
/**
|
|
12
|
+
* Classes merged onto the helper text below the control group.
|
|
13
|
+
*/
|
|
14
|
+
description?: string;
|
|
15
|
+
/**
|
|
16
|
+
* Classes merged onto the inline-end adornment slot wrapper.
|
|
17
|
+
*/
|
|
18
|
+
end?: string;
|
|
19
|
+
/**
|
|
20
|
+
* Classes merged onto the error message below the control group.
|
|
21
|
+
*/
|
|
22
|
+
errorMessage?: string;
|
|
23
|
+
/**
|
|
24
|
+
* Classes merged onto the control group wrapper.
|
|
25
|
+
*/
|
|
26
|
+
group?: string;
|
|
27
|
+
/**
|
|
28
|
+
* Classes merged onto the label + corner header row.
|
|
29
|
+
*/
|
|
30
|
+
header?: string;
|
|
31
|
+
/**
|
|
32
|
+
* Classes merged onto the primary label.
|
|
33
|
+
*/
|
|
34
|
+
label?: string;
|
|
35
|
+
/**
|
|
36
|
+
* Classes merged onto the required asterisk.
|
|
37
|
+
*/
|
|
38
|
+
required?: string;
|
|
39
|
+
/**
|
|
40
|
+
* Classes merged onto the root wrapper.
|
|
41
|
+
*/
|
|
42
|
+
root?: string;
|
|
43
|
+
/**
|
|
44
|
+
* Classes merged onto the inline-start adornment slot wrapper.
|
|
45
|
+
*/
|
|
46
|
+
start?: string;
|
|
47
|
+
}
|
|
48
|
+
export interface BaseFieldCustomProps {
|
|
49
|
+
/**
|
|
50
|
+
* Props forwarded to the corner label element.
|
|
51
|
+
*/
|
|
52
|
+
corner?: HTMLAttributes;
|
|
53
|
+
/**
|
|
54
|
+
* Props forwarded to the helper text below the control group.
|
|
55
|
+
*/
|
|
56
|
+
description?: HTMLAttributes;
|
|
57
|
+
/**
|
|
58
|
+
* Props forwarded to the inline-end adornment slot wrapper.
|
|
59
|
+
*/
|
|
60
|
+
end?: HTMLAttributes;
|
|
61
|
+
/**
|
|
62
|
+
* Props forwarded to the error message element.
|
|
63
|
+
*/
|
|
64
|
+
errorMessage?: HTMLAttributes;
|
|
65
|
+
/**
|
|
66
|
+
* Props forwarded to the control group wrapper.
|
|
67
|
+
*/
|
|
68
|
+
group?: HTMLAttributes;
|
|
69
|
+
/**
|
|
70
|
+
* Props forwarded to the label + corner header row.
|
|
71
|
+
*/
|
|
72
|
+
header?: HTMLAttributes;
|
|
73
|
+
/**
|
|
74
|
+
* Error-state message colors (`errorMessage`). Label colors come from `Label`
|
|
75
|
+
* when `error` is set.
|
|
76
|
+
*
|
|
77
|
+
* @default undefined
|
|
78
|
+
*/
|
|
79
|
+
invalidated?: Partial<BaseFieldInvalidated>;
|
|
80
|
+
/**
|
|
81
|
+
* Props forwarded to the primary `Label` (content stays owned by `BaseField`).
|
|
82
|
+
*
|
|
83
|
+
* @default undefined
|
|
84
|
+
*/
|
|
85
|
+
label?: Partial<Omit<LabelProps, "children">>;
|
|
86
|
+
/**
|
|
87
|
+
* Props forwarded to the root wrapper.
|
|
88
|
+
*/
|
|
89
|
+
root?: HTMLAttributes;
|
|
90
|
+
/**
|
|
91
|
+
* Props forwarded to the inline-start adornment slot wrapper.
|
|
92
|
+
*/
|
|
93
|
+
start?: HTMLAttributes;
|
|
94
|
+
}
|
|
95
|
+
export interface BaseFieldOwnProps {
|
|
96
|
+
/**
|
|
97
|
+
* Classes for the field chrome and control group layout.
|
|
98
|
+
*
|
|
99
|
+
* @default undefined
|
|
100
|
+
*/
|
|
101
|
+
classes?: BaseFieldClasses;
|
|
102
|
+
/**
|
|
103
|
+
* Associates labels and helper text with the control group. When omitted, an
|
|
104
|
+
* id is generated automatically.
|
|
105
|
+
*
|
|
106
|
+
* @default undefined
|
|
107
|
+
*/
|
|
108
|
+
controlId?: string;
|
|
109
|
+
/**
|
|
110
|
+
* Secondary label text at the inline end of the header row.
|
|
111
|
+
*
|
|
112
|
+
* @default undefined
|
|
113
|
+
*/
|
|
114
|
+
corner?: string;
|
|
115
|
+
/**
|
|
116
|
+
* Extra props for internal parts (`root`, `group`, `label`, …).
|
|
117
|
+
*
|
|
118
|
+
* @default undefined
|
|
119
|
+
*/
|
|
120
|
+
customProps?: BaseFieldCustomProps;
|
|
121
|
+
/**
|
|
122
|
+
* Helper text below the control group (hidden when the field is invalid).
|
|
123
|
+
*
|
|
124
|
+
* @default undefined
|
|
125
|
+
*/
|
|
126
|
+
description?: string;
|
|
127
|
+
/**
|
|
128
|
+
* Whether the field control is disabled.
|
|
129
|
+
*
|
|
130
|
+
* @default false
|
|
131
|
+
*/
|
|
132
|
+
disabled?: boolean;
|
|
133
|
+
/**
|
|
134
|
+
* When `true`, applies invalid styling on the label and control group.
|
|
135
|
+
*
|
|
136
|
+
* @default false
|
|
137
|
+
*/
|
|
138
|
+
error?: boolean;
|
|
139
|
+
/**
|
|
140
|
+
* Error message below the control group. Shown only when set (or via
|
|
141
|
+
* `errorMessage` slot).
|
|
142
|
+
*
|
|
143
|
+
* @default undefined
|
|
144
|
+
*/
|
|
145
|
+
errorMessage?: string;
|
|
146
|
+
/**
|
|
147
|
+
* Pre-composed field chrome API from a parent composable. Used by
|
|
148
|
+
* `<BaseField :field="…" />`; not set on OtpField, Slider, or similar
|
|
149
|
+
* wrappers.
|
|
150
|
+
*
|
|
151
|
+
* @default undefined
|
|
152
|
+
*/
|
|
153
|
+
field?: UseBaseFieldReturn;
|
|
154
|
+
/**
|
|
155
|
+
* When `true`, does not reserve space below the group for error messages.
|
|
156
|
+
*
|
|
157
|
+
* @default false
|
|
158
|
+
*/
|
|
159
|
+
hideErrorMessage?: boolean;
|
|
160
|
+
/**
|
|
161
|
+
* The primary label text above the control group.
|
|
162
|
+
*
|
|
163
|
+
* @default undefined
|
|
164
|
+
*/
|
|
165
|
+
label?: string;
|
|
166
|
+
/**
|
|
167
|
+
* Whether the field control is read-only.
|
|
168
|
+
*
|
|
169
|
+
* @default false
|
|
170
|
+
*/
|
|
171
|
+
readonly?: boolean;
|
|
172
|
+
/**
|
|
173
|
+
* Shows a red asterisk on the label.
|
|
174
|
+
*
|
|
175
|
+
* @default false
|
|
176
|
+
*/
|
|
177
|
+
required?: boolean;
|
|
178
|
+
/**
|
|
179
|
+
* Label typography and control group gap scale.
|
|
180
|
+
*
|
|
181
|
+
* @default "md"
|
|
182
|
+
*/
|
|
183
|
+
size?: MergeProps<BaseFieldSize, BaseFieldSizeOverrides>;
|
|
184
|
+
/**
|
|
185
|
+
* Chrome slots (`label`, `corner`, `description`, `errorMessage`, …) and the
|
|
186
|
+
* control.
|
|
187
|
+
*
|
|
188
|
+
* @default undefined
|
|
189
|
+
*/
|
|
190
|
+
slots?: BaseFieldSlots;
|
|
191
|
+
}
|
|
192
|
+
export interface BaseFieldSlots {
|
|
193
|
+
/**
|
|
194
|
+
* Secondary header text at the inline end.
|
|
195
|
+
*/
|
|
196
|
+
corner?: Slot;
|
|
197
|
+
/**
|
|
198
|
+
* The form control (input, pin group, slider track, …).
|
|
199
|
+
*/
|
|
200
|
+
default?: Slot<undefined>;
|
|
201
|
+
/**
|
|
202
|
+
* Helper text below the control group.
|
|
203
|
+
*/
|
|
204
|
+
description?: Slot;
|
|
205
|
+
/**
|
|
206
|
+
* Inline-end slot beside the control group (e.g. a button or timer).
|
|
207
|
+
*/
|
|
208
|
+
end?: Slot;
|
|
209
|
+
/**
|
|
210
|
+
* Error message below the control group.
|
|
211
|
+
*/
|
|
212
|
+
errorMessage?: Slot;
|
|
213
|
+
/**
|
|
214
|
+
* Primary label content.
|
|
215
|
+
*/
|
|
216
|
+
label?: Slot;
|
|
217
|
+
/**
|
|
218
|
+
* Inline-start slot beside the control group (e.g. an icon or button).
|
|
219
|
+
*/
|
|
220
|
+
start?: Slot;
|
|
221
|
+
}
|
|
222
|
+
export type BaseFieldProps = MergeHtmlProps<BaseFieldOwnProps, Omit<HTMLAttributes, "color">>;
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
import { HTMLAttributes, MaybeRefOrGetter } from 'vue';
|
|
2
|
+
import { LibDefaultsShape, MergeLibDefaults } from '@bridge-ui/core';
|
|
3
|
+
import { BaseFieldClasses, BaseFieldOwnProps } from '../baseField.types';
|
|
4
|
+
import { LabelProps } from '../../Label/label.types';
|
|
5
|
+
export type BaseFieldOptions = {
|
|
6
|
+
/**
|
|
7
|
+
* Public registry key that owns BaseField chrome defaults/tokens.
|
|
8
|
+
*/
|
|
9
|
+
componentName?: "Slider" | "OtpField";
|
|
10
|
+
/**
|
|
11
|
+
* Resolve `Label` `for` from `controlId`. Defaults to the control id itself.
|
|
12
|
+
*/
|
|
13
|
+
labelHtmlFor?: (controlId: string) => string;
|
|
14
|
+
};
|
|
15
|
+
export declare const baseFieldBridgeKeys: readonly ["size", "error", "label", "corner", "classes", "disabled", "readonly", "required", "controlId", "customProps", "description", "errorMessage", "hideErrorMessage"];
|
|
16
|
+
type BaseFieldLibDefaults = LibDefaultsShape<Omit<BaseFieldOwnProps, "field">, "size" | "error" | "hideErrorMessage">;
|
|
17
|
+
type BaseFieldMerged = MergeLibDefaults<Omit<BaseFieldOwnProps, "field">, BaseFieldLibDefaults>;
|
|
18
|
+
/**
|
|
19
|
+
* Composes shared vertical field chrome: label, corner, start/end slots,
|
|
20
|
+
* description, and error message.
|
|
21
|
+
*/
|
|
22
|
+
export declare function useBaseField(props: MaybeRefOrGetter<Omit<BaseFieldOwnProps, "field">>, libDefaults?: BaseFieldLibDefaults, options?: BaseFieldOptions): {
|
|
23
|
+
slots: Readonly<{
|
|
24
|
+
[name: string]: import('vue').Slot<any> | undefined;
|
|
25
|
+
}>;
|
|
26
|
+
merged: import('vue').ComputedRef<BaseFieldMerged>;
|
|
27
|
+
rootBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", HTMLAttributes | undefined, {
|
|
28
|
+
slots?: import('../baseField.types').BaseFieldSlots | undefined;
|
|
29
|
+
class: string;
|
|
30
|
+
}>>;
|
|
31
|
+
errorBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", HTMLAttributes | undefined, {}>>;
|
|
32
|
+
groupBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", HTMLAttributes | undefined, {
|
|
33
|
+
role: string;
|
|
34
|
+
id: string;
|
|
35
|
+
"aria-describedby": string | undefined;
|
|
36
|
+
"aria-disabled": true | undefined;
|
|
37
|
+
"aria-invalid": true | undefined;
|
|
38
|
+
}>>;
|
|
39
|
+
controlId: import('vue').ComputedRef<string>;
|
|
40
|
+
headerBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", HTMLAttributes | undefined, {}>>;
|
|
41
|
+
cornerBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", HTMLAttributes | undefined, {}>>;
|
|
42
|
+
isDisabled: import('vue').ComputedRef<boolean>;
|
|
43
|
+
isReadonly: import('vue').ComputedRef<boolean>;
|
|
44
|
+
sizeClasses: import('vue').ComputedRef<import('@bridge-ui/core').BaseFieldSizeItem | undefined>;
|
|
45
|
+
endSlotBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", HTMLAttributes | undefined, {}>>;
|
|
46
|
+
invalidated: import('vue').ComputedRef<boolean>;
|
|
47
|
+
startSlotBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", HTMLAttributes | undefined, {}>>;
|
|
48
|
+
mergedClasses: import('vue').ComputedRef<Partial<BaseFieldClasses>>;
|
|
49
|
+
ariaDescribedBy: import('vue').ComputedRef<string | undefined>;
|
|
50
|
+
fieldLabelProps: import('vue').ComputedRef<LabelProps>;
|
|
51
|
+
descriptionBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", HTMLAttributes | undefined, {}>>;
|
|
52
|
+
showErrorMessageContent: import('vue').ComputedRef<boolean>;
|
|
53
|
+
};
|
|
54
|
+
export type UseBaseFieldReturn = ReturnType<typeof useBaseField>;
|
|
55
|
+
export {};
|
|
@@ -0,0 +1,131 @@
|
|
|
1
|
+
import { hasSlotOrProp as e } from "../../../Utils/slotOrProp.js";
|
|
2
|
+
import { mergeNestedComponentProps as t, mergePartBind as n, useBridgeUIComponent as r, useBridgeUIMergedRegistryClasses as i } from "../../../Utils/index.js";
|
|
3
|
+
import { computed as a, toValue as o, useAttrs as s, useId as c, useSlots as l } from "vue";
|
|
4
|
+
import { cn as u, mergeBridgeUILayeredClasses as d, splitComponentProps as f } from "@bridge-ui/core";
|
|
5
|
+
import { get as p, omit as m } from "es-toolkit/compat";
|
|
6
|
+
import { invalidatedProps as h, sizeProps as g } from "@bridge-ui/core/Tokens/BaseField";
|
|
7
|
+
//#region src/Components/BaseField/composables/useBaseField.ts
|
|
8
|
+
var _ = [
|
|
9
|
+
"size",
|
|
10
|
+
"error",
|
|
11
|
+
"label",
|
|
12
|
+
"corner",
|
|
13
|
+
"classes",
|
|
14
|
+
"disabled",
|
|
15
|
+
"readonly",
|
|
16
|
+
"required",
|
|
17
|
+
"controlId",
|
|
18
|
+
"customProps",
|
|
19
|
+
"description",
|
|
20
|
+
"errorMessage",
|
|
21
|
+
"hideErrorMessage"
|
|
22
|
+
];
|
|
23
|
+
function v(v, y = {
|
|
24
|
+
size: "md",
|
|
25
|
+
error: !1,
|
|
26
|
+
hideErrorMessage: !1
|
|
27
|
+
}, b = {}) {
|
|
28
|
+
let x = s(), S = l(), C = c(), w = a(() => f({
|
|
29
|
+
bridgeKeys: _,
|
|
30
|
+
props: {
|
|
31
|
+
...x,
|
|
32
|
+
...o(v)
|
|
33
|
+
}
|
|
34
|
+
})), { merged: T, entry: E } = r({
|
|
35
|
+
libDefaults: y,
|
|
36
|
+
componentName: b.componentName,
|
|
37
|
+
props: () => w.value.componentProps
|
|
38
|
+
}), D = i({
|
|
39
|
+
entry: E,
|
|
40
|
+
props: () => w.value.componentProps
|
|
41
|
+
}), O = a(() => T.value.customProps), k = a(() => T.value.error === !0), A = a(() => !!T.value.disabled), j = a(() => !!T.value.readonly), M = a(() => T.value.controlId ?? w.value.inheritedAttrs.id ?? C), N = a(() => p(d(g, p(E.value, [
|
|
42
|
+
"tokens",
|
|
43
|
+
"baseField",
|
|
44
|
+
"size"
|
|
45
|
+
])), T.value.size ?? "md")), P = a(() => d(h, p(E.value, [
|
|
46
|
+
"tokens",
|
|
47
|
+
"baseField",
|
|
48
|
+
"invalidated"
|
|
49
|
+
]), T.value.customProps?.invalidated)), F = a(() => k.value ? P.value : void 0), I = a(() => !T.value.hideErrorMessage), L = a(() => k.value && e(S, "errorMessage", T.value.errorMessage)), R = a(() => {
|
|
50
|
+
let t = [];
|
|
51
|
+
return !k.value && e(S, "description", T.value.description) && t.push(`${M.value}-description`), k.value && !T.value.hideErrorMessage && e(S, "errorMessage", T.value.errorMessage) && t.push(`${M.value}-error`), t.length > 0 ? t.join(" ") : void 0;
|
|
52
|
+
}), z = a(() => n(O.value?.root, {
|
|
53
|
+
class: u(w.value.inheritedAttrs.class),
|
|
54
|
+
...m(w.value.inheritedAttrs, ["class", "id"])
|
|
55
|
+
}, u({
|
|
56
|
+
"group w-full relative": !0,
|
|
57
|
+
"aria-disabled:pointer-events-none aria-disabled:select-none aria-disabled:opacity-60": !0,
|
|
58
|
+
"aria-readonly:pointer-events-none aria-readonly:select-none": !0,
|
|
59
|
+
[D.value.root ?? ""]: !0
|
|
60
|
+
}))), B = a(() => n(O.value?.header, {}, u({
|
|
61
|
+
"flex w-full gap-x-2 mb-1.5": !0,
|
|
62
|
+
"justify-between items-end": e(S, "label", T.value.label),
|
|
63
|
+
"justify-end": !e(S, "label", T.value.label),
|
|
64
|
+
[D.value.header ?? ""]: !0
|
|
65
|
+
}))), V = a(() => n(O.value?.corner, {}, u({
|
|
66
|
+
"text-gray-500 dark:text-gray-400": !0,
|
|
67
|
+
[N.value?.text ?? ""]: !0,
|
|
68
|
+
[D.value.corner ?? ""]: !0
|
|
69
|
+
}))), H = a(() => n(O.value?.group, {
|
|
70
|
+
role: "group",
|
|
71
|
+
id: M.value,
|
|
72
|
+
"aria-describedby": R.value,
|
|
73
|
+
"aria-disabled": A.value || void 0,
|
|
74
|
+
"aria-invalid": k.value || void 0
|
|
75
|
+
}, u({
|
|
76
|
+
"flex flex-wrap items-center": !0,
|
|
77
|
+
[N.value?.group ?? ""]: !0,
|
|
78
|
+
[D.value.group ?? ""]: !0
|
|
79
|
+
}))), U = a(() => n(O.value?.start, {}, u({
|
|
80
|
+
"group/start wrapper-start-slot shrink-0 flex items-center [&>*]:min-h-0": !0,
|
|
81
|
+
[D.value.start ?? ""]: !0
|
|
82
|
+
}))), W = a(() => n(O.value?.end, {}, u({
|
|
83
|
+
"group/end wrapper-end-slot shrink-0 flex items-center [&>*]:min-h-0": !0,
|
|
84
|
+
[D.value.end ?? ""]: !0
|
|
85
|
+
}))), G = a(() => n(O.value?.description, {}, u({
|
|
86
|
+
"mt-2 text-gray-500 dark:text-gray-400": !0,
|
|
87
|
+
[N.value?.text ?? ""]: !0,
|
|
88
|
+
[D.value.description ?? ""]: !0
|
|
89
|
+
})));
|
|
90
|
+
return {
|
|
91
|
+
slots: S,
|
|
92
|
+
merged: T,
|
|
93
|
+
rootBind: z,
|
|
94
|
+
errorBind: a(() => n(O.value?.errorMessage, {}, u({
|
|
95
|
+
"mt-2": !0,
|
|
96
|
+
"min-h-[1lh]": I.value,
|
|
97
|
+
[F.value?.errorMessage ?? ""]: !0,
|
|
98
|
+
[N.value?.text ?? ""]: !0,
|
|
99
|
+
[D.value.errorMessage ?? ""]: !0
|
|
100
|
+
}))),
|
|
101
|
+
groupBind: H,
|
|
102
|
+
controlId: M,
|
|
103
|
+
headerBind: B,
|
|
104
|
+
cornerBind: V,
|
|
105
|
+
isDisabled: A,
|
|
106
|
+
isReadonly: j,
|
|
107
|
+
sizeClasses: N,
|
|
108
|
+
endSlotBind: W,
|
|
109
|
+
invalidated: k,
|
|
110
|
+
startSlotBind: U,
|
|
111
|
+
mergedClasses: D,
|
|
112
|
+
ariaDescribedBy: R,
|
|
113
|
+
fieldLabelProps: a(() => {
|
|
114
|
+
let e = b.labelHtmlFor ?? ((e) => e);
|
|
115
|
+
return t(O.value?.label, {
|
|
116
|
+
size: T.value.size,
|
|
117
|
+
error: k.value,
|
|
118
|
+
required: T.value.required,
|
|
119
|
+
for: e(M.value),
|
|
120
|
+
classes: {
|
|
121
|
+
required: D.value.required,
|
|
122
|
+
root: u({ [D.value.label ?? ""]: !0 })
|
|
123
|
+
}
|
|
124
|
+
});
|
|
125
|
+
}),
|
|
126
|
+
descriptionBind: G,
|
|
127
|
+
showErrorMessageContent: L
|
|
128
|
+
};
|
|
129
|
+
}
|
|
130
|
+
//#endregion
|
|
131
|
+
export { _ as baseFieldBridgeKeys, v as useBaseField };
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
export type { BaseFieldClasses, BaseFieldCustomProps, BaseFieldOwnProps, BaseFieldProps, BaseFieldSizeOverrides, BaseFieldSlots, } from './baseField.types';
|
|
2
|
+
export { default as BaseField } from './BaseField.vue';
|
|
3
|
+
export { baseFieldBridgeKeys, useBaseField, } from './composables/useBaseField';
|
|
4
|
+
export type { BaseFieldOptions, UseBaseFieldReturn, } from './composables/useBaseField';
|
|
@@ -7,7 +7,7 @@ export declare function useButton(props: ButtonOwnProps, libDefaults: ButtonLibD
|
|
|
7
7
|
merged: import('vue').ComputedRef<ButtonMerged>;
|
|
8
8
|
isMini: import('vue').ComputedRef<boolean>;
|
|
9
9
|
iconBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", Partial<Omit<import('../../Icon').IconProps, "icon">> | undefined, {}>>;
|
|
10
|
-
rootBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Omit<ButtonProps, "color" | "href" | "icon" | "size" | "classes" | "customProps" | "full" | "rounded" | "variant" | "text" | "
|
|
10
|
+
rootBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Omit<ButtonProps, "color" | "href" | "icon" | "size" | "classes" | "customProps" | "full" | "rounded" | "variant" | "text" | "disabled" | "endIcon" | "startIcon" | "as" | "loading" | "density">>>;
|
|
11
11
|
rootHref: import('vue').ComputedRef<string | undefined>;
|
|
12
12
|
rootType: import('vue').ComputedRef<"button" | undefined>;
|
|
13
13
|
endIconBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", Partial<Omit<import('../../Icon').IconProps, "icon">> | undefined, {}>>;
|
|
@@ -241,7 +241,7 @@ export declare function useCheckbox(props: MaybeRefOrGetter<CheckboxOwnProps>, l
|
|
|
241
241
|
hideErrorMessage: NonNullable<boolean | undefined>;
|
|
242
242
|
}>;
|
|
243
243
|
rowBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
|
|
244
|
-
rootBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<Omit<import('../../FormControl').FormControlOwnProps, "field">, "error" | "size" | "classes" | "customProps" | "disabled" | "required" | "
|
|
244
|
+
rootBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Partial<Omit<Omit<import('../../FormControl').FormControlOwnProps, "field">, "error" | "size" | "classes" | "customProps" | "disabled" | "required" | "description" | "errorMessage" | "controlId" | "hideErrorMessage" | "readonly" | "endLabel" | "startLabel">>>>;
|
|
245
245
|
controlId: import('vue').ComputedRef<string>;
|
|
246
246
|
isDisabled: import('vue').ComputedRef<boolean>;
|
|
247
247
|
isReadonly: import('vue').ComputedRef<boolean>;
|
|
@@ -6,8 +6,8 @@ declare const __VLS_base: import('vue').DefineComponent<ChipOwnProps, {}, {}, {}
|
|
|
6
6
|
onDismiss?: ((event: MouseEvent | KeyboardEvent) => any) | undefined;
|
|
7
7
|
}>, {
|
|
8
8
|
size: import('@bridge-ui/core').MergeProps<import('@bridge-ui/core').ChipSize, import('./chip.types').ChipSizeOverrides>;
|
|
9
|
-
disabled: boolean;
|
|
10
9
|
clearLabel: string;
|
|
10
|
+
disabled: boolean;
|
|
11
11
|
dismissible: boolean;
|
|
12
12
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
13
13
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
@@ -6,7 +6,7 @@ type ChipLibDefaults = LibDefaultsShape<ChipOwnProps, "size">;
|
|
|
6
6
|
type ChipMerged = MergeLibDefaults<ChipOwnProps, ChipLibDefaults>;
|
|
7
7
|
export declare function useChip(props: ChipOwnProps, libDefaults: ChipLibDefaults, emit: SetupContext<ChipEmits>["emit"]): {
|
|
8
8
|
merged: import('vue').ComputedRef<ChipMerged>;
|
|
9
|
-
rootBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Omit<ChipProps, "size" | "classes" | "customProps" | "label" | "
|
|
9
|
+
rootBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, Omit<ChipProps, "size" | "classes" | "customProps" | "label" | "clearLabel" | "disabled" | "dismissible">>>;
|
|
10
10
|
labelBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
|
|
11
11
|
clearBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {
|
|
12
12
|
role: string;
|
|
@@ -8,12 +8,12 @@ type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
|
|
|
8
8
|
declare const __VLS_base: import('vue').DefineComponent<__VLS_PublicProps, {
|
|
9
9
|
stackId: import('vue').ComputedRef<string>;
|
|
10
10
|
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
|
|
11
|
-
"update:modelValue": (value: boolean) => any;
|
|
12
11
|
close: () => any;
|
|
12
|
+
"update:modelValue": (value: boolean) => any;
|
|
13
13
|
"show-change": (show: boolean) => any;
|
|
14
14
|
}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
|
|
15
|
-
"onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
|
|
16
15
|
onClose?: (() => any) | undefined;
|
|
16
|
+
"onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
|
|
17
17
|
"onShow-change"?: ((show: boolean) => any) | undefined;
|
|
18
18
|
}>, {
|
|
19
19
|
closeOnEscape: boolean;
|
|
@@ -34,7 +34,7 @@ export declare function useDrawer(props: DrawerOwnProps, libDefaults: DrawerLibD
|
|
|
34
34
|
};
|
|
35
35
|
"aria-hidden": boolean | undefined;
|
|
36
36
|
class: string;
|
|
37
|
-
}, "class", import('vue').HTMLAttributes | undefined, Omit<DrawerProps, "size" | "classes" | "customProps" | "closeOnEscape" | "disableScrollLock" | "keepMounted" | "persistent" | "placement" | "teleportTo" | "
|
|
37
|
+
}, "class", import('vue').HTMLAttributes | undefined, Omit<DrawerProps, "size" | "classes" | "customProps" | "closeOnEscape" | "disableScrollLock" | "keepMounted" | "persistent" | "placement" | "teleportTo" | "scroll" | "blur" | "autoFocus" | "closeOnOverlay" | "disableEnforceFocus" | "disableRestoreFocus" | "hideBackdrop" | "stackId" | "transition" | "ariaLabel" | "ariaLabelledBy">>>;
|
|
38
38
|
panelBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<{
|
|
39
39
|
"data-drawer-part": string;
|
|
40
40
|
"data-state": "open" | "closed";
|
|
@@ -5,13 +5,22 @@ import { LabelProps } from '../../Label/label.types';
|
|
|
5
5
|
export declare const formControlBridgeKeys: readonly ["size", "error", "classes", "disabled", "endLabel", "readonly", "required", "controlId", "startLabel", "customProps", "description", "errorMessage", "hideErrorMessage"];
|
|
6
6
|
type FormControlLibDefaults = LibDefaultsShape<FormControlOwnProps, "size" | "error" | "hideErrorMessage">;
|
|
7
7
|
type FormControlMerged = MergeLibDefaults<FormControlOwnProps, FormControlLibDefaults>;
|
|
8
|
-
|
|
8
|
+
/**
|
|
9
|
+
* Options for {@link useFormControl}.
|
|
10
|
+
*/
|
|
11
|
+
export type FormControlOptions = {
|
|
12
|
+
/**
|
|
13
|
+
* Public registry key that owns FormControl chrome defaults/tokens.
|
|
14
|
+
*/
|
|
15
|
+
componentName?: "Radio" | "Switch" | "Checkbox";
|
|
16
|
+
};
|
|
17
|
+
export declare function useFormControl(props: MaybeRefOrGetter<Omit<FormControlOwnProps, "field">>, libDefaults: FormControlLibDefaults, options?: FormControlOptions): {
|
|
9
18
|
slots: Readonly<{
|
|
10
19
|
[name: string]: import('vue').Slot<any> | undefined;
|
|
11
20
|
}>;
|
|
12
21
|
merged: import('vue').ComputedRef<FormControlMerged>;
|
|
13
22
|
rowBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", HTMLAttributes | undefined, {}>>;
|
|
14
|
-
rootBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", HTMLAttributes | undefined, Partial<Omit<Omit<FormControlOwnProps, "field">, "error" | "size" | "classes" | "customProps" | "disabled" | "required" | "
|
|
23
|
+
rootBind: import('vue').ComputedRef<import('@bridge-ui/core').MergePartBind<object, "class", HTMLAttributes | undefined, Partial<Omit<Omit<FormControlOwnProps, "field">, "error" | "size" | "classes" | "customProps" | "disabled" | "required" | "description" | "errorMessage" | "controlId" | "hideErrorMessage" | "readonly" | "endLabel" | "startLabel">>>>;
|
|
15
24
|
controlId: import('vue').ComputedRef<string>;
|
|
16
25
|
isDisabled: import('vue').ComputedRef<boolean>;
|
|
17
26
|
isReadonly: import('vue').ComputedRef<boolean>;
|