@codemonster-ru/vueforge 0.68.0 → 0.69.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 +39 -1
- package/dist/index.css +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.ts.mjs +1278 -1236
- package/dist/index.ts.umd.js +4 -4
- package/dist/package/components/__tests__/divider.test.d.ts +1 -0
- package/dist/package/components/divider.vue.d.ts +32 -0
- package/dist/package/config/theme-core.d.ts +11 -0
- package/dist/package/themes/default/components/divider.d.ts +11 -0
- package/dist/package/themes/default/index.d.ts +10 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -43,6 +43,7 @@ import {
|
|
|
43
43
|
RichTextEditor,
|
|
44
44
|
FileUpload,
|
|
45
45
|
Breadcrumbs,
|
|
46
|
+
Divider,
|
|
46
47
|
Select,
|
|
47
48
|
Autocomplete,
|
|
48
49
|
Combobox,
|
|
@@ -136,6 +137,7 @@ app.use(VueForge, {
|
|
|
136
137
|
<RichTextEditor v-model="article" />
|
|
137
138
|
<FileUpload v-model="resume" accept=".pdf,.doc,.docx" />
|
|
138
139
|
<Breadcrumbs :items="breadcrumbItems" />
|
|
140
|
+
<Divider label="OR" />
|
|
139
141
|
<Select v-model="role" :options="roles" placeholder="Choose role" />
|
|
140
142
|
<Autocomplete v-model="country" :options="countries" placeholder="Find country" />
|
|
141
143
|
<Combobox v-model="countryId" :options="countries" placeholder="Pick country" clearable />
|
|
@@ -278,6 +280,7 @@ app.use(VueForge, {
|
|
|
278
280
|
- FileUpload
|
|
279
281
|
- Link
|
|
280
282
|
- Breadcrumbs
|
|
283
|
+
- Divider
|
|
281
284
|
- Menu
|
|
282
285
|
- Modal
|
|
283
286
|
- ConfirmDialog
|
|
@@ -342,6 +345,7 @@ Input / InputGroup / Search / Password / Textarea (quick API):
|
|
|
342
345
|
- `AppShell`: application layout shell with sidebar/header/main/footer regions, collapse toggle, and mobile drawer behavior.
|
|
343
346
|
- `KanbanBoard`: task board with draggable cards, customizable column/card slots, and move events.
|
|
344
347
|
- `RichTextEditor`: formatting editor with toolbar actions and Markdown/HTML output.
|
|
348
|
+
- `Divider`: horizontal/vertical visual separator with optional label and style variants.
|
|
345
349
|
- `Wizard`: multi-step flow container with linear navigation, per-step validation, and completion events.
|
|
346
350
|
- `Textarea`: multi-line control, same as Input plus `rows`.
|
|
347
351
|
- `TagInput`: token/tag control, supports `v-model` (array), suggestions, custom tags, `maxTags`, `clearable`, `size`, `variant`.
|
|
@@ -1532,6 +1536,40 @@ Component tokens (override via `theme.overrides.components.breadcrumbs`):
|
|
|
1532
1536
|
- `gap`, `fontSize`, `textColor`, `hoverColor`, `activeColor`
|
|
1533
1537
|
- `separatorColor`, `disabledOpacity`
|
|
1534
1538
|
|
|
1539
|
+
## Divider
|
|
1540
|
+
|
|
1541
|
+
Props:
|
|
1542
|
+
|
|
1543
|
+
- `orientation?: 'horizontal' | 'vertical'` (default `horizontal`)
|
|
1544
|
+
- `variant?: 'solid' | 'dashed' | 'dotted'` (default `solid`)
|
|
1545
|
+
- `inset?: boolean` (default `false`)
|
|
1546
|
+
- `label?: string`
|
|
1547
|
+
- `ariaLabel?: string` (default `Divider`)
|
|
1548
|
+
|
|
1549
|
+
Slots:
|
|
1550
|
+
|
|
1551
|
+
- `default` (optional) - custom label content (horizontal mode only)
|
|
1552
|
+
|
|
1553
|
+
Example:
|
|
1554
|
+
|
|
1555
|
+
```vue
|
|
1556
|
+
<Divider />
|
|
1557
|
+
<Divider label="OR" />
|
|
1558
|
+
<div style="height: 32px; display: flex; align-items: center; gap: 8px">
|
|
1559
|
+
<span>Left</span>
|
|
1560
|
+
<Divider orientation="vertical" />
|
|
1561
|
+
<span>Right</span>
|
|
1562
|
+
</div>
|
|
1563
|
+
```
|
|
1564
|
+
|
|
1565
|
+
### Divider tokens
|
|
1566
|
+
|
|
1567
|
+
Component tokens (override via `theme.overrides.components.divider`):
|
|
1568
|
+
|
|
1569
|
+
- `color`, `textColor`, `thickness`, `minLength`
|
|
1570
|
+
- `gap`, `inset`
|
|
1571
|
+
- `labelPadding`, `labelFontSize`
|
|
1572
|
+
|
|
1535
1573
|
## SegmentedControl
|
|
1536
1574
|
|
|
1537
1575
|
Props:
|
|
@@ -3031,7 +3069,7 @@ VueForge exposes design tokens as CSS variables generated from the theme preset.
|
|
|
3031
3069
|
Typed tokens:
|
|
3032
3070
|
|
|
3033
3071
|
- `ThemeTokens`/`ThemeOptions`/`ThemePreset` are exported for type-safe theming in TS.
|
|
3034
|
-
- `components.*` accepts component-specific tokens (typed keys: button/card/checkbox/radio/tabs/accordion/toast/alert/emptyState/input/inputGroup/inlineEdit/searchInput/mentionInput/passwordInput/otpInput/colorPicker/maskedInput/numberInput/form/formField/textarea/richTextEditor/link/breadcrumbs/menu/modal/confirmDialog/drawer/popover/dropdown/contextMenu/commandPalette/notificationCenter/appShell/kanbanBoard/tour/select/autocomplete/combobox/multiselect/taginput/datepicker/calendar/daterangepicker/timepicker/datetimepicker/pagination/switch/segmentedControl/tooltip/skeleton/progress/badge/chip/filterChips/avatar/datatable/slider/splitter/stepper/wizard/rating/tree/treeselect/virtualScroller).
|
|
3072
|
+
- `components.*` accepts component-specific tokens (typed keys: button/card/checkbox/radio/tabs/accordion/toast/alert/emptyState/input/inputGroup/inlineEdit/searchInput/mentionInput/passwordInput/otpInput/colorPicker/maskedInput/numberInput/form/formField/textarea/richTextEditor/link/breadcrumbs/divider/menu/modal/confirmDialog/drawer/popover/dropdown/contextMenu/commandPalette/notificationCenter/appShell/kanbanBoard/tour/select/autocomplete/combobox/multiselect/taginput/datepicker/calendar/daterangepicker/timepicker/datetimepicker/pagination/switch/segmentedControl/tooltip/skeleton/progress/badge/chip/filterChips/avatar/datatable/slider/splitter/stepper/wizard/rating/tree/treeselect/virtualScroller).
|
|
3035
3073
|
|
|
3036
3074
|
Default core values (from `DefaultTheme`):
|
|
3037
3075
|
|