@dumiflex/wp-kit 0.5.0 → 0.6.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/CHANGELOG.md +32 -0
- package/README.md +5 -0
- package/package.json +4 -3
- package/src/Avatar.vue +1 -1
- package/src/Banner.vue +4 -4
- package/src/Button.vue +73 -44
- package/src/Checkbox.vue +201 -63
- package/src/Chip.vue +5 -2
- package/src/CodeBlock.vue +1 -1
- package/src/ColorField.vue +60 -6
- package/src/Combobox.vue +10 -14
- package/src/ConfirmModal.vue +12 -22
- package/src/ContextMenu.vue +11 -30
- package/src/CopyButton.vue +1 -1
- package/src/DataTable.vue +0 -2
- package/src/DatePicker.vue +1 -1
- package/src/Disclosure.vue +2 -1
- package/src/Drawer.vue +2 -2
- package/src/DropZone.vue +2 -2
- package/src/HsvPicker.vue +2 -2
- package/src/IconPicker.vue +1 -1
- package/src/ImageGrid.vue +2 -2
- package/src/Lightbox.vue +2 -2
- package/src/Modal.vue +109 -44
- package/src/ModalShell.vue +26 -5
- package/src/Pagination.vue +4 -4
- package/src/Popover.vue +68 -12
- package/src/RadioGroup.vue +5 -4
- package/src/SearchInput.vue +1 -1
- package/src/Select.vue +53 -158
- package/src/Skeleton.vue +1 -1
- package/src/Slider.vue +166 -55
- package/src/SortableList.vue +1 -1
- package/src/TagInput.vue +1 -1
- package/src/Timeline.vue +2 -2
- package/src/WorkingLine.vue +320 -0
- package/src/WpIconButton.vue +3 -2
- package/src/WpImageZoom.vue +7 -7
- package/src/WpSegmented.vue +3 -1
- package/src/WpSwitch.vue +1 -1
- package/src/WpTabs.vue +1 -1
- package/src/_modal-motion.css +1 -1
- package/src/button.css +8 -6
- package/src/floating.ts +5 -0
- package/src/hsv.ts +1 -1
- package/src/menu.css +51 -0
- package/src/motion.css +73 -0
- package/src/slider-math.ts +45 -1
- package/src/theme/looks.css +6 -19
- package/src/theme/tokens.css +12 -1108
- package/src/tokens.ts +8 -3
- package/src/tooltip.css +8 -5
- package/src/useDialogFocus.ts +11 -2
- package/src/CloseButton.vue +0 -69
- package/src/ColorPicker.vue +0 -201
- package/src/ConfirmDialog.vue +0 -165
- package/src/RangeSlider.vue +0 -183
- package/src/Toggle.vue +0 -36
- package/src/WpButton.vue +0 -75
- package/src/WpCheck.vue +0 -104
- package/src/_skeleton.css +0 -50
package/src/theme/looks.css
CHANGED
|
@@ -47,8 +47,10 @@
|
|
|
47
47
|
/* --wp-radius-cap: the roundest a corner may get in this look. Fixed radii
|
|
48
48
|
in components are written min(Npx, var(--wp-radius-cap, 999px)) and
|
|
49
49
|
pills var(--wp-radius-cap, 999px), so Orbit draws them as authored and a
|
|
50
|
-
square look squares them without a rule per component. Circles
|
|
51
|
-
|
|
50
|
+
square look squares them without a rule per component. Circles are
|
|
51
|
+
min(50%, var(--wp-radius-cap, 999px)): round in Orbit, softened in Crisp,
|
|
52
|
+
square in Terminal and TUI (dots, radios, avatars, the timeline).
|
|
53
|
+
src/__tests__/corners.test.ts fails on a raw radius. The theme audit (scripts/theme-audit) fails on a corner
|
|
52
54
|
rounder than the cap. */
|
|
53
55
|
html[data-wp-look="crisp"] { --wp-radius-cap: 4px; }
|
|
54
56
|
html[data-wp-look="terminal"],
|
|
@@ -362,10 +364,8 @@ html[data-wp-look="tui"] .wp-check:is([aria-checked="true"], [data-checked="true
|
|
|
362
364
|
html[data-wp-look="tui"] .wp-check:is([aria-checked="mixed"], [data-indeterminate="true"]):not([data-checked="true"])::before { content: "[-]"; color: var(--wp-accent-text); }
|
|
363
365
|
html[data-wp-look="tui"] .wp-page__title { font-size: 16px; font-weight: 700; letter-spacing: 0; }
|
|
364
366
|
/* Radios read ( ) / (*) beside the [ ] / [x] checkboxes; the drawn dot
|
|
365
|
-
hides. RadioGroup marks the picked option on the row (data-checked)
|
|
366
|
-
|
|
367
|
-
html[data-wp-look="tui"] .wp-radio-group__opt .wp-radio-group__dot,
|
|
368
|
-
html[data-wp-look="tui"] .wp-radio {
|
|
367
|
+
hides. RadioGroup marks the picked option on the row (data-checked). */
|
|
368
|
+
html[data-wp-look="tui"] .wp-radio-group__opt .wp-radio-group__dot {
|
|
369
369
|
width: auto;
|
|
370
370
|
min-width: 3ch;
|
|
371
371
|
height: auto;
|
|
@@ -381,19 +381,6 @@ html[data-wp-look="tui"] .wp-radio-group__opt[data-checked] .wp-radio-group__dot
|
|
|
381
381
|
html[data-wp-look="tui"] .wp-radio-group__dot::before { content: "( )"; }
|
|
382
382
|
html[data-wp-look="tui"] .wp-radio-group__opt[data-checked] .wp-radio-group__dot::before { content: "(*)"; color: var(--wp-accent-text); }
|
|
383
383
|
html[data-wp-look="tui"] .wp-radio-group__opt[aria-disabled="true"][data-checked] .wp-radio-group__dot::before { color: var(--wp-text-dim); }
|
|
384
|
-
html[data-wp-look="tui"] .wp-radio::before,
|
|
385
|
-
html[data-wp-look="tui"] .wp-radio:disabled::before {
|
|
386
|
-
content: "( )";
|
|
387
|
-
width: auto;
|
|
388
|
-
height: auto;
|
|
389
|
-
border-radius: 0;
|
|
390
|
-
background: transparent;
|
|
391
|
-
transform: none;
|
|
392
|
-
}
|
|
393
|
-
html[data-wp-look="tui"] .wp-radio:checked::before { content: "(*)"; color: var(--wp-accent-text); }
|
|
394
|
-
html[data-wp-look="tui"] .wp-radio:disabled:checked::before { content: "(*)"; color: var(--wp-text-dim); }
|
|
395
|
-
html[data-wp-look="tui"] .wp-radio:checked,
|
|
396
|
-
html[data-wp-look="tui"] .wp-radio:disabled:checked { background: transparent; }
|
|
397
384
|
|
|
398
385
|
/* ================= Canvas previews ignore the look =================
|
|
399
386
|
The canvas keeps ComfyUI's ground in every look (only the accent follows
|