@likec4/styles 1.59.3 → 1.59.4
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/dev.mjs +0 -43
- package/dist/jsx/is-valid-prop.d.mts +1 -1
- package/dist/jsx/txt.mjs +1 -1
- package/dist/patterns/txt.d.mts +4 -1
- package/dist/patterns/txt.mjs +14 -9
- package/dist/recipes/empty-box.d.mts +31 -0
- package/dist/recipes/empty-box.mjs +28 -0
- package/dist/recipes/floating-window.d.mts +33 -0
- package/dist/recipes/floating-window.mjs +24 -0
- package/dist/recipes/index.d.mts +2 -0
- package/dist/recipes/index.mjs +2 -0
- package/dist/tokens/index.mjs +514 -806
- package/dist/tokens/tokens.d.mts +16 -19
- package/dist/types/composition.d.mts +1 -1
- package/dist/types/prop-type.d.mts +3 -5
- package/dist/types/style-props.d.mts +134 -138
- package/package.json +13 -10
package/dist/tokens/tokens.d.mts
CHANGED
|
@@ -1,49 +1,47 @@
|
|
|
1
1
|
/* eslint-disable */
|
|
2
|
-
export type Token =
|
|
2
|
+
export type Token = `fontSizes.${FontSizeToken}` | `fontWeights.${FontWeightToken}` | `lineHeights.${LineHeightToken}` | `fonts.${FontToken}` | `letterSpacings.${LetterSpacingToken}` | `sizes.${SizeToken}` | `borders.${BorderToken}` | `borderWidths.${BorderWidthToken}` | `spacing.${SpacingToken}` | `radii.${RadiusToken}` | `colors.${ColorToken}` | `easings.${EasingToken}` | `durations.${DurationToken}` | `shadows.${ShadowToken}` | `zIndex.${ZIndexToken}` | `opacity.${OpacityToken}` | `cursor.${CursorToken}` | `breakpoints.${BreakpointToken}`
|
|
3
3
|
|
|
4
4
|
export type ColorPalette = "subflow" | "subflow.opt" | "subflow.loop" | "subflow.try" | "subflow.break" | "subflow.par" | "subflow.alt"
|
|
5
5
|
|
|
6
|
-
export type
|
|
6
|
+
export type FontSizeToken = "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "likec4.xs" | "likec4.sm" | "likec4.md" | "likec4.lg" | "likec4.xl" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6"
|
|
7
7
|
|
|
8
|
-
export type
|
|
8
|
+
export type FontWeightToken = "normal" | "medium" | "semibold" | "bold" | "extrabold" | "display"
|
|
9
9
|
|
|
10
|
-
export type LineHeightToken = "1" | "
|
|
10
|
+
export type LineHeightToken = "1" | "tight" | "snug" | "xs" | "sm" | "md" | "lg" | "xl"
|
|
11
11
|
|
|
12
|
-
export type FontToken = "mono" | "body" | "likec4" | "likec4.element" | "likec4.compound" | "likec4.relation"
|
|
12
|
+
export type FontToken = "display" | "mono" | "body" | "likec4" | "likec4.element" | "likec4.compound" | "likec4.relation"
|
|
13
13
|
|
|
14
|
-
export type LetterSpacingToken = "
|
|
14
|
+
export type LetterSpacingToken = "display" | "tight" | "normal" | "caps" | "caps.sm"
|
|
15
15
|
|
|
16
|
-
export type SizeToken = "0" | "auto" | "max-content" | "min-content" | "fit-content" | "stretch" | "100cqw" | "100cqh" | "100vw" | "100vh" | "100%" | "50%" | "
|
|
16
|
+
export type SizeToken = "0" | "auto" | "max-content" | "min-content" | "fit-content" | "stretch" | "100cqw" | "100cqh" | "100vw" | "100vh" | "100%" | "50%" | "full" | "control.sm" | "control.md" | "control.lg" | "action-icon" | "icon" | "icon.xxs" | "icon.xs" | "icon.sm" | "icon.md" | "icon.lg" | "icon.xl" | "breakpoint-xs" | "breakpoint-sm" | "breakpoint-md" | "breakpoint-lg" | "breakpoint-xl"
|
|
17
17
|
|
|
18
|
-
export type BorderToken = "none" | "transparent" | "default"
|
|
18
|
+
export type BorderToken = "none" | "transparent" | "subtle" | "default" | "strong" | "outline" | "panel"
|
|
19
19
|
|
|
20
|
-
export type BorderWidthToken = "0" | "1" | "2" | "3" | "4"
|
|
20
|
+
export type BorderWidthToken = "0" | "1" | "2" | "3" | "4" | "default" | "strong" | "extra"
|
|
21
21
|
|
|
22
|
-
export type SpacingToken = "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "12" | "16" | "0.5" | "1.5" | "2.5" | "3.5" | "4.5" | "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "likec4.xs" | "likec4.sm" | "likec4.md" | "likec4.lg" | "likec4.xl"
|
|
22
|
+
export type SpacingToken = "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "12" | "16" | "0.5" | "1.5" | "2.5" | "3.5" | "4.5" | "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "likec4.xs" | "likec4.sm" | "likec4.md" | "likec4.lg" | "likec4.xl" | "-0" | "-1" | "-2" | "-3" | "-4" | "-5" | "-6" | "-7" | "-8" | "-9" | "-10" | "-12" | "-16" | "-0.5" | "-1.5" | "-2.5" | "-3.5" | "-4.5" | "-xxs" | "-xs" | "-sm" | "-md" | "-lg" | "-xl" | "-likec4.xs" | "-likec4.sm" | "-likec4.md" | "-likec4.lg" | "-likec4.xl"
|
|
23
23
|
|
|
24
24
|
export type RadiusToken = "0" | "xs" | "sm" | "md" | "lg" | "xl" | "pill"
|
|
25
25
|
|
|
26
|
-
export type ColorToken = "mantine.
|
|
26
|
+
export type ColorToken = "mantine.gray[0]" | "mantine.gray[1]" | "mantine.gray[2]" | "mantine.gray[3]" | "mantine.gray[4]" | "mantine.gray[5]" | "mantine.gray[6]" | "mantine.gray[7]" | "mantine.gray[8]" | "mantine.gray[9]" | "mantine.dark[0]" | "mantine.dark[1]" | "mantine.dark[2]" | "mantine.dark[3]" | "mantine.dark[4]" | "mantine.dark[5]" | "mantine.dark[6]" | "mantine.dark[7]" | "mantine.dark[8]" | "mantine.dark[9]" | "mantine.orange[0]" | "mantine.orange[1]" | "mantine.orange[2]" | "mantine.orange[3]" | "mantine.orange[4]" | "mantine.orange[5]" | "mantine.orange[6]" | "mantine.orange[7]" | "mantine.orange[8]" | "mantine.orange[9]" | "mantine.yellow[0]" | "mantine.yellow[1]" | "mantine.yellow[2]" | "mantine.yellow[3]" | "mantine.yellow[4]" | "mantine.yellow[5]" | "mantine.yellow[6]" | "mantine.yellow[7]" | "mantine.yellow[8]" | "mantine.yellow[9]" | "transparent" | "none" | "inherit" | "current" | "currentColor" | "white" | "black" | "likec4.accent.0" | "likec4.accent.1" | "likec4.accent.2" | "likec4.accent.3" | "likec4.accent.4" | "likec4.accent.5" | "likec4.accent.6" | "likec4.accent.7" | "likec4.accent.8" | "likec4.accent.9" | "likec4.accent" | "surface.canvas" | "surface.default" | "surface.sunken" | "surface.sunken.hover" | "surface.code" | "surface.field" | "surface.field.hover" | "surface.hover" | "surface.selected" | "text" | "text.default" | "text.bright" | "text.dimmed" | "text.non-essential" | "text.display" | "text.heading" | "text.link" | "text.on-primary" | "text.on-inverse" | "text.warning" | "border.subtle" | "border.default" | "border.strong" | "border.focus" | "border.outline" | "disabled.body" | "disabled.text" | "disabled.border" | "highlight.body" | "highlight.text" | "primary.body" | "primary.body.hover" | "primary.body.focused" | "primary.body.light" | "primary.body.lightHover" | "primary.text" | "primary.text.light" | "primary.border" | "primary.border.hover" | "primary.border.focused" | "warning.body" | "warning.text" | "diagram.background" | "diagram.background.pattern" | "likec4.mixColor" | "likec4.tag.bg" | "likec4.tag.bg.hover" | "likec4.tag.border" | "likec4.tag.text" | "likec4.panel.bg" | "likec4.panel.border" | "likec4.panel.text" | "likec4.panel.text.dimmed" | "likec4.panel.action" | "likec4.panel.action.disabled" | "likec4.panel.action.hover" | "likec4.panel.action.bg" | "likec4.panel.action.bg.hover" | "likec4.panel.action.warning" | "likec4.panel.action.warning.hover" | "likec4.panel.action.warning.bg" | "likec4.panel.action.warning.bg.hover" | "likec4.dropdown.bg" | "likec4.dropdown.border" | "likec4.overlay.backdrop" | "likec4.overlay.body" | "likec4.overlay.border" | "likec4.walkthrough.parallelFrame" | "likec4.compare.manual" | "likec4.compare.outline" | "likec4.compare.latest" | "subflow.opt" | "subflow.opt.hovered" | "subflow.opt.text" | "subflow.opt.border" | "subflow.opt.label" | "subflow.loop" | "subflow.loop.hovered" | "subflow.loop.text" | "subflow.loop.border" | "subflow.loop.header" | "subflow.loop.label" | "subflow.try" | "subflow.try.hovered" | "subflow.try.text" | "subflow.try.border" | "subflow.try.header" | "subflow.try.label" | "subflow.break" | "subflow.break.hovered" | "subflow.break.text" | "subflow.break.border" | "subflow.break.header" | "subflow.break.label" | "subflow.par" | "subflow.par.hovered" | "subflow.par.text" | "subflow.par.border" | "subflow.par.header" | "subflow.par.label" | "subflow.alt" | "subflow.alt.hovered" | "subflow.alt.header" | "subflow.alt.text" | "subflow.alt.border" | "subflow.alt.label" | "amber.1" | "amber.2" | "amber.3" | "amber.4" | "amber.5" | "amber.6" | "amber.7" | "amber.8" | "amber.9" | "amber.10" | "amber.11" | "amber.12" | "blue.1" | "blue.2" | "blue.3" | "blue.4" | "blue.5" | "blue.6" | "blue.7" | "blue.8" | "blue.9" | "blue.10" | "blue.11" | "blue.12" | "crimson.1" | "crimson.2" | "crimson.3" | "crimson.4" | "crimson.5" | "crimson.6" | "crimson.7" | "crimson.8" | "crimson.9" | "crimson.10" | "crimson.11" | "crimson.12" | "grass.1" | "grass.2" | "grass.3" | "grass.4" | "grass.5" | "grass.6" | "grass.7" | "grass.8" | "grass.9" | "grass.10" | "grass.11" | "grass.12" | "indigo.1" | "indigo.2" | "indigo.3" | "indigo.4" | "indigo.5" | "indigo.6" | "indigo.7" | "indigo.8" | "indigo.9" | "indigo.10" | "indigo.11" | "indigo.12" | "lime.1" | "lime.2" | "lime.3" | "lime.4" | "lime.5" | "lime.6" | "lime.7" | "lime.8" | "lime.9" | "lime.10" | "lime.11" | "lime.12" | "orange.1" | "orange.2" | "orange.3" | "orange.4" | "orange.5" | "orange.6" | "orange.7" | "orange.8" | "orange.9" | "orange.10" | "orange.11" | "orange.12" | "pink.1" | "pink.2" | "pink.3" | "pink.4" | "pink.5" | "pink.6" | "pink.7" | "pink.8" | "pink.9" | "pink.10" | "pink.11" | "pink.12" | "purple.1" | "purple.2" | "purple.3" | "purple.4" | "purple.5" | "purple.6" | "purple.7" | "purple.8" | "purple.9" | "purple.10" | "purple.11" | "purple.12" | "red.1" | "red.2" | "red.3" | "red.4" | "red.5" | "red.6" | "red.7" | "red.8" | "red.9" | "red.10" | "red.11" | "red.12" | "ruby.1" | "ruby.2" | "ruby.3" | "ruby.4" | "ruby.5" | "ruby.6" | "ruby.7" | "ruby.8" | "ruby.9" | "ruby.10" | "ruby.11" | "ruby.12" | "teal.1" | "teal.2" | "teal.3" | "teal.4" | "teal.5" | "teal.6" | "teal.7" | "teal.8" | "teal.9" | "teal.10" | "teal.11" | "teal.12" | "tomato.1" | "tomato.2" | "tomato.3" | "tomato.4" | "tomato.5" | "tomato.6" | "tomato.7" | "tomato.8" | "tomato.9" | "tomato.10" | "tomato.11" | "tomato.12" | "violet.1" | "violet.2" | "violet.3" | "violet.4" | "violet.5" | "violet.6" | "violet.7" | "violet.8" | "violet.9" | "violet.10" | "violet.11" | "violet.12" | "yellow.1" | "yellow.2" | "yellow.3" | "yellow.4" | "yellow.5" | "yellow.6" | "yellow.7" | "yellow.8" | "yellow.9" | "yellow.10" | "yellow.11" | "yellow.12" | "colorPalette.opt" | "colorPalette" | "colorPalette.opt.hovered" | "colorPalette.hovered" | "colorPalette.opt.text" | "colorPalette.text" | "colorPalette.opt.border" | "colorPalette.border" | "colorPalette.opt.label" | "colorPalette.label" | "colorPalette.loop" | "colorPalette.loop.hovered" | "colorPalette.loop.text" | "colorPalette.loop.border" | "colorPalette.loop.header" | "colorPalette.header" | "colorPalette.loop.label" | "colorPalette.try" | "colorPalette.try.hovered" | "colorPalette.try.text" | "colorPalette.try.border" | "colorPalette.try.header" | "colorPalette.try.label" | "colorPalette.break" | "colorPalette.break.hovered" | "colorPalette.break.text" | "colorPalette.break.border" | "colorPalette.break.header" | "colorPalette.break.label" | "colorPalette.par" | "colorPalette.par.hovered" | "colorPalette.par.text" | "colorPalette.par.border" | "colorPalette.par.header" | "colorPalette.par.label" | "colorPalette.alt" | "colorPalette.alt.hovered" | "colorPalette.alt.header" | "colorPalette.alt.text" | "colorPalette.alt.border" | "colorPalette.alt.label"
|
|
27
27
|
|
|
28
28
|
export type EasingToken = "default" | "in" | "out" | "inOut"
|
|
29
29
|
|
|
30
|
-
export type DurationToken = "0" | "fastest" | "
|
|
30
|
+
export type DurationToken = "0" | "fastest" | "fast" | "medium" | "slow" | "slowest"
|
|
31
31
|
|
|
32
32
|
export type ShadowToken = "none" | "xs" | "sm" | "md" | "lg" | "xl"
|
|
33
33
|
|
|
34
|
-
export type ZIndexToken = "0" | "1" | "
|
|
34
|
+
export type ZIndexToken = "0" | "-1" | "base" | "sticky" | "floating" | "panel" | "dropdown" | "overlay" | "tooltip" | "toast" | "diagram.edge" | "diagram.edge.label" | "diagram.edge.controlPoint" | "diagram.node.compound" | "diagram.node.element"
|
|
35
35
|
|
|
36
|
-
export type OpacityToken = "0" | "1" | "0.5" | "0.7" | "0.9"
|
|
36
|
+
export type OpacityToken = "0" | "1" | "0.05" | "0.1" | "0.15" | "0.2" | "0.25" | "0.3" | "0.35" | "0.4" | "0.45" | "0.5" | "0.55" | "0.6" | "0.65" | "0.7" | "0.75" | "0.8" | "0.85" | "0.9" | "0.95" | "disabled"
|
|
37
37
|
|
|
38
|
-
export type CursorToken = "default" | "pointer" | "none"
|
|
39
|
-
|
|
40
|
-
export type BlurToken = "1" | "2" | "4" | ".5"
|
|
38
|
+
export type CursorToken = "default" | "pointer" | "none" | "inherit" | "grab" | "grabbing" | "move" | "zoom-out"
|
|
41
39
|
|
|
42
40
|
export type BreakpointToken = "xs" | "sm" | "md" | "lg" | "xl"
|
|
43
41
|
|
|
44
42
|
export type Tokens = {
|
|
45
|
-
fontWeights: FontWeightToken
|
|
46
43
|
fontSizes: FontSizeToken
|
|
44
|
+
fontWeights: FontWeightToken
|
|
47
45
|
lineHeights: LineHeightToken
|
|
48
46
|
fonts: FontToken
|
|
49
47
|
letterSpacings: LetterSpacingToken
|
|
@@ -59,7 +57,6 @@ export type Tokens = {
|
|
|
59
57
|
zIndex: ZIndexToken
|
|
60
58
|
opacity: OpacityToken
|
|
61
59
|
cursor: CursorToken
|
|
62
|
-
blurs: BlurToken
|
|
63
60
|
breakpoints: BreakpointToken
|
|
64
61
|
} & { [token: string]: never }
|
|
65
62
|
|
|
@@ -153,9 +153,7 @@ export interface UtilityValues {
|
|
|
153
153
|
boxShadow: Tokens["shadows"];
|
|
154
154
|
boxShadowColor: Tokens["colors"];
|
|
155
155
|
filter: "auto";
|
|
156
|
-
blur: Tokens["blurs"];
|
|
157
156
|
backdropFilter: "auto";
|
|
158
|
-
backdropBlur: Tokens["blurs"];
|
|
159
157
|
borderSpacing: Tokens["spacing"] | "auto";
|
|
160
158
|
borderSpacingX: Tokens["spacing"];
|
|
161
159
|
borderSpacingY: Tokens["spacing"];
|
|
@@ -163,7 +161,7 @@ export interface UtilityValues {
|
|
|
163
161
|
transitionDelay: Tokens["durations"];
|
|
164
162
|
transitionDuration: Tokens["durations"];
|
|
165
163
|
transitionProperty: "common" | "colors" | "size" | "position" | "background";
|
|
166
|
-
transition: "all" | "common" | "size" | "position" | "background" | "colors" | "opacity" | "shadow" | "transform" | "fastest" | "
|
|
164
|
+
transition: "all" | "common" | "size" | "position" | "background" | "colors" | "opacity" | "shadow" | "transform" | "fastest" | "fast" | "medium" | "slow" | "slowest" | "none";
|
|
167
165
|
animationName: "indicatorOpacity" | "xyedgeAnimated";
|
|
168
166
|
animationTimingFunction: Tokens["easings"];
|
|
169
167
|
animationDuration: Tokens["durations"];
|
|
@@ -215,8 +213,8 @@ export interface UtilityValues {
|
|
|
215
213
|
debug: boolean;
|
|
216
214
|
cursor: Tokens["cursor"];
|
|
217
215
|
colorPalette: "subflow" | "subflow.opt" | "subflow.loop" | "subflow.try" | "subflow.break" | "subflow.par" | "subflow.alt";
|
|
218
|
-
textStyle: "dimmed" | "dimmed.xxs" | "dimmed.xs" | "dimmed.sm" | "dimmed.md" | "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "likec4" | "likec4.panel" | "likec4.panel.action";
|
|
219
|
-
layerStyle: "surface.sunken" | "likec4.tag" | "likec4.panel" | "likec4.panel.action" | "likec4.panel.action.filled" | "likec4.dropdown";
|
|
216
|
+
textStyle: "dimmed" | "dimmed.xxs" | "dimmed.xs" | "dimmed.sm" | "dimmed.md" | "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "likec4" | "likec4.panel" | "likec4.panel.action" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "body" | "lead" | "small" | "caption" | "eyebrow";
|
|
217
|
+
layerStyle: "surface.sunken" | "surface.field" | "surface.warning" | "likec4.tag" | "likec4.panel" | "likec4.panel.action" | "likec4.panel.action.filled" | "likec4.dropdown";
|
|
220
218
|
animationStyle: "indicator" | "xyedgeAnimated";
|
|
221
219
|
}
|
|
222
220
|
|