@codemonster-ru/vueforge 0.45.0 → 0.46.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 +61 -2
- package/dist/index.css +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.ts.mjs +2057 -1915
- package/dist/index.ts.umd.js +3 -3
- package/dist/package/components/__tests__/password-input.test.d.ts +1 -0
- package/dist/package/components/number-input.vue.d.ts +1 -1
- package/dist/package/components/password-input.vue.d.ts +75 -0
- package/dist/package/components/rating.vue.d.ts +1 -1
- package/dist/package/components/slider.vue.d.ts +1 -1
- package/dist/package/config/theme-core.d.ts +36 -0
- package/dist/package/themes/default/components/password-input.d.ts +36 -0
- package/dist/package/themes/default/index.d.ts +35 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -27,6 +27,7 @@ import {
|
|
|
27
27
|
DefaultTheme,
|
|
28
28
|
Button,
|
|
29
29
|
Input,
|
|
30
|
+
PasswordInput,
|
|
30
31
|
NumberInput,
|
|
31
32
|
FormField,
|
|
32
33
|
Textarea,
|
|
@@ -79,6 +80,7 @@ app.use(VueForge, {
|
|
|
79
80
|
<FormField label="Name" hint="Required field">
|
|
80
81
|
<Input v-model="name" placeholder="Your name" />
|
|
81
82
|
</FormField>
|
|
83
|
+
<PasswordInput v-model="password" placeholder="Enter password" show-strength />
|
|
82
84
|
<NumberInput v-model="age" :min="0" :max="120" :step="1" />
|
|
83
85
|
<Textarea v-model="bio" placeholder="Tell us about yourself" />
|
|
84
86
|
<FileUpload v-model="resume" accept=".pdf,.doc,.docx" />
|
|
@@ -170,6 +172,7 @@ app.use(VueForge, {
|
|
|
170
172
|
- ToastContainer
|
|
171
173
|
- Alert
|
|
172
174
|
- Input
|
|
175
|
+
- PasswordInput
|
|
173
176
|
- NumberInput
|
|
174
177
|
- FormField
|
|
175
178
|
- Textarea
|
|
@@ -208,9 +211,10 @@ app.use(VueForge, {
|
|
|
208
211
|
- TreeSelect
|
|
209
212
|
- VirtualScroller
|
|
210
213
|
|
|
211
|
-
Input / Textarea (quick API):
|
|
214
|
+
Input / Password / Textarea (quick API):
|
|
212
215
|
|
|
213
216
|
- `Input`: single-line control, supports `v-model`, `size`, `variant`, `disabled`, `readonly`.
|
|
217
|
+
- `PasswordInput`: password control, supports visibility toggle, strength meter, CapsLock hint, `size`, and `variant`.
|
|
214
218
|
- `NumberInput`: numeric control, supports `v-model`, `min`, `max`, `step`, `precision`, `controls`, `size`, `variant`.
|
|
215
219
|
- `Textarea`: multi-line control, same as Input plus `rows`.
|
|
216
220
|
- `TagInput`: token/tag control, supports `v-model` (array), suggestions, custom tags, `maxTags`, `clearable`, `size`, `variant`.
|
|
@@ -711,6 +715,61 @@ Example:
|
|
|
711
715
|
<NumberInput v-model="quantity" :min="0" :max="10" :step="1" />
|
|
712
716
|
```
|
|
713
717
|
|
|
718
|
+
## PasswordInput
|
|
719
|
+
|
|
720
|
+
Props:
|
|
721
|
+
|
|
722
|
+
- `modelValue?: string` (v-model)
|
|
723
|
+
- `placeholder?: string`
|
|
724
|
+
- `disabled?: boolean`
|
|
725
|
+
- `readonly?: boolean`
|
|
726
|
+
- `autocomplete?: string` (default `current-password`)
|
|
727
|
+
- `showToggle?: boolean` (default `true`)
|
|
728
|
+
- `showStrength?: boolean` (default `false`)
|
|
729
|
+
- `showCapsLockHint?: boolean` (default `true`)
|
|
730
|
+
- `revealLabel?: string` (default `Show password`)
|
|
731
|
+
- `hideLabel?: string` (default `Hide password`)
|
|
732
|
+
- `revealText?: string` (default `Show`)
|
|
733
|
+
- `hideText?: string` (default `Hide`)
|
|
734
|
+
- `capsLockHint?: string` (default `Caps Lock is on`)
|
|
735
|
+
- `weakLabel?: string` (default `Weak password`)
|
|
736
|
+
- `mediumLabel?: string` (default `Medium password`)
|
|
737
|
+
- `strongLabel?: string` (default `Strong password`)
|
|
738
|
+
- `size?: 'small' | 'normal' | 'large'` (default `normal`)
|
|
739
|
+
- `variant?: 'filled' | 'outlined'` (default `filled`)
|
|
740
|
+
- `ariaLabel?: string` (default `Password input`)
|
|
741
|
+
|
|
742
|
+
Events:
|
|
743
|
+
|
|
744
|
+
- `update:modelValue`
|
|
745
|
+
- `input`
|
|
746
|
+
- `change`
|
|
747
|
+
- `focus`
|
|
748
|
+
- `blur`
|
|
749
|
+
- `toggleVisibility` (payload: `boolean`)
|
|
750
|
+
|
|
751
|
+
Example:
|
|
752
|
+
|
|
753
|
+
```vue
|
|
754
|
+
<PasswordInput v-model="password" show-strength />
|
|
755
|
+
```
|
|
756
|
+
|
|
757
|
+
### PasswordInput tokens
|
|
758
|
+
|
|
759
|
+
Component tokens (override via `theme.overrides.components.passwordInput`):
|
|
760
|
+
|
|
761
|
+
- `gap`, `fontSize`, `padding`
|
|
762
|
+
- `borderRadius`, `borderColor`
|
|
763
|
+
- `backgroundColor`, `textColor`, `placeholderColor`
|
|
764
|
+
- `focusBorderColor`, `focusRingShadow`, `hoverBorderColor`
|
|
765
|
+
- `disabledOpacity`
|
|
766
|
+
- `toggleSize`, `toggleRadius`, `toggleColor`, `toggleHoverBackgroundColor`
|
|
767
|
+
- `strengthGap`, `strengthTrackHeight`, `strengthTrackRadius`, `strengthTrackBackgroundColor`
|
|
768
|
+
- `strengthWeakColor`, `strengthMediumColor`, `strengthStrongColor`
|
|
769
|
+
- `metaFontSize`, `hintColor`
|
|
770
|
+
- `small.fontSize`, `small.padding`
|
|
771
|
+
- `large.fontSize`, `large.padding`
|
|
772
|
+
|
|
714
773
|
## RadioGroup / RadioButton
|
|
715
774
|
|
|
716
775
|
Props (RadioGroup):
|
|
@@ -1739,7 +1798,7 @@ VueForge exposes design tokens as CSS variables generated from the theme preset.
|
|
|
1739
1798
|
Typed tokens:
|
|
1740
1799
|
|
|
1741
1800
|
- `ThemeTokens`/`ThemeOptions`/`ThemePreset` are exported for type-safe theming in TS.
|
|
1742
|
-
- `components.*` accepts component-specific tokens (typed keys: button/card/checkbox/radio/tabs/accordion/toast/alert/input/numberInput/formField/textarea/link/breadcrumbs/menu/modal/confirmDialog/drawer/popover/dropdown/contextMenu/commandPalette/select/autocomplete/multiselect/taginput/datepicker/daterangepicker/timepicker/pagination/switch/tooltip/skeleton/progress/badge/chip/avatar/datatable/slider/stepper/rating/tree/treeselect/virtualScroller).
|
|
1801
|
+
- `components.*` accepts component-specific tokens (typed keys: button/card/checkbox/radio/tabs/accordion/toast/alert/input/passwordInput/numberInput/formField/textarea/link/breadcrumbs/menu/modal/confirmDialog/drawer/popover/dropdown/contextMenu/commandPalette/select/autocomplete/multiselect/taginput/datepicker/daterangepicker/timepicker/pagination/switch/tooltip/skeleton/progress/badge/chip/avatar/datatable/slider/stepper/rating/tree/treeselect/virtualScroller).
|
|
1743
1802
|
|
|
1744
1803
|
Default core values (from `DefaultTheme`):
|
|
1745
1804
|
|