@viraui/react 2026.0.26 → 2026.0.27
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/dist/components/select/select.js +2 -1
- package/dist/components/slider/slider-control.d.ts +2 -1
- package/dist/components/slider/slider-control.js +27 -0
- package/dist/components/slider/slider.css +1 -1
- package/dist/components/slider/slider.js +1 -1
- package/dist/components/tabs/tabs.css +1 -1
- package/dist/components/text/text.css +1 -1
- package/dist/components/text/text.d.ts +2 -1
- package/dist/components/text/text.guide.json +1 -1
- package/dist/components/text/text.js +2 -2
- package/dist/components/title/title.d.ts +2 -1
- package/dist/components/title/title.guide.json +1 -1
- package/dist/components/title/title.js +2 -2
- package/package.json +2 -2
|
@@ -65,9 +65,10 @@ function SelectRootComponent({ alignListWithTrigger = true, children, className,
|
|
|
65
65
|
}),
|
|
66
66
|
children: [/* @__PURE__ */ jsx(Text, {
|
|
67
67
|
className: select_module_default.Value,
|
|
68
|
-
lineHeight: "small",
|
|
69
68
|
render: /* @__PURE__ */ jsx(Select.Value, { placeholder }),
|
|
70
69
|
size: "small",
|
|
70
|
+
trim: false,
|
|
71
|
+
lineHeight: "x-small",
|
|
71
72
|
whiteSpace: "nowrap"
|
|
72
73
|
}), /* @__PURE__ */ jsx(Select.Icon, {
|
|
73
74
|
className: select_module_default.Icon,
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { SliderRoot } from '@base-ui/react/slider';
|
|
2
|
+
import type * as React from 'react';
|
|
2
3
|
export type SliderControlProps = {
|
|
3
4
|
isRange: boolean;
|
|
4
5
|
orientation?: SliderRoot.Props['orientation'];
|
|
5
6
|
thumbAriaLabel?: string | readonly [string, string] | undefined;
|
|
6
7
|
};
|
|
7
|
-
export declare function SliderControl({ isRange, orientation, thumbAriaLabel }: SliderControlProps):
|
|
8
|
+
export declare function SliderControl({ isRange, orientation, thumbAriaLabel }: SliderControlProps): React.JSX.Element;
|
|
@@ -12,12 +12,39 @@ function resolveThumbAriaLabels(thumbAriaLabel, isRange) {
|
|
|
12
12
|
};
|
|
13
13
|
return { first: thumbAriaLabel[0] };
|
|
14
14
|
}
|
|
15
|
+
/**
|
|
16
|
+
* Block document text selection for the active primary-button press.
|
|
17
|
+
*
|
|
18
|
+
* Must not call `preventDefault` on the pointer event — Base UI skips drag
|
|
19
|
+
* handling when `defaultPrevented` is already set. `selectstart` covers the
|
|
20
|
+
* case where the pointer leaves the control over page text.
|
|
21
|
+
*/
|
|
22
|
+
function blockTextSelectionWhilePressed(event) {
|
|
23
|
+
if (event.button !== 0) return;
|
|
24
|
+
const doc = event.currentTarget.ownerDocument;
|
|
25
|
+
const control = event.currentTarget;
|
|
26
|
+
const blockSelectStart = (selectEvent) => {
|
|
27
|
+
selectEvent.preventDefault();
|
|
28
|
+
};
|
|
29
|
+
const stop = () => {
|
|
30
|
+
doc.removeEventListener("selectstart", blockSelectStart);
|
|
31
|
+
doc.removeEventListener("pointerup", stop);
|
|
32
|
+
doc.removeEventListener("pointercancel", stop);
|
|
33
|
+
control.removeEventListener("lostpointercapture", stop);
|
|
34
|
+
};
|
|
35
|
+
doc.addEventListener("selectstart", blockSelectStart);
|
|
36
|
+
doc.addEventListener("pointerup", stop);
|
|
37
|
+
doc.addEventListener("pointercancel", stop);
|
|
38
|
+
control.addEventListener("lostpointercapture", stop);
|
|
39
|
+
doc.getSelection()?.removeAllRanges();
|
|
40
|
+
}
|
|
15
41
|
function SliderControl({ isRange, orientation = "horizontal", thumbAriaLabel }) {
|
|
16
42
|
const isVertical = orientation === "vertical";
|
|
17
43
|
const { first: firstThumbAriaLabel, second: secondThumbAriaLabel } = resolveThumbAriaLabels(thumbAriaLabel, isRange);
|
|
18
44
|
return /* @__PURE__ */ jsx(Slider.Control, {
|
|
19
45
|
className: slider_module_default.SliderControl,
|
|
20
46
|
"data-orientation": orientation,
|
|
47
|
+
onPointerDown: blockTextSelectionWhilePressed,
|
|
21
48
|
render: /* @__PURE__ */ jsx(Stack, {
|
|
22
49
|
direction: isVertical ? "column" : "row",
|
|
23
50
|
hAlign: isVertical ? "center" : "initial",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-slider-track-size{syntax:"<length>";inherits:true;initial-value:0}@property --vui-slider-thumb-size{syntax:"<length>";inherits:true;initial-value:0}@property --vui-slider-track-background{syntax:"<color>";inherits:true;initial-value:#0000}@property --vui-slider-progress-background{syntax:"<color>";inherits:true;initial-value:#0000}@property --vui-slider-thumb-background{syntax:"<color>";inherits:true;initial-value:#0000}.viraui__slider-module__Slider_vDNlm{--vui-slider-track-size:var(--space-x-small);--vui-slider-thumb-size:var(--space-medium);--vui-slider-track-background:var(--global-contrast);--vui-slider-progress-background:var(--global-foreground);--vui-slider-thumb-background:var(--base-
|
|
1
|
+
@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-slider-track-size{syntax:"<length>";inherits:true;initial-value:0}@property --vui-slider-thumb-size{syntax:"<length>";inherits:true;initial-value:0}@property --vui-slider-track-background{syntax:"<color>";inherits:true;initial-value:#0000}@property --vui-slider-progress-background{syntax:"<color>";inherits:true;initial-value:#0000}@property --vui-slider-thumb-background{syntax:"<color>";inherits:true;initial-value:#0000}.viraui__slider-module__Slider_vDNlm{--vui-slider-track-size:var(--space-x-small);--vui-slider-thumb-size:var(--space-medium);--vui-slider-track-background:var(--global-contrast);--vui-slider-progress-background:var(--global-foreground);--vui-slider-thumb-background:var(--base-1);inline-size:100%;block-size:100%;max-block-size:min-content;min-inline-size:0;min-block-size:0;&:has([required]) .viraui__slider-module__Label_eQQHf:after{content:" ＊";color:var(--highlight-red)}&[data-invalid]{--vui-slider-progress-background:var(--highlight-red)}&:has(.viraui__slider-module__SliderRoot_4JScw[data-disabled]),&[data-disabled]{--vui-slider-track-background:var(--global-disabled-background);--vui-slider-progress-background:var(--global-disabled-foreground);--vui-slider-thumb-background:var(--global-disabled-foreground);cursor:not-allowed}}.viraui__slider-module__SliderRoot_4JScw{inline-size:100%;block-size:100%;min-inline-size:0;min-block-size:0}.viraui__slider-module__SliderHeader_gOy9k{inline-size:100%;min-inline-size:0}.viraui__slider-module__Value_FaY9i{flex-shrink:0}.viraui__slider-module__SliderControl_FQd5-{position:relative;flex:1 1 auto;-webkit-user-select:none;user-select:none;touch-action:none;inline-size:100%;block-size:var(--vui-slider-track-size);min-inline-size:0;min-block-size:0;&[data-orientation=vertical]{inline-size:var(--vui-slider-track-size);block-size:100%;>.viraui__slider-module__Track_wvLEH{inline-size:var(--vui-slider-track-size);block-size:100%}}}.viraui__slider-module__Track_wvLEH{position:relative;overflow:visible;inline-size:100%;block-size:var(--vui-slider-track-size);background:var(--vui-slider-track-background);border-radius:var(--radius-infinite)}.viraui__slider-module__Indicator_y3JyJ{background:var(--vui-slider-progress-background);border-radius:inherit}.viraui__slider-module__Thumb_S-uLF{box-sizing:border-box;inline-size:var(--vui-slider-thumb-size);block-size:calc(var(--vui-slider-thumb-size) - 2px);background:var(--vui-slider-thumb-background);border:2px solid var(--vui-slider-progress-background);border-radius:var(--radius-x-small);appearance:none;transition:scale var(--duration-instant) var(--easing-standard);&:not(:disabled,[data-disabled]){cursor:grab}&:not(:disabled,[data-disabled]):active,&:not(:disabled,[data-disabled]):has(>input:active),&:not(:disabled,[data-disabled])[data-dragging]:has(>input:focus){cursor:grabbing;scale:1.2}&:has(>input:focus-visible){outline:var(--outline);outline-offset:var(--outline-offset)}>input:focus-visible{outline:none}}}
|
|
@@ -41,7 +41,7 @@ var Slider$1 = ({ className, defaultValue, description, dirty, disabled, error,
|
|
|
41
41
|
thumbAlignment,
|
|
42
42
|
render: /* @__PURE__ */ jsx(Stack, {
|
|
43
43
|
direction: "column",
|
|
44
|
-
rowGap: "
|
|
44
|
+
rowGap: "small",
|
|
45
45
|
columnGap: "x-small",
|
|
46
46
|
vAlign: isVertical ? "stretch" : "center",
|
|
47
47
|
hAlign: isVertical ? "center" : "initial"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-tabs-translate-amount{syntax:"<length>";inherits:true;initial-value:10px}.viraui__tabs-module__Tabs_AwbZZ{min-block-size:10rem}.viraui__tabs-module__Viewport_15X1I{display:grid;grid-template-columns:minmax(0,1fr);inline-size:100%}.viraui__tabs-module__Panel_vkCFI{grid-area:1/1;inline-size:100%;opacity:1;translate:0 0;transition:opacity var(--duration-fast) var(--easing-entrance),translate var(--duration-fast) var(--easing-entrance);&[data-ending-style]{pointer-events:none}&[data-ending-style],&[data-starting-style]{opacity:0}&[data-activation-direction=right][data-starting-style]{translate:var(--vui-tabs-translate-amount) 0}&[data-activation-direction=left][data-starting-style],&[data-activation-direction=right][data-ending-style]{translate:calc(var(--vui-tabs-translate-amount) * -1) 0}&[data-activation-direction=left][data-ending-style]{translate:var(--vui-tabs-translate-amount) 0}&[data-activation-direction=none][data-ending-style],&[data-activation-direction=none][data-starting-style]{translate:0 var(--vui-tabs-translate-amount)}&[hidden]{display:none}@media (prefers-reduced-motion:reduce){transition:none;&[data-ending-style],&[data-starting-style]{opacity:1;translate:0 0}}}}@layer viraui.overrides{.viraui__tabs-module__List_XJorr{position:relative;overflow-x:auto;overflow-y:clip}.viraui__tabs-module__IndicatorLayer_Ek8o3{position:absolute;inset:0;overflow:clip;pointer-events:none}.viraui__tabs-module__Indicator_UyNUn{position:absolute;pointer-events:none;inset-block-start:var(--active-tab-top);inset-inline-start:var(--active-tab-left);inline-size:var(--active-tab-width);block-size:var(--active-tab-height);transition:inset-inline-start var(--duration-fast) var(--easing-standard),inset-block-start var(--duration-fast) var(--easing-standard),inline-size var(--duration-fast) var(--easing-standard),block-size var(--duration-fast) var(--easing-standard)}.viraui__tabs-module__Item_XZ86Z{position:relative;flex-shrink:0;cursor:pointer;flex-basis:0;transition:none;will-change:auto;&[data-variant]:not(:disabled):active{translate:0 0}&:hover{background:#0000}&[data-disabled]{opacity:.5;background:#0000}&[data-active]{color:var(--global-foreground)}&:focus-visible{border-radius:var(--radius-small);outline-offset:0}}.viraui__tabs-module__Item_XZ86Z[data-active] .viraui__tabs-module__Label_5-8-Y{color:var(--global-foreground)}}
|
|
1
|
+
@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-tabs-translate-amount{syntax:"<length>";inherits:true;initial-value:10px}.viraui__tabs-module__Tabs_AwbZZ{min-block-size:10rem}.viraui__tabs-module__Viewport_15X1I{display:grid;grid-template-columns:minmax(0,1fr);inline-size:100%}.viraui__tabs-module__Panel_vkCFI{grid-area:1/1;inline-size:100%;opacity:1;translate:0 0;transition:opacity var(--duration-fast) var(--easing-entrance),translate var(--duration-fast) var(--easing-entrance);&[data-ending-style]{pointer-events:none}&[data-ending-style],&[data-starting-style]{opacity:0}&[data-activation-direction=right][data-starting-style]{translate:var(--vui-tabs-translate-amount) 0}&[data-activation-direction=left][data-starting-style],&[data-activation-direction=right][data-ending-style]{translate:calc(var(--vui-tabs-translate-amount) * -1) 0}&[data-activation-direction=left][data-ending-style]{translate:var(--vui-tabs-translate-amount) 0}&[data-activation-direction=none][data-ending-style],&[data-activation-direction=none][data-starting-style]{translate:0 var(--vui-tabs-translate-amount)}&[hidden]{display:none}@media (prefers-reduced-motion:reduce){transition:none;&[data-ending-style],&[data-starting-style]{opacity:1;translate:0 0}}}}@layer viraui.overrides{.viraui__tabs-module__List_XJorr{position:relative;max-inline-size:100%;min-inline-size:0;overflow-x:auto;overflow-y:clip}.viraui__tabs-module__IndicatorLayer_Ek8o3{position:absolute;inset:0;overflow:clip;pointer-events:none}.viraui__tabs-module__Indicator_UyNUn{position:absolute;pointer-events:none;inset-block-start:var(--active-tab-top);inset-inline-start:var(--active-tab-left);inline-size:var(--active-tab-width);block-size:var(--active-tab-height);transition:inset-inline-start var(--duration-fast) var(--easing-standard),inset-block-start var(--duration-fast) var(--easing-standard),inline-size var(--duration-fast) var(--easing-standard),block-size var(--duration-fast) var(--easing-standard)}.viraui__tabs-module__Item_XZ86Z{position:relative;flex-shrink:0;cursor:pointer;flex-basis:0;transition:none;will-change:auto;&[data-variant]:not(:disabled):active{translate:0 0}&:hover{background:#0000}&[data-disabled]{opacity:.5;background:#0000}&[data-active]{color:var(--global-foreground)}&:focus-visible{border-radius:var(--radius-small);outline-offset:0}}.viraui__tabs-module__Item_XZ86Z[data-active] .viraui__tabs-module__Label_5-8-Y{color:var(--global-foreground)}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-text-align{syntax:"*";inherits:false;initial-value:start}@property --vui-text-max-width{syntax:"*";inherits:false;initial-value:none}@property --vui-text-literal-color{syntax:"<color>";inherits:false;initial-value:#0000}@property --vui-text-white-space{syntax:"*";inherits:false;initial-value:normal}@property --vui-text-font-weight{syntax:"<number>";inherits:false;initial-value:400}@property --vui-text-font-width{syntax:"<number>";inherits:false;initial-value:100}@property --vui-text-font-opsz{syntax:"<number>";inherits:false;initial-value:16}@property --vui-text-trim{syntax:"*";inherits:false;initial-value:trim-both}@property --vui-text-trim-type{syntax:"*";inherits:false;initial-value:cap alphabetic}@property --vui-text-padding-inline-start{syntax:"<length>";inherits:false;initial-value:0}@property --vui-text-padding-inline-end{syntax:"<length>";inherits:false;initial-value:0}@property --vui-text-padding-block-start{syntax:"<length>";inherits:false;initial-value:0}@property --vui-text-padding-block-end{syntax:"<length>";inherits:false;initial-value:0}@property --vui-text-font-size{syntax:"<length>";inherits:false;initial-value:1rem}@property --vui-text-font-family{syntax:"*";inherits:false;initial-value:sans-serif}@property --vui-text-line-height{syntax:"normal | <number> | <length-percentage>";inherits:false;initial-value:normal}@property --__text-medium{syntax:"*";inherits:false;initial-value:0}.viraui__text-module__Text_bS8kv{--__text-medium:clamp(var(--font-scale-body-medium),calc(var(--font-scale-body-medium) + var(--font-scale-body-x-small) / 12 + 0.24cqi),calc(var(--font-scale-body-medium) + var(--font-scale-body-x-small) / 3));--vui-text-font-family:var(--font-family-body);--vui-text-font-size:clamp(var(--font-scale-body-small),var(--__text-medium),var(--font-scale-body-medium));--vui-text-line-height:var(--font-leading-standard);margin:0;
|
|
1
|
+
@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-text-align{syntax:"*";inherits:false;initial-value:start}@property --vui-text-max-width{syntax:"*";inherits:false;initial-value:none}@property --vui-text-literal-color{syntax:"<color>";inherits:false;initial-value:#0000}@property --vui-text-white-space{syntax:"*";inherits:false;initial-value:normal}@property --vui-text-font-weight{syntax:"<number>";inherits:false;initial-value:400}@property --vui-text-font-width{syntax:"<number>";inherits:false;initial-value:100}@property --vui-text-font-opsz{syntax:"<number>";inherits:false;initial-value:16}@property --vui-text-trim{syntax:"*";inherits:false;initial-value:trim-both}@property --vui-text-trim-type{syntax:"*";inherits:false;initial-value:cap alphabetic}@property --vui-text-padding-inline-start{syntax:"<length>";inherits:false;initial-value:0}@property --vui-text-padding-inline-end{syntax:"<length>";inherits:false;initial-value:0}@property --vui-text-padding-block-start{syntax:"<length>";inherits:false;initial-value:0}@property --vui-text-padding-block-end{syntax:"<length>";inherits:false;initial-value:0}@property --vui-text-font-size{syntax:"<length>";inherits:false;initial-value:1rem}@property --vui-text-font-family{syntax:"*";inherits:false;initial-value:sans-serif}@property --vui-text-line-height{syntax:"normal | <number> | <length-percentage>";inherits:false;initial-value:normal}@property --__text-medium{syntax:"*";inherits:false;initial-value:0}.viraui__text-module__Text_bS8kv{--__text-medium:clamp(var(--font-scale-body-medium),calc(var(--font-scale-body-medium) + var(--font-scale-body-x-small) / 12 + 0.24cqi),calc(var(--font-scale-body-medium) + var(--font-scale-body-x-small) / 3));--vui-text-font-family:var(--font-family-body);--vui-text-font-size:clamp(var(--font-scale-body-small),var(--__text-medium),var(--font-scale-body-medium));--vui-text-line-height:var(--font-leading-standard);margin:0;max-inline-size:var(--vui-text-max-width);font-family:var(--vui-text-font-family);font-size:var(--vui-text-font-size);line-height:var(--vui-text-line-height);text-align:var(--vui-text-align);white-space:var(--vui-text-white-space);word-break:break-word;font-weight:var(--vui-text-font-weight);font-stretch:calc(var(--vui-text-font-width) * 1%);font-optical-sizing:auto;font-variation-settings:"wght" var(--vui-text-font-weight),"wdth" var(--vui-text-font-width),"opsz" var(--vui-text-font-opsz);text-box:var(--vui-text-trim) var(--vui-text-trim-type);&[data-text-balanced=true]{text-wrap:balance}&[data-text-selection=false]{-webkit-user-select:none;user-select:none}&[data-text-has-padding=true]{padding:var(--vui-text-padding-block-start) var(--vui-text-padding-inline-end) var(--vui-text-padding-block-end) var(--vui-text-padding-inline-start)}&[data-text-family=mono]{--vui-text-font-family:var(--font-family-mono)}&[data-text-size=x-large]{--vui-text-font-size:clamp(var(--font-scale-body-large),calc(var(--__text-medium) * pow(var(--font-heading-typescale), 2)),var(--font-scale-body-x-large))}&[data-text-size=large]{--vui-text-font-size:clamp(var(--font-scale-body-medium),calc(var(--__text-medium) * pow(var(--font-heading-typescale), 1)),var(--font-scale-body-large))}&[data-text-size=small]{--vui-text-font-size:clamp(var(--font-scale-body-x-small),calc(var(--__text-medium) * pow(var(--font-heading-typescale), -0.1)),var(--font-scale-body-small))}&[data-text-size=x-small]{--vui-text-font-size:var(--font-scale-body-x-small)}&[data-text-weight=light]{--vui-text-font-weight:200}&[data-text-weight=semibold]{--vui-text-font-weight:600}&[data-text-weight=bold]{--vui-text-font-weight:800}&[data-text-tone=muted]{color:var(--global-muted)}&[data-text-tone=interactive]{color:var(--global-interactive-text)}&[data-text-tone=positive]{color:var(--highlight-green)}&[data-text-tone=informative]{color:var(--highlight-blue)}&[data-text-tone=danger]{color:var(--highlight-red)}&[data-text-tone=warning]{color:var(--highlight-yellow)}&[data-text-has-literal-color=true]{color:var(--vui-text-literal-color)}&[data-text-line-height=none]{--vui-text-line-height:0}&[data-text-line-height=x-small]{--vui-text-line-height:var(--font-leading-x-small)}&[data-text-line-height=small]{--vui-text-line-height:var(--font-leading-small)}&[data-text-line-height=large]{--vui-text-line-height:var(--font-leading-large)}}}
|
|
@@ -104,10 +104,11 @@ export type TextProps = React.ComponentPropsWithoutRef<'span'> & {
|
|
|
104
104
|
vPadding?: TextAxisPadding;
|
|
105
105
|
/**
|
|
106
106
|
* Trims text box whitespace at the chosen edge when the browser supports `text-box`.
|
|
107
|
+
* Pass `false` to disable text-box trim.
|
|
107
108
|
*
|
|
108
109
|
* @default 'both'
|
|
109
110
|
*/
|
|
110
|
-
trim?: 'start' | 'end' | 'both';
|
|
111
|
+
trim?: 'start' | 'end' | 'both' | false;
|
|
111
112
|
/**
|
|
112
113
|
* Selects the `text-box` trim basis when `trim` is active.
|
|
113
114
|
*
|
|
@@ -64,7 +64,7 @@
|
|
|
64
64
|
"description": "Sets the semantic text color role when no literal `color` override is used."
|
|
65
65
|
},
|
|
66
66
|
"trim": {
|
|
67
|
-
"description": "Trims text box whitespace at the chosen edge when the browser supports `text-box`.",
|
|
67
|
+
"description": "Trims text box whitespace at the chosen edge when the browser supports `text-box`. Pass `false` to disable text-box trim.",
|
|
68
68
|
"refCss": "trim"
|
|
69
69
|
},
|
|
70
70
|
"trimType": {
|
|
@@ -11,8 +11,8 @@ var Text = ({ align = "start", balanced = false, selection = true, className, co
|
|
|
11
11
|
"--vui-text-max-width": maxWidth ?? "none",
|
|
12
12
|
"--vui-text-literal-color": color,
|
|
13
13
|
"--vui-text-white-space": whiteSpace,
|
|
14
|
-
"--vui-text-trim": trim ? `trim-${trim}` : "
|
|
15
|
-
"--vui-text-trim-type": trim ? trimType : "
|
|
14
|
+
"--vui-text-trim": trim ? `trim-${trim}` : "none",
|
|
15
|
+
"--vui-text-trim-type": trim ? trimType : "auto",
|
|
16
16
|
...typeof weight === "number" && { "--vui-text-font-weight": weight },
|
|
17
17
|
"--vui-text-font-width": fontWidth,
|
|
18
18
|
"--vui-text-font-opsz": opticalSize,
|
|
@@ -97,10 +97,11 @@ export type TitleProps = React.ComponentPropsWithoutRef<'span'> & {
|
|
|
97
97
|
vPadding?: TitleAxisPadding;
|
|
98
98
|
/**
|
|
99
99
|
* Trims text box whitespace at the chosen edge when the browser supports `text-box`.
|
|
100
|
+
* Pass `false` to disable text-box trim.
|
|
100
101
|
*
|
|
101
102
|
* @default 'both'
|
|
102
103
|
*/
|
|
103
|
-
trim?: 'start' | 'end' | 'both';
|
|
104
|
+
trim?: 'start' | 'end' | 'both' | false;
|
|
104
105
|
/**
|
|
105
106
|
* Selects the `text-box` trim basis when `trim` is active.
|
|
106
107
|
*
|
|
@@ -61,7 +61,7 @@
|
|
|
61
61
|
"description": "Selects a heading or display typography preset from the active theme scale. This controls only the visual preset. Semantic heading choice remains owned by `render`, because `Title` keeps a `span` root unless `render` replaces it."
|
|
62
62
|
},
|
|
63
63
|
"trim": {
|
|
64
|
-
"description": "Trims text box whitespace at the chosen edge when the browser supports `text-box`.",
|
|
64
|
+
"description": "Trims text box whitespace at the chosen edge when the browser supports `text-box`. Pass `false` to disable text-box trim.",
|
|
65
65
|
"refCss": "trim"
|
|
66
66
|
},
|
|
67
67
|
"trimType": {
|
|
@@ -11,8 +11,8 @@ var Title = ({ align = "start", balanced = false, selection = true, className, c
|
|
|
11
11
|
"--vui-title-max-width": maxWidth ?? "none",
|
|
12
12
|
"--vui-title-literal-color": color,
|
|
13
13
|
"--vui-title-white-space": whiteSpace,
|
|
14
|
-
"--vui-title-trim": trim ? `trim-${trim}` : "
|
|
15
|
-
"--vui-title-trim-type": trim ? trimType : "
|
|
14
|
+
"--vui-title-trim": trim ? `trim-${trim}` : "none",
|
|
15
|
+
"--vui-title-trim-type": trim ? trimType : "auto",
|
|
16
16
|
...typeof weight === "number" && { "--vui-title-font-weight": weight },
|
|
17
17
|
"--vui-title-font-width": fontWidth,
|
|
18
18
|
"--vui-title-font-opsz": opticalSize,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@viraui/react",
|
|
3
|
-
"version": "2026.0.
|
|
3
|
+
"version": "2026.0.27",
|
|
4
4
|
"private": false,
|
|
5
5
|
"files": [
|
|
6
6
|
"dist"
|
|
@@ -35,7 +35,7 @@
|
|
|
35
35
|
"unplugin-dts": "1.0.3",
|
|
36
36
|
"vite": "8.1.4",
|
|
37
37
|
"vite-plugin-static-copy": "4.1.1",
|
|
38
|
-
"@viraui/foundation": "2026.0.
|
|
38
|
+
"@viraui/foundation": "2026.0.27",
|
|
39
39
|
"@viraui/icons": "2026.0.0",
|
|
40
40
|
"@viraui/postcss-config": "2026.0.0",
|
|
41
41
|
"@viraui/tsconfig": "2026.0.0"
|