@cube-dev/ui-kit 0.138.6 → 0.139.0

package/dist/data/item-themes.js

@@ -1,8 +1,8 @@
-/** @license MIT | @cube-dev/ui-kit v0.138.6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.139.0 | Cube Dev Team */
 //#region src/data/item-themes.ts
 const VALIDATION_STYLES = { border: {
-	invalid: "#danger-text",
-	valid: "#success-text"
+	invalid: "#danger-accent-text",
+	valid: "#success-accent-text"
 } };
 const ITEM_ACTION_BASE_STYLES = {
 	display: "inline-grid",
@@ -42,730 +42,640 @@ const ITEM_ACTION_BASE_STYLES = {
 		width: "($action-size - 2bw) ($action-size - 2bw)",
 		opacity: {
 			"": 1,
-			"checkbox & selected": 1,
-			"checkbox & !selected": 0,
-			"checkbox & !selected & hovered": .4
+			"checkmark & selected": 1,
+			"checkmark & !selected": 0,
+			"checkmark & !selected & hovered": .4
 		}
 	}
 };
 const DEFAULT_PRIMARY_STYLES = {
 	outline: {
-		"": "0 #primary-text.0",
-		focused: "1bw #primary-text"
+		"": "0 #primary-accent-text.0",
+		focused: "1bw #primary-accent-text"
 	},
 	border: {
 		"": "#white.2",
-		"pressed | focused": "#primary-text",
-		disabled: "#clear"
+		pressed: "#primary-accent-text",
+		disabled: "transparent"
 	},
 	fill: {
-		"": "#surface #primary",
-		hovered: "#surface #primary-hover",
-		pressed: "#surface #primary",
-		disabled: "#primary-accent-disabled-surface"
+		"": "#surface #primary-accent-surface",
+		hovered: "#surface #primary-accent-surface-2",
+		pressed: "#surface #primary-accent-surface-3",
+		disabled: "#surface #primary-accent-disabled-surface"
 	},
 	color: {
 		"": "#white",
 		disabled: "#primary-accent-disabled-surface-text"
 	}
 };
-const DEFAULT_SECONDARY_STYLES = {
-	border: {
-		"": "#primary-text.15",
-		pressed: "#primary-text.3",
-		focused: "#primary-text",
-		disabled: "#border"
-	},
-	fill: {
-		"": "#primary.10",
-		"hovered & !pressed": "#primary.16",
-		disabled: "#disabled-surface"
-	},
-	color: {
-		"": "#primary-text",
-		disabled: "#disabled-surface-text"
-	}
-};
 const DEFAULT_OUTLINE_STYLES = {
+	outline: {
+		"": "0 #primary-accent-text.0",
+		focused: "1bw #primary-accent-text"
+	},
 	border: {
 		"": true,
-		focused: "#primary-text",
-		disabled: true,
+		selected: "#primary-border",
+		disabled: "#border",
 		...VALIDATION_STYLES.border
 	},
 	fill: {
-		"": "#surface-2 #dark.0",
-		hovered: "#surface-2 #dark.03",
-		selected: "#surface-2 #dark.09",
-		"selected & hovered": "#surface-2 #dark.12",
-		pressed: "#surface-2 #dark.09",
-		disabled: "#disabled-surface"
+		"": "#surface-2 #surface-text.0",
+		hovered: "#surface-2 #surface-text.03",
+		pressed: "#surface-2 #surface-text.09",
+		selected: "#surface-2 #primary-accent-surface.09",
+		"selected & (hovered | focused)": "#surface-2 #primary-accent-surface.12",
+		"selected & pressed": "#surface-2 #primary-accent-surface.18",
+		disabled: "#surface-2 #disabled-surface"
 	},
 	color: {
-		"": "#dark-02",
-		hovered: "#dark-02",
-		"pressed | (selected & !hovered)": "#dark",
+		"": "#surface-text-soft",
+		hovered: "#surface-text-soft",
+		pressed: "#surface-text",
+		selected: "#primary-accent-text",
 		disabled: "#disabled-surface-text"
 	}
 };
