npm - @cube-dev/ui-kit - Versions diffs - 0.0.0-canary-8d79305 → 0.0.0-canary-ed0ffec - Mend

@cube-dev/ui-kit 0.0.0-canary-8d79305 → 0.0.0-canary-ed0ffec

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.

Files changed (572) hide show

package/dist/data/item-themes.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-8d79305 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-ed0ffec | Cube Dev Team */
 //#region src/data/item-themes.ts
 const VALIDATION_STYLES = { border: {
 	invalid: "#danger-accent-text",
@@ -88,7 +88,7 @@ const DEFAULT_OUTLINE_STYLES = {
 		"selected & (hovered | focused)": "#surface-2 #primary-accent-surface.12",
 		"selected & pressed": "#surface-2 #primary-accent-surface.18",
 		disabled: "#surface-2 #disabled-surface",
-		"selected & disabled": "#surface-2 #primary-accent-surface.08"
+		"selected & disabled": "#surface-2 #primary-accent-disabled-surface"
 	},
 	color: {
 		"": "#surface-text-soft",
@@ -97,7 +97,7 @@ const DEFAULT_OUTLINE_STYLES = {
 		selected: "#primary-accent-text-soft",
 		"selected & hovered": "#primary-accent-text",
 		disabled: "#disabled-surface-text",
-		"selected & disabled": "#primary-accent-disabled-text"
+		"selected & disabled": "#primary-accent-disabled-surface-text"
 	}
 };
 const DEFAULT_OUTLINE_2_STYLES = {
@@ -110,7 +110,7 @@ const DEFAULT_OUTLINE_2_STYLES = {
 		"selected & (hovered | focused)": "#surface-3 #primary-accent-surface.12",
 		"selected & pressed": "#surface-3 #primary-accent-surface.15",
 		disabled: "#surface-3 #disabled-surface",
-		"selected & disabled": "#surface-3 #primary-accent-surface.08"
+		"selected & disabled": "#surface-3 #primary-accent-disabled-surface"
 	}
 };
 const DEFAULT_CLEAR_STYLES = {
@@ -130,7 +130,7 @@ const DEFAULT_CLEAR_STYLES = {
 		"selected & (hovered | focused)": "#primary-accent-surface.12",
 		"selected & pressed": "#primary-accent-surface.18",
 		disabled: "transparent",
-		"selected & disabled": "#primary-accent-surface.08"
+		"selected & disabled": "#primary-accent-disabled-surface"
 	},
 	color: {
 		"": "#surface-text-soft",
@@ -139,7 +139,7 @@ const DEFAULT_CLEAR_STYLES = {
 		selected: "#primary-accent-text-soft",
 		"selected & hovered": "#primary-accent-text",
 		disabled: "#disabled-surface-text",
-		"selected & disabled": "#primary-accent-disabled-text"
+		"selected & disabled": "#primary-accent-disabled-surface-text"
 	}
 };
 const DEFAULT_ITEM_STYLES = {
@@ -211,13 +211,13 @@ const DANGER_OUTLINE_STYLES = {
 		"selected & (hovered | focused)": "#surface-2 #danger-accent-surface.12",
 		"selected & pressed": "#surface-2 #danger-accent-surface.18",
 		disabled: "#surface-2 #disabled-surface",
-		"selected & disabled": "#surface-2 #danger-accent-surface.08"
+		"selected & disabled": "#surface-2 #danger-accent-disabled-surface"
 	},
 	color: {
 		"": "#danger-accent-text-soft",
 		selected: "#danger-accent-text",
 		disabled: "#disabled-surface-text",
-		"selected & disabled": "#danger-accent-disabled-text"
+		"selected & disabled": "#danger-accent-disabled-surface-text"
 	}
 };
 const DANGER_OUTLINE_2_STYLES = {
@@ -230,7 +230,7 @@ const DANGER_OUTLINE_2_STYLES = {
 		"selected & (hovered | focused)": "#surface-3 #danger-accent-surface.12",
 		"selected & pressed": "#surface-3 #danger-accent-surface.18",
 		disabled: "#surface-3 #disabled-surface",
-		"selected & disabled": "#surface-3 #danger-accent-surface.08"
+		"selected & disabled": "#surface-3 #danger-accent-disabled-surface"
 	}
 };
 const DANGER_CLEAR_STYLES = {
@@ -247,13 +247,13 @@ const DANGER_CLEAR_STYLES = {
 		"selected & (hovered | focused)": "#danger-accent-text.12",
 		"selected & pressed": "#danger-accent-text.18",
 		disabled: "transparent",
-		"selected & disabled": "#danger-accent-text.08"
+		"selected & disabled": "#danger-accent-disabled-surface"
 	},
 	color: {
 		"": "#danger-accent-text-soft",
 		selected: "#danger-accent-text",
 		disabled: "#disabled-surface-text",
-		"selected & disabled": "#danger-accent-disabled-text"
+		"selected & disabled": "#danger-accent-disabled-surface-text"
 	}
 };
 const DANGER_LINK_STYLES = {
@@ -324,13 +324,13 @@ const SUCCESS_OUTLINE_STYLES = {
 		"selected & (hovered | focused)": "#surface-2 #success-accent-surface.12",
 		"selected & pressed": "#surface-2 #success-accent-surface.18",
 		disabled: "#surface-2 #disabled-surface",
-		"selected & disabled": "#surface-2 #success-accent-surface.08"
+		"selected & disabled": "#surface-2 #success-accent-disabled-surface"
 	},
 	color: {
 		"": "#success-accent-text-soft",
 		selected: "#success-accent-text",
 		disabled: "#disabled-surface-text",
-		"selected & disabled": "#success-accent-disabled-text"
+		"selected & disabled": "#success-accent-disabled-surface-text"
 	}
 };
 const SUCCESS_OUTLINE_2_STYLES = {
@@ -343,7 +343,7 @@ const SUCCESS_OUTLINE_2_STYLES = {
 		"selected & (hovered | focused)": "#surface-3 #success-accent-surface.12",
 		"selected & pressed": "#surface-3 #success-accent-surface.18",
 		disabled: "#surface-3 #disabled-surface",
-		"selected & disabled": "#surface-3 #success-accent-surface.08"
+		"selected & disabled": "#surface-3 #success-accent-disabled-surface"
 	}
 };
 const SUCCESS_CLEAR_STYLES = {
@@ -360,13 +360,13 @@ const SUCCESS_CLEAR_STYLES = {
 		"selected & (hovered | focused)": "#success-accent-text.12",
 		"selected & pressed": "#success-accent-text.18",
 		disabled: "transparent",
-		"selected & disabled": "#success-accent-text.08"
+		"selected & disabled": "#success-accent-disabled-surface"
 	},
 	color: {
 		"": "#success-accent-text-soft",
 		selected: "#success-accent-text",
 		disabled: "#disabled-surface-text",
-		"selected & disabled": "#success-accent-disabled-text"
+		"selected & disabled": "#success-accent-disabled-surface-text"
 	}
 };
 const SUCCESS_LINK_STYLES = {
@@ -437,13 +437,13 @@ const WARNING_OUTLINE_STYLES = {
 		"selected & (hovered | focused)": "#surface-2 #warning-accent-surface.12",
 		"selected & pressed": "#surface-2 #warning-accent-surface.18",
 		disabled: "#surface-2 #disabled-surface",
-		"selected & disabled": "#surface-2 #warning-accent-surface.08"
+		"selected & disabled": "#surface-2 #warning-accent-disabled-surface"
 	},
 	color: {
 		"": "#warning-accent-text-soft",
 		selected: "#warning-accent-text",
 		disabled: "#disabled-surface-text",
-		"selected & disabled": "#warning-accent-disabled-text"
+		"selected & disabled": "#warning-accent-disabled-surface-text"
 	}
 };
 const WARNING_OUTLINE_2_STYLES = {
@@ -456,7 +456,7 @@ const WARNING_OUTLINE_2_STYLES = {
 		"selected & (hovered | focused)": "#surface-3 #warning-accent-surface.12",
 		"selected & pressed": "#surface-3 #warning-accent-surface.18",
 		disabled: "#surface-3 #disabled-surface",
-		"selected & disabled": "#surface-3 #warning-accent-surface.08"
+		"selected & disabled": "#surface-3 #warning-accent-disabled-surface"
 	}
 };
 const WARNING_CLEAR_STYLES = {
@@ -473,13 +473,13 @@ const WARNING_CLEAR_STYLES = {
 		"selected & (hovered | focused)": "#warning-accent-text.12",
 		"selected & pressed": "#warning-accent-text.18",
 		disabled: "transparent",
-		"selected & disabled": "#warning-accent-text.08"
+		"selected & disabled": "#warning-accent-disabled-surface"
 	},
 	color: {
 		"": "#warning-accent-text-soft",
 		selected: "#warning-accent-text",
 		disabled: "#disabled-surface-text",
-		"selected & disabled": "#warning-accent-disabled-text"
+		"selected & disabled": "#warning-accent-disabled-surface-text"
 	}
 };
 const WARNING_LINK_STYLES = {
@@ -550,13 +550,13 @@ const NOTE_OUTLINE_STYLES = {
 		"selected & (hovered | focused)": "#surface-2 #note-accent-surface.12",
 		"selected & pressed": "#surface-2 #note-accent-surface.18",
 		disabled: "#surface-2 #disabled-surface",
-		"selected & disabled": "#surface-2 #note-accent-surface.08"
+		"selected & disabled": "#surface-2 #note-accent-disabled-surface"
 	},
 	color: {
 		"": "#note-accent-text-soft",
 		selected: "#note-accent-text",
 		disabled: "#disabled-surface-text",
-		"selected & disabled": "#note-accent-disabled-text"
+		"selected & disabled": "#note-accent-disabled-surface-text"
 	}
 };
 const NOTE_OUTLINE_2_STYLES = {
@@ -569,7 +569,7 @@ const NOTE_OUTLINE_2_STYLES = {
 		"selected & (hovered | focused)": "#surface-3 #note-accent-surface.12",
 		"selected & pressed": "#surface-3 #note-accent-surface.18",
 		disabled: "#surface-3 #disabled-surface",
-		"selected & disabled": "#surface-3 #note-accent-surface.08"
+		"selected & disabled": "#surface-3 #note-accent-disabled-surface"
 	}
 };
 const NOTE_CLEAR_STYLES = {
@@ -586,13 +586,13 @@ const NOTE_CLEAR_STYLES = {
 		"selected & (hovered | focused)": "#note-accent-text.12",
 		"selected & pressed": "#note-accent-text.18",
 		disabled: "transparent",
-		"selected & disabled": "#note-accent-text.08"
+		"selected & disabled": "#note-accent-disabled-surface"
 	},
 	color: {
 		"": "#note-accent-text-soft",
 		selected: "#note-accent-text",
 		disabled: "#disabled-surface-text",
-		"selected & disabled": "#note-accent-disabled-text"
+		"selected & disabled": "#note-accent-disabled-surface-text"
 	}
 };
 const NOTE_LINK_STYLES = {
@@ -664,13 +664,13 @@ const SPECIAL_OUTLINE_STYLES = {
 		"selected & (hovered | focused)": "#special-surface #white.24",
 		"selected & pressed": "#special-surface #white.3",
 		disabled: "#special-surface #white.04",
-		"selected & disabled": "#special-surface #white.17"
+		"selected & disabled": "#special-surface #white.09"
 	},
 	color: {
 		"": "#white.8",
 		selected: "#white",
-		disabled: "#white.23",
-		"selected & disabled": "#white.28"
+		disabled: "#white.4",
+		"selected & disabled": "#white.55"
 	}
 };
 const SPECIAL_CLEAR_STYLES = {
@@ -690,13 +690,12 @@ const SPECIAL_CLEAR_STYLES = {
 		"selected & (hovered | focused)": "#white.94",
 		"selected & pressed": "#white.88",
 		disabled: "#white.0",
-		"selected & disabled": "#white.98"
+		"selected & disabled": "#white.16"
 	},
 	color: {
 		"": "#white.8",
 		selected: "#special-accent-text",
-		disabled: "#white.23",
-		"selected & disabled": "#special-accent-text.45"
+		disabled: "#white.4"
 	}
 };
 const SPECIAL_LINK_STYLES = {
@@ -709,7 +708,7 @@ const SPECIAL_LINK_STYLES = {
 	color: {
 		"": "#white",
 		"hovered & !pressed": "#white.9",
-		disabled: "#white.23"
+		disabled: "#white.4"
 	}
 };
 const SPECIAL_ITEM_STYLES = {
@@ -721,35 +720,36 @@ const SPECIAL_ITEM_STYLES = {
 	},
 	color: {
 		"": "#white",
-		disabled: "#white.23"
+		disabled: "#white.4"
 	}
 };
 const CURRENT_ITEM_RAMP = {
 	"$current-hover": {
 		"": "#current.04",
-		"@dark": "#current.031"
+		"@dark": "#current.07",
+		"theme=special": "#current.08"
 	},
 	"$current-press": {
 		"": "#current.06",
-		"@dark": "#current.046"
+		"@dark": "#current.11",
+		"theme=special": "#current.12"
 	},
 	"$current-selected": {
 		"": "#current.18",
-		"@dark": "#current.13"
+		"@dark": "#current.16",
+		"theme=special": "#current.17"
 	},
 	"$current-selected-hover": {
 		"": "#current.24",
-		"@dark": "#current.175"
+		"@dark": "#current.19",
+		"theme=special": "#current.21"
 	},
 	"$current-selected-press": {
 		"": "#current.3",
-		"@dark": "#current.221"
+		"@dark": "#current.22",
+		"theme=special": "#current.24"
 	}
 };
-const CURRENT_FOCUS_RING = { outline: {
-	"": "0 #primary-accent-text.0",
-	focused: "1bw #primary-accent-text"
-} };
 const CURRENT_ITEM_STYLES = {
 	...CURRENT_ITEM_RAMP,
 	border: "transparent",
@@ -764,19 +764,14 @@ const CURRENT_ITEM_STYLES = {
 	},
 	color: {
 		"": "#current",
-		"disabled & !inherit-disabled & !inside-wrapper": "#current.4"
-	}
-};
-const CURRENT_CLEAR_STYLES = {
-	...CURRENT_ITEM_STYLES,
-	...CURRENT_FOCUS_RING,
-	fill: {
-		...CURRENT_ITEM_STYLES.fill,
-		"selected & disabled": "#current.18"
+		"disabled & !inherit-disabled": "#current.4"
 	}
 };
-const CURRENT_OUTLINE_STYLES = {
-	...CURRENT_FOCUS_RING,
+const CURRENT_BUTTON_STYLES = {
+	outline: {
+		"": "0 #primary-accent-text.0",
+		focused: "1bw #primary-accent-text"
+	},
 	border: {
 		"": "#current.08",
 		"hovered | focused": "#current.15",
@@ -798,80 +793,9 @@ const CURRENT_OUTLINE_STYLES = {
 	},
 	color: {
 		"": "#current",
-		"disabled & !inherit-disabled & !inside-wrapper": "#current.4"
+		disabled: "#current.4"
 	}
 };
-const CURRENT_OUTLINE_2_STYLES = {
-	...CURRENT_FOCUS_RING,
-	border: {
-		"": "#current.14",
-		"hovered | focused": "#current.22",
-		pressed: "#current.3",
-		selected: "#current.36",
-		"selected & pressed": "#current.45",
-		disabled: "#current.2",
-		"selected & disabled": "#current.5"
-	},
-	fill: {
-		"": "#current.06",
-		"hovered | focused": "#current.11",
-		pressed: "#current.15",
-		selected: "#current.17",
-		"selected & (hovered | focused)": "#current.21",
-		"selected & pressed": "#current.24",
-		disabled: "#current.1",
-		"selected & disabled": "#current.26"
-	},
-	color: {
-		"": "#current",
-		"disabled & !inherit-disabled & !inside-wrapper": "#current.4"
-	}
-};
-const CURRENT_PRIMARY_STYLES = {
-	...CURRENT_FOCUS_RING,
-	border: {
-		"": "#current-fill.25",
-		disabled: "#surface-text.2"
-	},
-	fill: {
-		"": "#current #black.0",
-		"hovered | focused": "#current #black.08",
-		pressed: "#current #black.16"
-	},
-	color: {
-		"": "#current",
-		"disabled & !inherit-disabled & !inside-wrapper": "#current.4"
-	},
-	"-webkit-text-fill-color": {
-		"": "#current-fill",
-		disabled: "#current-fill.5"
-	},
-	...Object.fromEntries([
-		"Icon",
-		"RightIcon",
-		"Prefix",
-		"Suffix",
-		"Actions"
-	].map((slot) => [slot, { color: {
-		"": "#current-fill",
-		disabled: "#current-fill.5"
-	} }]))
-};
-const CURRENT_LINK_STYLES = {
-	...CURRENT_FOCUS_RING,
-	border: 0,
-	fill: { "": "transparent" },
-	color: {
-		"": "#current.8",
-		"hovered & !pressed": "#current",
-		"disabled & !inherit-disabled & !inside-wrapper": "#current.4"
-	}
-};
-const CURRENT_CARD_STYLES = {
-	border: "#current.2",
-	fill: "#current.05",
-	color: "#current"
-};
 const DEFAULT_CARD_STYLES = {
 	border: "#surface-text.20",
 	fill: "#surface-3",
@@ -898,13 +822,7 @@ const NOTE_CARD_STYLES = {
 	color: "#note-accent-text"
 };
 const ITEM_VARIANTS = {
-	"current.item": CURRENT_ITEM_STYLES,
-	"current.primary": CURRENT_PRIMARY_STYLES,
-	"current.outline": CURRENT_OUTLINE_STYLES,
-	"current.outline-2": CURRENT_OUTLINE_2_STYLES,
-	"current.clear": CURRENT_CLEAR_STYLES,
-	"current.link": CURRENT_LINK_STYLES,
-	"current.card": CURRENT_CARD_STYLES,
+	"default.current": CURRENT_ITEM_STYLES,
 	"default.primary": DEFAULT_PRIMARY_STYLES,
 	"default.outline": DEFAULT_OUTLINE_STYLES,
 	"default.outline-2": DEFAULT_OUTLINE_2_STYLES,
@@ -948,17 +866,13 @@ const ITEM_VARIANTS = {
 };
 function resolveItemVariant(theme, type) {
 	const effectiveType = theme === "special" && type === "outline-2" ? "outline" : type;
-	return `${effectiveType === "header" ? "default" : theme}.${effectiveType === "header" ? "item" : effectiveType}`;
+	return `${effectiveType === "header" || effectiveType === "current" ? "default" : theme}.${effectiveType === "header" ? "item" : effectiveType}`;
 }
-const ACTIONS_COLOR_OVERRIDES = { "current.primary": {
-	"": "#current-fill",
-	disabled: "#current-fill.5"
-} };
 const ITEM_RESTING_COLOR_VARIANTS = Object.fromEntries(Object.entries(ITEM_VARIANTS).map(([variant, styles]) => {
 	const color = styles.color;
 	if (!color || typeof color !== "object") return [variant, { color }];
-	const map = ACTIONS_COLOR_OVERRIDES[variant] ?? color;
-	const disabled = map.disabled ?? map["disabled & !inherit-disabled & !inside-wrapper"];
+	const map = color;
+	const disabled = map.disabled;
 	return [variant, { color: disabled ? {
 		"": map[""],
 		disabled
@@ -966,5 +880,5 @@ const ITEM_RESTING_COLOR_VARIANTS = Object.fromEntries(Object.entries(ITEM_VARIA
 }));
 //#endregion
-export { CURRENT_CLEAR_STYLES, CURRENT_LINK_STYLES, CURRENT_OUTLINE_2_STYLES, CURRENT_OUTLINE_STYLES, CURRENT_PRIMARY_STYLES, DANGER_CLEAR_STYLES, DANGER_LINK_STYLES, DANGER_OUTLINE_2_STYLES, DANGER_OUTLINE_STYLES, DANGER_PRIMARY_STYLES, DEFAULT_CLEAR_STYLES, DEFAULT_LINK_STYLES, DEFAULT_OUTLINE_2_STYLES, DEFAULT_OUTLINE_STYLES, DEFAULT_PRIMARY_STYLES, ITEM_ACTION_BASE_STYLES, ITEM_RESTING_COLOR_VARIANTS, ITEM_VARIANTS, NOTE_CLEAR_STYLES, NOTE_LINK_STYLES, NOTE_OUTLINE_2_STYLES, NOTE_OUTLINE_STYLES, NOTE_PRIMARY_STYLES, SPECIAL_CLEAR_STYLES, SPECIAL_LINK_STYLES, SPECIAL_OUTLINE_STYLES, SPECIAL_PRIMARY_STYLES, SUCCESS_CLEAR_STYLES, SUCCESS_LINK_STYLES, SUCCESS_OUTLINE_2_STYLES, SUCCESS_OUTLINE_STYLES, SUCCESS_PRIMARY_STYLES, WARNING_CLEAR_STYLES, WARNING_LINK_STYLES, WARNING_OUTLINE_2_STYLES, WARNING_OUTLINE_STYLES, WARNING_PRIMARY_STYLES, resolveItemVariant };
+export { CURRENT_BUTTON_STYLES, CURRENT_ITEM_STYLES, DANGER_CLEAR_STYLES, DANGER_LINK_STYLES, DANGER_OUTLINE_2_STYLES, DANGER_OUTLINE_STYLES, DANGER_PRIMARY_STYLES, DEFAULT_CLEAR_STYLES, DEFAULT_LINK_STYLES, DEFAULT_OUTLINE_2_STYLES, DEFAULT_OUTLINE_STYLES, DEFAULT_PRIMARY_STYLES, ITEM_ACTION_BASE_STYLES, ITEM_RESTING_COLOR_VARIANTS, ITEM_VARIANTS, NOTE_CLEAR_STYLES, NOTE_LINK_STYLES, NOTE_OUTLINE_2_STYLES, NOTE_OUTLINE_STYLES, NOTE_PRIMARY_STYLES, SPECIAL_CLEAR_STYLES, SPECIAL_LINK_STYLES, SPECIAL_OUTLINE_STYLES, SPECIAL_PRIMARY_STYLES, SUCCESS_CLEAR_STYLES, SUCCESS_LINK_STYLES, SUCCESS_OUTLINE_2_STYLES, SUCCESS_OUTLINE_STYLES, SUCCESS_PRIMARY_STYLES, WARNING_CLEAR_STYLES, WARNING_LINK_STYLES, WARNING_OUTLINE_2_STYLES, WARNING_OUTLINE_STYLES, WARNING_PRIMARY_STYLES, resolveItemVariant };
 //# sourceMappingURL=item-themes.js.map