-const DEFAULT_NEUTRAL_STYLES = {
-	border: {
-		"": "#clear",
-		focused: "#primary-text",
-		...VALIDATION_STYLES.border
-	},
+const DEFAULT_OUTLINE_2_STYLES = {
+	...DEFAULT_OUTLINE_STYLES,
 	fill: {
-		"": "#dark.0",
-		hovered: "#dark.03",
-		selected: "#dark.09",
-		"selected & hovered": "#dark.12",
-		pressed: "#dark.09",
-		disabled: "#clear"
-	},
-	color: {
-		"": "#dark-02",
-		hovered: "#dark-02",
-		pressed: "#dark",
-		disabled: "#disabled-surface-text"
+		"": "#surface-3 #surface-text.0",
+		hovered: "#surface-3 #surface-text.03",
+		pressed: "#surface-3 #surface-text.09",
+		selected: "#surface-3 #primary-accent-surface.09",
+		"selected & (hovered | focused)": "#surface-3 #primary-accent-surface.12",
+		"selected & pressed": "#surface-3 #primary-accent-surface.15",
+		disabled: "#surface-3 #disabled-surface"
 	}
 };
 const DEFAULT_CLEAR_STYLES = {
+	outline: {
+		"": "0 #primary-accent-text.0",
+		focused: "1bw #primary-accent-text"
+	},
 	border: {
-		"": "#clear",
-		pressed: "#primary-text.10",
-		focused: "#primary-text",
+		"": "transparent",
 		...VALIDATION_STYLES.border
 	},
 	fill: {
-		"": "#primary.0",
-		hovered: "#primary.16",
-		"pressed | (selected & !hovered)": "#primary.10"
+		"": "#surface-text.0",
+		"hovered | focused": "#surface-text.04",
+		pressed: "#surface-text.06",
+		selected: "#primary-accent-surface.09",
+		"selected & (hovered | focused)": "#primary-accent-surface.12",
+		"selected & pressed": "#primary-accent-surface.18",
+		disabled: "transparent"
 	},
 	color: {
-		"": "#primary-text",
+		"": "#surface-text-soft",
+		hovered: "#surface-text-soft",
+		"pressed & !selected": "#surface-text",
+		selected: "#primary-accent-text",
 		disabled: "#disabled-surface-text"
 	}
 };
-const DEFAULT_LINK_STYLES = {
-	outline: {
-		"": "0 #primary-text.0",
-		focused: "1bw #primary-text"
+const DEFAULT_ITEM_STYLES = {
+	border: "transparent",
+	fill: {
+		"": "#surface-text.0",
+		"hovered | focused": "#surface-text.04",
+		pressed: "#surface-text.06",
+		selected: "#surface-text.09",
+		"selected & (hovered | focused)": "#surface-text.12",
+		"selected & pressed": "#surface-text.15",
+		disabled: "transparent"
 	},
-	border: "0",
-	fill: { "": "#clear" },
 	color: {
-		"": "#primary-text-soft",
-		"hovered & !pressed": "#primary-text",
+		"": "#surface-text-soft",
+		hovered: "#surface-text-soft",
+		selected: "#surface-text",
 		disabled: "#disabled-surface-text"
 	}
 };
-const DEFAULT_ITEM_STYLES = {
-	border: "#clear",
-	fill: {
-		"": "#dark.0",
-		"hovered | focused": "#dark.03",
-		selected: "#dark.09",
-		"selected & (hovered | focused)": "#dark.12",
-		pressed: "#dark.09",
-		disabled: "#clear"
+const DEFAULT_LINK_STYLES = {
+	outline: {
+		"": "0 #primary-accent-text.0",
+		focused: "1bw #primary-accent-text"
 	},
+	border: "0",
+	fill: { "": "transparent" },
 	color: {
-		"": "#dark-02",
-		hovered: "#dark-02",
-		pressed: "#dark",
+		"": "#primary-accent-text-soft",
+		"hovered & !pressed": "#primary-accent-text",
 		disabled: "#disabled-surface-text"
 	}
 };
 const DANGER_PRIMARY_STYLES = {
 	outline: {
-		"": "0 #danger-text.0",
-		focused: "1bw #danger-text"
+		"": "0 #primary-accent-text.0",
+		focused: "1bw #primary-accent-text"
 	},
 	border: {
 		"": "#white.2",
-		"pressed | focused": "#danger-text",
-		disabled: "#clear"
+		pressed: "#danger-accent-text",
+		disabled: "transparent"
 	},
 	fill: {
-		"": "#surface #danger",
-		hovered: "#surface #danger-hover",
-		pressed: "#surface #danger",
-		disabled: "#danger-accent-disabled-surface"
+		"": "#surface #danger-accent-surface",
+		hovered: "#surface #danger-accent-surface-2",
+		pressed: "#surface #danger-accent-surface-3",
+		disabled: "#surface #danger-accent-disabled-surface"
 	},
 	color: {
 		"": "#white",
 		disabled: "#danger-accent-disabled-surface-text"
 	}
 };
-const DANGER_SECONDARY_STYLES = {
-	border: {
-		"": "#danger-text.15",
-		pressed: "#danger-text.3",
-		focused: "#danger-text",
-		disabled: "#border"
-	},
-	fill: {
-		"": "#danger.05",
-		"hovered & !pressed": "#danger.1",
-		disabled: "#disabled-surface"
-	},
-	color: {
-		"": "#danger-text",
-		disabled: "#disabled-surface-text"
-	}
-};
 const DANGER_OUTLINE_STYLES = {
+	outline: {
+		"": "0 #primary-accent-text.0",
+		focused: "1bw #primary-accent-text"
+	},
 	border: {
-		"": "#danger-text.15",
-		pressed: "#danger-text.3",
-		focused: "#danger-text",
+		"": "#danger-border",
 		disabled: "#border"
 	},
 	fill: {
-		"": "#surface-2 #danger.0",
-		hovered: "#surface-2 #danger.1",
-		"pressed | (selected & !hovered)": "#surface-2 #danger.05",
-		disabled: "#disabled-surface"
+		"": "#surface-2 #danger-accent-surface.0",
+		hovered: "#surface-2 #danger-accent-surface.03",
+		pressed: "#surface-2 #danger-accent-surface.09",
+		selected: "#surface-2 #danger-accent-surface.09",
+		"selected & (hovered | focused)": "#surface-2 #danger-accent-surface.12",
+		"selected & pressed": "#surface-2 #danger-accent-surface.18",
+		disabled: "#surface-2 #disabled-surface"
 	},
 	color: {
-		"": "#danger-text",
+		"": "#danger-accent-text-soft",
+		selected: "#danger-accent-text",
 		disabled: "#disabled-surface-text"
 	}
 };
-const DANGER_NEUTRAL_STYLES = {
-	border: {
-		"": "#clear",
-		focused: "#danger-text"
-	},
+const DANGER_OUTLINE_2_STYLES = {
+	...DANGER_OUTLINE_STYLES,
 	fill: {
-		"": "#dark.0",
-		hovered: "#dark.04",
-		"pressed | (selected & !hovered)": "#dark.05"
-	},
-	color: {
-		"": "#dark-02",
-		"pressed | (selected & !hovered)": "#danger-text",
-		disabled: "#disabled-surface-text"
+		"": "#surface-3 #danger-accent-surface.0",
+		hovered: "#surface-3 #danger-accent-surface.03",
+		pressed: "#surface-3 #danger-accent-surface.09",
+		selected: "#surface-3 #danger-accent-surface.09",
+		"selected & (hovered | focused)": "#surface-3 #danger-accent-surface.12",
+		"selected & pressed": "#surface-3 #danger-accent-surface.18",
+		disabled: "#surface-3 #disabled-surface"
 	}
 };
 const DANGER_CLEAR_STYLES = {
-	border: {
-		"": "#clear",
-		pressed: "#danger.05",
-		focused: "#danger-text"
+	outline: {
+		"": "0 #primary-accent-text.0",
+		focused: "1bw #primary-accent-text"
 	},
+	border: { "": "transparent" },
 	fill: {
-		"": "#danger-text.0",
-		hovered: "#danger-text.03",
-		selected: "#danger-text.09",
-		"selected & hovered": "#danger-text.12",
-		pressed: "#danger-text.09",
-		disabled: "#clear"
+		"": "#surface-text.0",
+		"hovered | focused": "#surface-text.04",
+		pressed: "#surface-text.06",
+		selected: "#danger-accent-text.09",
+		"selected & (hovered | focused)": "#danger-accent-text.12",
+		"selected & pressed": "#danger-accent-text.18",
+		disabled: "transparent"
 	},
 	color: {
-		"": "#danger-text",
-		hovered: "#danger-text",
-		pressed: "#danger-text",
-		disabled: "#danger-text.4"
+		"": "#danger-accent-text-soft",
+		selected: "#danger-accent-text",
+		disabled: "#disabled-surface-text"
 	}
 };
 const DANGER_LINK_STYLES = {
 	outline: {
-		"": "0 #danger-text.0",
-		focused: "1bw #danger-text"
+		"": "0 #primary-accent-text.0",
+		focused: "1bw #primary-accent-text"
 	},
 	border: 0,
-	fill: { "": "#clear" },
+	fill: { "": "transparent" },
 	color: {
-		"": "#danger-text-soft",
-		"hovered & !pressed": "#danger-text",
+		"": "#danger-accent-text-soft",
+		"hovered & !pressed": "#danger-accent-text",
 		disabled: "#disabled-surface-text"
 	}
 };
 const DANGER_ITEM_STYLES = {
-	border: "#clear",
+	border: "transparent",
 	fill: {
-		"": "#danger-text.0",
-		"hovered | focused": "#danger-text.03",
-		selected: "#danger-text.09",
-		"selected & (hovered | focused)": "#danger-text.12",
-		pressed: "#danger-text.09",
-		disabled: "#clear"
+		"": "#danger-accent-text.0",
+		"hovered | focused": "#danger-accent-text.03",
+		selected: "#danger-accent-text.09",
+		"selected & (hovered | focused)": "#danger-accent-text.12",
+		pressed: "#danger-accent-text.09",
+		disabled: "transparent"
 	},
 	color: {
-		"": "#danger-text",
-		hovered: "#danger-text",
-		pressed: "#danger-text",
-		disabled: "#danger-text.4"
+		"": "#danger-accent-text",
+		hovered: "#danger-accent-text",
+		pressed: "#danger-accent-text",
+		disabled: "#danger-accent-text.4"
 	}
 };
 const SUCCESS_PRIMARY_STYLES = {
 	outline: {
-		"": "0 #success-text.0",
-		focused: "1bw #success-text"
+		"": "0 #primary-accent-text.0",
+		focused: "1bw #primary-accent-text"
 	},
 	border: {
 		"": "#white.2",
-		"pressed | focused": "#success-text",
-		disabled: "#clear"
+		pressed: "#success-accent-text",
+		disabled: "transparent"
 	},
 	fill: {
-		"": "#surface #success",
-		hovered: "#surface #success-hover",
-		pressed: "#surface #success",
-		disabled: "#success-accent-disabled-surface"
+		"": "#surface #success-accent-surface",
+		hovered: "#surface #success-accent-surface-2",
+		pressed: "#surface #success-accent-surface-3",
+		disabled: "#surface #success-accent-disabled-surface"
 	},
 	color: {
 		"": "#white",
 		disabled: "#success-accent-disabled-surface-text"
 	}
 };
-const SUCCESS_SECONDARY_STYLES = {
-	border: {
-		"": "#success-text.15",
-		pressed: "#success-text.3",
-		focused: "#success-text",
-		disabled: "#border"
-	},
-	fill: {
-		"": "#success.05",
-		"hovered & !pressed": "#success.1",
-		disabled: "#disabled-surface"
-	},
-	color: {
-		"": "#success-text",
-		disabled: "#disabled-surface-text"
-	}
-};
 const SUCCESS_OUTLINE_STYLES = {
+	outline: {
+		"": "0 #primary-accent-text.0",
+		focused: "1bw #primary-accent-text"
+	},
 	border: {
-		"": "#success-text.15",
-		pressed: "#success-text.3",
-		focused: "#success-text",
+		"": "#success-border",
 		disabled: "#border"
 	},
 	fill: {
-		"": "#surface-2 #success.0",
-		hovered: "#surface-2 #success.1",
-		"pressed | (selected & !hovered)": "#surface-2 #success.05",
-		disabled: "#disabled-surface"
+		"": "#surface-2 #success-accent-surface.0",
+		hovered: "#surface-2 #success-accent-surface.03",
+		pressed: "#surface-2 #success-accent-surface.09",
+		selected: "#surface-2 #success-accent-surface.09",
+		"selected & (hovered | focused)": "#surface-2 #success-accent-surface.12",
+		"selected & pressed": "#surface-2 #success-accent-surface.18",
+		disabled: "#surface-2 #disabled-surface"
 	},
 	color: {
-		"": "#success-text",
+		"": "#success-accent-text-soft",
+		selected: "#success-accent-text",
 		disabled: "#disabled-surface-text"
 	}
 };
-const SUCCESS_NEUTRAL_STYLES = {
-	border: {
-		"": "#clear",
-		focused: "#success-text"
-	},
+const SUCCESS_OUTLINE_2_STYLES = {
+	...SUCCESS_OUTLINE_STYLES,
 	fill: {
-		"": "#dark.0",
-		hovered: "#dark.04",
-		"pressed | (selected & !hovered)": "#dark.05"
-	},
-	color: {
-		"": "#dark-02",
-		"pressed | (selected & !hovered)": "#success-text",
-		disabled: "#disabled-surface-text"
+		"": "#surface-3 #success-accent-surface.0",
+		hovered: "#surface-3 #success-accent-surface.03",
+		pressed: "#surface-3 #success-accent-surface.09",
+		selected: "#surface-3 #success-accent-surface.09",
+		"selected & (hovered | focused)": "#surface-3 #success-accent-surface.12",
+		"selected & pressed": "#surface-3 #success-accent-surface.18",
+		disabled: "#surface-3 #disabled-surface"
 	}
 };
 const SUCCESS_CLEAR_STYLES = {
-	border: {
-		"": "#clear",
-		pressed: "#success.05",
-		focused: "#success-text"
+	outline: {
+		"": "0 #primary-accent-text.0",
+		focused: "1bw #primary-accent-text"
 	},
+	border: { "": "transparent" },
 	fill: {
-		"": "#success-text.0",
-		hovered: "#success-text.03",
-		selected: "#success-text.09",
-		"selected & hovered": "#success-text.12",
-		pressed: "#success-text.09",
-		disabled: "#clear"
+		"": "#surface-text.0",
+		"hovered | focused": "#surface-text.04",
+		pressed: "#surface-text.06",
+		selected: "#success-accent-text.09",
+		"selected & (hovered | focused)": "#success-accent-text.12",
+		"selected & pressed": "#success-accent-text.18",
+		disabled: "transparent"
 	},
 	color: {
-		"": "#success-text",
-		hovered: "#success-text",
-		pressed: "#success-text",
-		disabled: "#success-text.4"
+		"": "#success-accent-text-soft",
+		selected: "#success-accent-text",
+		disabled: "#disabled-surface-text"
 	}
 };
 const SUCCESS_LINK_STYLES = {
 	outline: {
-		"": "0 #success-text.0",
-		focused: "1bw #success-text"
+		"": "0 #primary-accent-text.0",
+		focused: "1bw #primary-accent-text"
 	},
 	border: 0,
-	fill: { "": "#clear" },
+	fill: { "": "transparent" },
 	color: {
-		"": "#success-text-soft",
-		"hovered & !pressed": "#success-text",
+		"": "#success-accent-text-soft",
+		"hovered & !pressed": "#success-accent-text",
 		disabled: "#disabled-surface-text"
 	}
 };
 const SUCCESS_ITEM_STYLES = {
-	border: "#clear",
+	border: "transparent",
 	fill: {
-		"": "#success-text.0",
-		"hovered | focused": "#success-text.03",
-		selected: "#success-text.09",
-		"selected & (hovered | focused)": "#success-text.12",
-		pressed: "#success-text.09",
-		disabled: "#clear"
+		"": "#success-accent-text.0",
+		"hovered | focused": "#success-accent-text.03",
+		selected: "#success-accent-text.09",
+		"selected & (hovered | focused)": "#success-accent-text.12",
+		pressed: "#success-accent-text.09",
+		disabled: "transparent"
 	},
 	color: {
-		"": "#success-text",
-		hovered: "#success-text",
-		pressed: "#success-text",
-		disabled: "#success-text.4"
+		"": "#success-accent-text",
+		hovered: "#success-accent-text",
+		pressed: "#success-accent-text",
+		disabled: "#success-accent-text.4"
 	}
 };
 const WARNING_PRIMARY_STYLES = {
 	outline: {
-		"": "0 #warning-text.0",
-		focused: "1bw #warning-text"
+		"": "0 #primary-accent-text.0",
+		focused: "1bw #primary-accent-text"
 	},
 	border: {
 		"": "#white.2",
-		"pressed | focused": "#warning-text",
-		disabled: "#clear"
+		pressed: "#warning-accent-text",
+		disabled: "transparent"
 	},
 	fill: {
-		"": "#surface #warning",
-		hovered: "#surface #warning-hover",
-		pressed: "#surface #warning",
-		disabled: "#warning-accent-disabled-surface"
+		"": "#surface #warning-accent-surface",
+		hovered: "#surface #warning-accent-surface-2",
+		pressed: "#surface #warning-accent-surface-3",
+		disabled: "#surface #warning-accent-disabled-surface"
 	},
 	color: {
 		"": "#white",
 		disabled: "#warning-accent-disabled-surface-text"
 	}
 };
-const WARNING_SECONDARY_STYLES = {
-	border: {
-		"": "#warning-text.15",
-		pressed: "#warning-text.3",
-		focused: "#warning-text",
-		disabled: "#border"
-	},
-	fill: {
-		"": "#warning.05",
-		"hovered & !pressed": "#warning.1",
-		disabled: "#disabled-surface"
-	},
-	color: {
-		"": "#warning-text",
-		disabled: "#disabled-surface-text"
-	}
-};
 const WARNING_OUTLINE_STYLES = {
+	outline: {
+		"": "0 #primary-accent-text.0",
+		focused: "1bw #primary-accent-text"
+	},
 	border: {
-		"": "#warning-text.15",
-		pressed: "#warning-text.3",
-		focused: "#warning-text",
+		"": "#warning-border",
 		disabled: "#border"
 	},
 	fill: {
-		"": "#surface-2 #warning.0",
-		hovered: "#surface-2 #warning.1",
-		"pressed | (selected & !hovered)": "#surface-2 #warning.05",
-		disabled: "#disabled-surface"
+		"": "#surface-2 #warning-accent-surface.0",
+		hovered: "#surface-2 #warning-accent-surface.03",
+		pressed: "#surface-2 #warning-accent-surface.09",
+		selected: "#surface-2 #warning-accent-surface.09",
+		"selected & (hovered | focused)": "#surface-2 #warning-accent-surface.12",
+		"selected & pressed": "#surface-2 #warning-accent-surface.18",
+		disabled: "#surface-2 #disabled-surface"
 	},
 	color: {
-		"": "#warning-text",
+		"": "#warning-accent-text-soft",
+		selected: "#warning-accent-text",
 		disabled: "#disabled-surface-text"
 	}
 };
-const WARNING_NEUTRAL_STYLES = {
-	border: {
-		"": "#clear",
-		focused: "#warning-text"
-	},
+const WARNING_OUTLINE_2_STYLES = {
+	...WARNING_OUTLINE_STYLES,
 	fill: {
-		"": "#dark.0",
-		hovered: "#dark.04",
-		"pressed | (selected & !hovered)": "#dark.05"
-	},
-	color: {
-		"": "#dark-02",
-		"pressed | (selected & !hovered)": "#warning-text",
-		disabled: "#disabled-surface-text"
+		"": "#surface-3 #warning-accent-surface.0",
+		hovered: "#surface-3 #warning-accent-surface.03",
+		pressed: "#surface-3 #warning-accent-surface.09",
+		selected: "#surface-3 #warning-accent-surface.09",
+		"selected & (hovered | focused)": "#surface-3 #warning-accent-surface.12",
+		"selected & pressed": "#surface-3 #warning-accent-surface.18",
+		disabled: "#surface-3 #disabled-surface"
 	}
 };
 const WARNING_CLEAR_STYLES = {
-	border: {
-		"": "#clear",
-		pressed: "#warning.05",
-		focused: "#warning-text"
+	outline: {
+		"": "0 #primary-accent-text.0",
+		focused: "1bw #primary-accent-text"
 	},
+	border: { "": "transparent" },
 	fill: {
-		"": "#warning-text.0",
-		hovered: "#warning-text.03",
-		selected: "#warning-text.09",
-		"selected & hovered": "#warning-text.12",
-		pressed: "#warning-text.09",
-		disabled: "#clear"
+		"": "#surface-text.0",
+		"hovered | focused": "#surface-text.04",
+		pressed: "#surface-text.06",
+		selected: "#warning-accent-text.09",
+		"selected & (hovered | focused)": "#warning-accent-text.12",
+		"selected & pressed": "#warning-accent-text.18",
+		disabled: "transparent"
 	},
 	color: {
-		"": "#warning-text",
-		hovered: "#warning-text",
-		pressed: "#warning-text",
-		disabled: "#warning-text.4"
+		"": "#warning-accent-text-soft",
+		selected: "#warning-accent-text",
+		disabled: "#disabled-surface-text"
 	}
 };
 const WARNING_LINK_STYLES = {
 	outline: {
-		"": "0 #warning-text.0",
-		focused: "1bw #warning-text"
+		"": "0 #primary-accent-text.0",
+		focused: "1bw #primary-accent-text"
 	},
 	border: 0,
-	fill: { "": "#clear" },
+	fill: { "": "transparent" },
 	color: {
-		"": "#warning-text-soft",
-		"hovered & !pressed": "#warning-text",
+		"": "#warning-accent-text-soft",
+		"hovered & !pressed": "#warning-accent-text",
 		disabled: "#disabled-surface-text"
 	}
 };
 const WARNING_ITEM_STYLES = {
-	border: "#clear",
+	border: "transparent",
 	fill: {
-		"": "#warning-text.0",
-		"hovered | focused": "#warning-text.03",
-		selected: "#warning-text.09",
-		"selected & (hovered | focused)": "#warning-text.12",
-		pressed: "#warning-text.09",
-		disabled: "#clear"
+		"": "#warning-accent-text.0",
+		"hovered | focused": "#warning-accent-text.03",
+		selected: "#warning-accent-text.09",
+		"selected & (hovered | focused)": "#warning-accent-text.12",
+		pressed: "#warning-accent-text.09",
+		disabled: "transparent"
 	},
 	color: {
-		"": "#warning-text",
-		hovered: "#warning-text",
-		pressed: "#warning-text",
-		disabled: "#warning-text.4"
+		"": "#warning-accent-text",
+		hovered: "#warning-accent-text",
+		pressed: "#warning-accent-text",
+		disabled: "#warning-accent-text.4"
 	}
 };
 const NOTE_PRIMARY_STYLES = {
 	outline: {
-		"": "0 #note-text.0",
-		focused: "1bw #note-text"
+		"": "0 #primary-accent-text.0",
+		focused: "1bw #primary-accent-text"
 	},
 	border: {
 		"": "#white.2",
-		"pressed | focused": "#note-text",
-		disabled: "#clear"
+		pressed: "#note-accent-text",
+		disabled: "transparent"
 	},
 	fill: {
-		"": "#surface #note",
-		hovered: "#surface #note-hover",
-		pressed: "#surface #note",
-		disabled: "#note-accent-disabled-surface"
+		"": "#surface #note-accent-surface",
+		hovered: "#surface #note-accent-surface-2",
+		pressed: "#surface #note-accent-surface-3",
+		disabled: "#surface #note-accent-disabled-surface"
 	},
 	color: {
 		"": "#white",
 		disabled: "#note-accent-disabled-surface-text"
 	}
 };
-const NOTE_SECONDARY_STYLES = {
-	border: {
-		"": "#note-text.15",
-		pressed: "#note-text.3",
-		focused: "#note-text",
-		disabled: "#border"
-	},
-	fill: {
-		"": "#note.05",
-		"hovered & !pressed": "#note.1",
-		disabled: "#disabled-surface"
-	},
-	color: {
-		"": "#note-text",
-		disabled: "#disabled-surface-text"
-	}
-};
 const NOTE_OUTLINE_STYLES = {
+	outline: {
+		"": "0 #primary-accent-text.0",
+		focused: "1bw #primary-accent-text"
+	},
 	border: {
-		"": "#note-text.15",
-		pressed: "#note-text.3",
-		focused: "#note-text",
+		"": "#note-border",
 		disabled: "#border"
 	},
 	fill: {
-		"": "#surface-2 #note.0",
-		hovered: "#surface-2 #note.1",
-		"pressed | (selected & !hovered)": "#surface-2 #note.05",
-		disabled: "#disabled-surface"
+		"": "#surface-2 #note-accent-surface.0",
+		hovered: "#surface-2 #note-accent-surface.03",
+		pressed: "#surface-2 #note-accent-surface.09",
+		selected: "#surface-2 #note-accent-surface.09",
+		"selected & (hovered | focused)": "#surface-2 #note-accent-surface.12",
+		"selected & pressed": "#surface-2 #note-accent-surface.18",
+		disabled: "#surface-2 #disabled-surface"
 	},
 	color: {
-		"": "#note-text",
+		"": "#note-accent-text-soft",
+		selected: "#note-accent-text",
 		disabled: "#disabled-surface-text"
 	}
 };
-const NOTE_NEUTRAL_STYLES = {
-	border: {
-		"": "#clear",
-		focused: "#note-text"
-	},
+const NOTE_OUTLINE_2_STYLES = {
+	...NOTE_OUTLINE_STYLES,
 	fill: {
-		"": "#dark.0",
-		hovered: "#dark.04",
-		"pressed | (selected & !hovered)": "#dark.05"
-	},
-	color: {
-		"": "#dark-02",
-		"pressed | (selected & !hovered)": "#note-text",
-		disabled: "#disabled-surface-text"
+		"": "#surface-3 #note-accent-surface.0",
+		hovered: "#surface-3 #note-accent-surface.03",
+		pressed: "#surface-3 #note-accent-surface.09",
+		selected: "#surface-3 #note-accent-surface.09",
+		"selected & (hovered | focused)": "#surface-3 #note-accent-surface.12",
+		"selected & pressed": "#surface-3 #note-accent-surface.18",
+		disabled: "#surface-3 #disabled-surface"
 	}
 };
 const NOTE_CLEAR_STYLES = {
-	border: {
-		"": "#clear",
-		pressed: "#note.05",
-		focused: "#note-text"
+	outline: {
+		"": "0 #primary-accent-text.0",
+		focused: "1bw #primary-accent-text"
 	},
+	border: { "": "transparent" },
 	fill: {
-		"": "#note-text.0",
-		hovered: "#note-text.03",
-		selected: "#note-text.09",
-		"selected & hovered": "#note-text.12",
-		pressed: "#note-text.09",
-		disabled: "#clear"
+		"": "#surface-text.0",
+		"hovered | focused": "#surface-text.04",
+		pressed: "#surface-text.06",
+		selected: "#note-accent-text.09",
+		"selected & (hovered | focused)": "#note-accent-text.12",
+		"selected & pressed": "#note-accent-text.18",
+		disabled: "transparent"
 	},
 	color: {
-		"": "#note-text",
-		hovered: "#note-text",
-		pressed: "#note-text",
-		disabled: "#note-text.4"
+		"": "#note-accent-text-soft",
+		selected: "#note-accent-text",
+		disabled: "#disabled-surface-text"
 	}
 };
 const NOTE_LINK_STYLES = {
 	outline: {
-		"": "0 #note-text.0",
-		focused: "1bw #note-text"
+		"": "0 #primary-accent-text.0",
+		focused: "1bw #primary-accent-text"
 	},
 	border: 0,
-	fill: { "": "#clear" },
+	fill: { "": "transparent" },
 	color: {
-		"": "#note-text-soft",
-		"hovered & !pressed": "#note-text",
+		"": "#note-accent-text-soft",
+		"hovered & !pressed": "#note-accent-text",
 		disabled: "#disabled-surface-text"
 	}
 };
 const NOTE_ITEM_STYLES = {
-	border: "#clear",
+	border: "transparent",
 	fill: {
-		"": "#note-text.0",
-		"hovered | focused": "#note-text.03",
-		selected: "#note-text.09",
-		"selected & (hovered | focused)": "#note-text.12",
-		pressed: "#note-text.09",
-		disabled: "#clear"
+		"": "#note-accent-text.0",
+		"hovered | focused": "#note-accent-text.03",
+		selected: "#note-accent-text.09",
+		"selected & (hovered | focused)": "#note-accent-text.12",
+		pressed: "#note-accent-text.09",
+		disabled: "transparent"
 	},
 	color: {
-		"": "#note-text",
-		hovered: "#note-text",
-		pressed: "#note-text",
-		disabled: "#note-text.4"
+		"": "#note-accent-text",
+		hovered: "#note-accent-text",
+		pressed: "#note-accent-text",
+		disabled: "#note-accent-text.4"
 	}
 };
 const SPECIAL_PRIMARY_STYLES = {
 	outline: {
-		"": "0 #white.0",
-		focused: "1bw #white"
+		"": "0 #special-accent-text.0",
+		focused: "1bw #special-accent-text"
 	},
 	border: {
 		"": "#white.2",
-		"pressed | focused": "#white.4",
-		disabled: "#clear"
-	},
-	fill: {
-		"": "#white #special-accent-fill",
-		hovered: "#white #special-accent-fill-hover",
-		pressed: "#white #special-accent-fill",
-		disabled: "#special-accent-disabled-surface"
-	},
-	color: {
-		"": "#white",
-		disabled: "#special-accent-disabled-surface-text"
-	}
-};
-const SPECIAL_SECONDARY_STYLES = {
-	border: {
-		"": "#white.3",
 		pressed: "#white.4",
-		focused: "#white"
+		disabled: "transparent"
 	},
 	fill: {
-		"": "#white.12",
-		"hovered & !pressed": "#white.18",
-		disabled: "#white.12"
+		"": "#white #special-accent-surface",
+		hovered: "#white #special-accent-surface-2",
+		pressed: "#white #special-accent-surface-3",
+		disabled: "#white #special-accent-disabled-surface"
 	},
 	color: {
 		"": "#white",
-		disabled: "#white.4"
+		disabled: "#special-accent-disabled-surface-text"
 	}
 };
 const SPECIAL_OUTLINE_STYLES = {
+	outline: {
+		"": "0 #special-accent-text.0",
+		focused: "1bw #special-accent-text"
+	},
 	border: {
 		"": "#white.3",
-		pressed: "#white.12",
-		focused: "#white",
+		selected: "#white.4",
 		...VALIDATION_STYLES.border
 	},
 	fill: {
 		"": "#special-surface #white.0",
-		hovered: "#special-surface #white.18",
-		"pressed | (selected & !hovered)": "#special-surface #white.12",
-		disabled: "#white.12"
-	},
-	color: {
-		"": "#white",
-		disabled: "#white.4"
-	}
-};
-const SPECIAL_NEUTRAL_STYLES = {
-	border: {
-		"": "#clear",
-		focused: "#white",
-		...VALIDATION_STYLES.border
-	},
-	fill: {
-		"": "#white.0",
-		hovered: "#white.12",
-		"pressed | (selected & !hovered)": "#white.18"
+		hovered: "#special-surface #white.06",
+		pressed: "#special-surface #white.12",
+		selected: "#special-surface #white.18",
+		"selected & (hovered | focused)": "#special-surface #white.24",
+		"selected & pressed": "#special-surface #white.3",
+		disabled: "#special-surface #white.04"
 	},
 	color: {
-		"": "#white",
+		"": "#white.8",
+		selected: "#white",
 		disabled: "#white.4"
 	}
 };
 const SPECIAL_CLEAR_STYLES = {
-	outline: { focused: "1bw #white" },
+	outline: {
+		"": "0 #special-accent-text.0",
+		focused: "1bw #special-accent-text"
+	},
 	border: {
-		"": "#clear",
-		"pressed | focused": "#white",
-		disabled: "#white.3",
+		"": "transparent",
 		...VALIDATION_STYLES.border
 	},
 	fill: {
-		"": "#white",
-		"hovered & !pressed": "#white.94",
-		disabled: "#white.12"
+		"": "#white.0",
+		"hovered | focused": "#white.12",
+		pressed: "#white.18",
+		selected: "#white",
+		"selected & (hovered | focused)": "#white.94",
+		"selected & pressed": "#white.88",
+		disabled: "#white.0",
+		"selected & disabled": "#white.16"
 	},
 	color: {
-		"": "#special-accent-text",
-		hovered: "#special-accent-fill",
-		"pressed & hovered": "#special-accent-text",
+		"": "#white.8",
+		selected: "#special-accent-text",
 		disabled: "#white.4"
 	}
 };
 const SPECIAL_LINK_STYLES = {
 	outline: {
-		"": "0 #white.0",
-		focused: "1bw #white"
+		"": "0 #special-accent-text.0",
+		focused: "1bw #special-accent-text"
 	},
 	border: "0",
-	fill: { "": "#clear" },
+	fill: { "": "transparent" },
 	color: {
 		"": "#white",
 		"hovered & !pressed": "#white.9",
@@ -773,7 +683,7 @@ const SPECIAL_LINK_STYLES = {
 	}
 };
 const SPECIAL_ITEM_STYLES = {
-	border: "#clear",
+	border: "transparent",
 	fill: {
 		"": "#white.0",
 		hovered: "#white.12",
@@ -785,31 +695,31 @@ const SPECIAL_ITEM_STYLES = {
 	}
 };
 const DEFAULT_CARD_STYLES = {
-	border: "#dark.20",
-	fill: "#light",
-	color: "#dark-02"
+	border: "#surface-text.20",
+	fill: "#surface-3",
+	color: "#surface-text-soft"
 };
 const SUCCESS_CARD_STYLES = {
-	border: "#success.20",
-	fill: "#success-bg",
-	color: "#success-text"
+	border: "#success-accent-surface.20",
+	fill: "#success-surface",
+	color: "#success-accent-text"
 };
 const DANGER_CARD_STYLES = {
-	border: "#danger.20",
-	fill: "#danger-bg",
-	color: "#danger-text"
+	border: "#danger-accent-surface.20",
+	fill: "#danger-surface",
+	color: "#danger-accent-text"
 };
 const WARNING_CARD_STYLES = {
-	border: "#warning.20",
-	fill: "#warning-bg",
-	color: "#warning-text"
+	border: "#warning-accent-surface.20",
+	fill: "#warning-surface",
+	color: "#warning-accent-text"
 };
 const NOTE_CARD_STYLES = {
-	border: "#note.20",
-	fill: "#note-bg",
-	color: "#note-text"
+	border: "#note-accent-surface.20",
+	fill: "#note-surface",
+	color: "#note-accent-text"
 };
 
 //#endregion
-export { DANGER_CARD_STYLES, DANGER_CLEAR_STYLES, DANGER_ITEM_STYLES, DANGER_LINK_STYLES, DANGER_NEUTRAL_STYLES, DANGER_OUTLINE_STYLES, DANGER_PRIMARY_STYLES, DANGER_SECONDARY_STYLES, DEFAULT_CARD_STYLES, DEFAULT_CLEAR_STYLES, DEFAULT_ITEM_STYLES, DEFAULT_LINK_STYLES, DEFAULT_NEUTRAL_STYLES, DEFAULT_OUTLINE_STYLES, DEFAULT_PRIMARY_STYLES, DEFAULT_SECONDARY_STYLES, ITEM_ACTION_BASE_STYLES, NOTE_CARD_STYLES, NOTE_CLEAR_STYLES, NOTE_ITEM_STYLES, NOTE_LINK_STYLES, NOTE_NEUTRAL_STYLES, NOTE_OUTLINE_STYLES, NOTE_PRIMARY_STYLES, NOTE_SECONDARY_STYLES, SPECIAL_CLEAR_STYLES, SPECIAL_ITEM_STYLES, SPECIAL_LINK_STYLES, SPECIAL_NEUTRAL_STYLES, SPECIAL_OUTLINE_STYLES, SPECIAL_PRIMARY_STYLES, SPECIAL_SECONDARY_STYLES, SUCCESS_CARD_STYLES, SUCCESS_CLEAR_STYLES, SUCCESS_ITEM_STYLES, SUCCESS_LINK_STYLES, SUCCESS_NEUTRAL_STYLES, SUCCESS_OUTLINE_STYLES, SUCCESS_PRIMARY_STYLES, SUCCESS_SECONDARY_STYLES, WARNING_CARD_STYLES, WARNING_CLEAR_STYLES, WARNING_ITEM_STYLES, WARNING_LINK_STYLES, WARNING_NEUTRAL_STYLES, WARNING_OUTLINE_STYLES, WARNING_PRIMARY_STYLES, WARNING_SECONDARY_STYLES };
+export { DANGER_CARD_STYLES, DANGER_CLEAR_STYLES, DANGER_ITEM_STYLES, DANGER_LINK_STYLES, DANGER_OUTLINE_2_STYLES, DANGER_OUTLINE_STYLES, DANGER_PRIMARY_STYLES, DEFAULT_CARD_STYLES, DEFAULT_CLEAR_STYLES, DEFAULT_ITEM_STYLES, DEFAULT_LINK_STYLES, DEFAULT_OUTLINE_2_STYLES, DEFAULT_OUTLINE_STYLES, DEFAULT_PRIMARY_STYLES, ITEM_ACTION_BASE_STYLES, NOTE_CARD_STYLES, NOTE_CLEAR_STYLES, NOTE_ITEM_STYLES, NOTE_LINK_STYLES, NOTE_OUTLINE_2_STYLES, NOTE_OUTLINE_STYLES, NOTE_PRIMARY_STYLES, SPECIAL_CLEAR_STYLES, SPECIAL_ITEM_STYLES, SPECIAL_LINK_STYLES, SPECIAL_OUTLINE_STYLES, SPECIAL_PRIMARY_STYLES, SUCCESS_CARD_STYLES, SUCCESS_CLEAR_STYLES, SUCCESS_ITEM_STYLES, SUCCESS_LINK_STYLES, SUCCESS_OUTLINE_2_STYLES, SUCCESS_OUTLINE_STYLES, SUCCESS_PRIMARY_STYLES, WARNING_CARD_STYLES, WARNING_CLEAR_STYLES, WARNING_ITEM_STYLES, WARNING_LINK_STYLES, WARNING_OUTLINE_2_STYLES, WARNING_OUTLINE_STYLES, WARNING_PRIMARY_STYLES };
 //# sourceMappingURL=item-themes.js.map