highsoft-ui 1.0.149 → 1.0.151

package/CLAUDE.md

@@ -216,7 +216,7 @@ Language, framework and platform brand icons in two themes.
 <FrameworkIcon icon="html" theme="monochrome" size={24} />       // follows text color
 <FrameworkIcon icon="react" size={32} box />                     // layered box tile
 ```
-- **`icon`:** `javascript`, `typescript`, `react`, `vue`, `angular`, `python`, `swift`, `android`, `html`, `css`, `dotnet`
+- **`icon`:** `javascript`, `typescript`, `react`, `vue`, `angular`, `python`, `swift`, `android`, `html`, `css`, `dotnet`, `figma`, `flutter`
 - **`theme`:** `multi` (default, full brand color) | `monochrome` (single tone via `currentColor`)
 - **`size`:** `12` | `16` | `20` | `24` (default) | `32` | `40` | `52` | `64` | `72`
 - **`box`:** wraps the icon in a shell + inner tile with a hover lift; the shell background reads `--hsui-icon-box-bg` so a parent (e.g. a selected `RadioBox`) can retint it without a prop
@@ -229,7 +229,7 @@ The `.tsx` icons are **generated** — edit the Figma exports in `lib/components
 - Icons are **decorative by default** — they render as an inline `<svg>` with no `<title>` and carry no accessible name, so they add no noise to the AT tree. When an icon is the *only* content of a control, give it a name at the call site: pass `role="img"` + `aria-label` (props spread onto the `<svg>`), or label the wrapping button — never rely on the icon alone to name the control.
 - **Contrast:** monochrome inherits `currentColor` from its container, so it meets the same contrast as adjacent text. The single-knockout path above is what keeps the glyph legible against any surface (WCAG 1.4.11 non-text contrast) rather than depending on a white backdrop.
 - **Keyboard/focus:** the icon is a non-interactive `<span>` — it takes no focus and adds nothing to the tab order. `box` is purely presentational; focus styling belongs to the interactive ancestor.
-- **Reduced motion:** the `box` hover lift (`transform` + `box-shadow`) is *not* yet wrapped in a `prefers-reduced-motion` guard — it animates on the design-token durations regardless. Wrap it before using `box` in motion-sensitive contexts.
+- **Reduced motion:** under `prefers-reduced-motion: reduce` the `box` tile drops the hover lift — the `translateY` is cancelled and the transition removed — while the `box-shadow` step stays, so the affordance survives as an instant depth change rather than a movement. The outer shell keeps its `background-color` fade: that's a colour change, not motion.
 
 ### InputSolo
 Standalone, self-bordered text field with a floating label, help text, and error/success states.

package/dist/{CodeBlock-BeseY88j.js → CodeBlock-BKiZQpA5.js}

@@ -2,7 +2,7 @@ import { r as e, s as t } from "./utils-K9S_6_Eq.js";
 import { t as n } from "./clsx-BWCAbrjV.js";
 import { H as r, K as i } from "./esm-BnxclXHW.js";
 import { t as a } from "./Button-BGsqFCRW.js";
-import { t as o } from "./FrameworkIcon-Ds6WrxO0.js";
+import { t as o } from "./FrameworkIcon-D7N3PjYr.js";
 import { Fragment as s, forwardRef as c, useCallback as l, useEffect as u, useMemo as d, useState as f } from "react";
 import { jsx as p, jsxs as m } from "react/jsx-runtime";
 var h = {

package/dist/{FrameworkIcon-Ds6WrxO0.js → FrameworkIcon-D7N3PjYr.js}

@@ -18,7 +18,9 @@ var i = {
 	android: "Android",
 	html: "Html",
 	css: "Css",
-	dotnet: "Dotnet"
+	dotnet: "Dotnet",
+	figma: "Figma",
+	flutter: "Flutter"
 }, o = {
 	multi: t,
 	monochrome: n

package/dist/components/CodeBlock/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "../../CodeBlock-BeseY88j.js";
+import { t as e } from "../../CodeBlock-BKiZQpA5.js";
 export { e as CodeBlock };

package/dist/components/FrameworkIcon/icons/monochrome/Figma.js

@@ -0,0 +1,20 @@
+import { jsx as e } from "react/jsx-runtime";
+//#region lib/components/FrameworkIcon/icons/monochrome/Figma.tsx
+function t(t) {
+	return /* @__PURE__ */ e("svg", {
+		width: "16",
+		height: "16",
+		viewBox: "0 0 20 20",
+		fill: "none",
+		xmlns: "http://www.w3.org/2000/svg",
+		...t,
+		children: /* @__PURE__ */ e("path", {
+			fill: "currentColor",
+			fillRule: "evenodd",
+			clipRule: "evenodd",
+			d: "M4.763 6.868A3.736 3.736 0 0 1 6.8 0h6.4a3.736 3.736 0 0 1 2.037 6.868 3.736 3.736 0 0 1-2.037 6.868h-.068a3.72 3.72 0 0 1-2.528-.986v3.48c0 2.087-1.71 3.77-3.787 3.77-2.06 0-3.753-1.668-3.753-3.736 0-1.311.676-2.465 1.699-3.132A3.73 3.73 0 0 1 3.064 10c0-1.312.676-2.466 1.699-3.132M10.603 10a2.53 2.53 0 0 0 2.53 2.529h.067a2.529 2.529 0 0 0 0-5.058h-.068A2.53 2.53 0 0 0 10.604 10M9.397 7.471H6.8a2.529 2.529 0 0 0-.009 5.058h2.605zM6.8 13.736H6.79a2.53 2.53 0 0 0-2.52 2.528c0 1.393 1.145 2.529 2.546 2.529 1.42 0 2.58-1.152 2.58-2.563v-2.494zm2.596-7.472H6.8a2.529 2.529 0 1 1 0-5.057h2.596zm3.804 0h-2.596V1.207H13.2a2.528 2.528 0 1 1 0 5.057"
+		})
+	});
+}
+//#endregion
+export { t as default };

package/dist/components/FrameworkIcon/icons/monochrome/Flutter.js

@@ -0,0 +1,18 @@
+import { jsx as e } from "react/jsx-runtime";
+//#region lib/components/FrameworkIcon/icons/monochrome/Flutter.tsx
+function t(t) {
+	return /* @__PURE__ */ e("svg", {
+		width: "16",
+		height: "16",
+		viewBox: "0 0 20 20",
+		fill: "none",
+		xmlns: "http://www.w3.org/2000/svg",
+		...t,
+		children: /* @__PURE__ */ e("path", {
+			fill: "currentColor",
+			d: "M5.27201 12.6573L2.59601 9.98133L11.296 1.28H16.6507L5.27201 12.6573ZM11.9653 14L16.6493 18.6813H11.296L8.95331 16.3387L11.9653 14ZM11.9653 14L8.95331 11.6533L11.296 9.312H16.6506L11.9653 14ZM6.61066 14L9.28799 11.32L11.9653 14L9.28799 16.6733L6.61066 14ZM9.28802 16.6733L11.9654 13.996L13.304 15.3347L9.28802 16.6733Z"
+		})
+	});
+}
+//#endregion
+export { t as default };

package/dist/components/FrameworkIcon/icons/monochrome/index.js

@@ -3,26 +3,30 @@ import t from "./Android.js";
 import n from "./Angular.js";
 import r from "./Css.js";
 import i from "./Dotnet.js";
-import a from "./Html.js";
-import o from "./Javascript.js";
-import s from "./Python.js";
-import c from "./React.js";
-import l from "./Swift.js";
-import u from "./Typescript.js";
-import d from "./Vue.js";
+import a from "./Figma.js";
+import o from "./Flutter.js";
+import s from "./Html.js";
+import c from "./Javascript.js";
+import l from "./Python.js";
+import u from "./React.js";
+import d from "./Swift.js";
+import f from "./Typescript.js";
+import p from "./Vue.js";
 //#region lib/components/FrameworkIcon/icons/monochrome/index.ts
-var f = /* @__PURE__ */ e({
+var m = /* @__PURE__ */ e({
 	Android: () => t,
 	Angular: () => n,
 	Css: () => r,
 	Dotnet: () => i,
-	Html: () => a,
-	Javascript: () => o,
-	Python: () => s,
-	React: () => c,
-	Swift: () => l,
-	Typescript: () => u,
-	Vue: () => d
+	Figma: () => a,
+	Flutter: () => o,
+	Html: () => s,
+	Javascript: () => c,
+	Python: () => l,
+	React: () => u,
+	Swift: () => d,
+	Typescript: () => f,
+	Vue: () => p
 });
 //#endregion
-export { t as Android, n as Angular, r as Css, i as Dotnet, a as Html, o as Javascript, s as Python, c as React, l as Swift, u as Typescript, d as Vue, f as t };
+export { t as Android, n as Angular, r as Css, i as Dotnet, a as Figma, o as Flutter, s as Html, c as Javascript, l as Python, u as React, d as Swift, f as Typescript, p as Vue, m as t };

package/dist/components/FrameworkIcon/icons/multi/Figma.js

@@ -0,0 +1,36 @@
+import { jsx as e, jsxs as t } from "react/jsx-runtime";
+//#region lib/components/FrameworkIcon/icons/multi/Figma.tsx
+function n(n) {
+	return /* @__PURE__ */ t("svg", {
+		width: "16",
+		height: "16",
+		viewBox: "0 0 20 20",
+		fill: "none",
+		xmlns: "http://www.w3.org/2000/svg",
+		...n,
+		children: [
+			/* @__PURE__ */ e("path", {
+				fill: "#24cb71",
+				d: "M3.333 16.667a3.333 3.333 0 0 1 3.334-3.334H10v3.334a3.333 3.333 0 1 1-6.667 0"
+			}),
+			/* @__PURE__ */ e("path", {
+				fill: "#ff7237",
+				d: "M10 0v6.667h3.333a3.333 3.333 0 1 0 0-6.667z"
+			}),
+			/* @__PURE__ */ e("path", {
+				fill: "#00b6ff",
+				d: "M13.306 13.333a3.333 3.333 0 1 0 0-6.666 3.333 3.333 0 0 0 0 6.666"
+			}),
+			/* @__PURE__ */ e("path", {
+				fill: "#ff3737",
+				d: "M3.333 3.333a3.333 3.333 0 0 0 3.334 3.334H10V0H6.667a3.333 3.333 0 0 0-3.334 3.333"
+			}),
+			/* @__PURE__ */ e("path", {
+				fill: "#874fff",
+				d: "M3.333 10a3.333 3.333 0 0 0 3.334 3.333H10V6.667H6.667A3.333 3.333 0 0 0 3.333 10"
+			})
+		]
+	});
+}
+//#endregion
+export { n as default };

package/dist/components/FrameworkIcon/icons/multi/Flutter.js

@@ -0,0 +1,50 @@
+import { jsx as e, jsxs as t } from "react/jsx-runtime";
+//#region lib/components/FrameworkIcon/icons/multi/Flutter.tsx
+function n(n) {
+	return /* @__PURE__ */ t("svg", {
+		width: "16",
+		height: "16",
+		viewBox: "0 0 20 20",
+		fill: "none",
+		xmlns: "http://www.w3.org/2000/svg",
+		...n,
+		children: [
+			/* @__PURE__ */ e("path", {
+				fill: "#54C5F8",
+				d: "M5.27201 12.6573L2.59601 9.98133L11.296 1.28H16.6507L5.27201 12.6573Z"
+			}),
+			/* @__PURE__ */ e("path", {
+				fill: "#01579B",
+				d: "M8.95331 16.3387L11.296 18.6813H16.6493L11.9653 14L8.95331 16.3387Z"
+			}),
+			/* @__PURE__ */ e("path", {
+				fill: "#54C5F8",
+				d: "M16.6506 9.312H11.296L8.95331 11.6533L11.9653 14L16.6506 9.312Z"
+			}),
+			/* @__PURE__ */ e("path", {
+				fill: "#29B6F6",
+				fillRule: "evenodd",
+				clipRule: "evenodd",
+				d: "M6.61066 14L9.28799 11.32L11.9653 14L9.28799 16.6733L6.61066 14Z"
+			}),
+			/* @__PURE__ */ e("path", {
+				fill: "url(#hs-flutter-shade)",
+				d: "M9.28802 16.6733L11.9654 13.996L13.304 15.3347L9.28802 16.6733Z"
+			}),
+			/* @__PURE__ */ e("defs", { children: /* @__PURE__ */ t("linearGradient", {
+				id: "hs-flutter-shade",
+				x1: "12.4534",
+				y1: "14.776",
+				x2: "9.84136",
+				y2: "16.3573",
+				gradientUnits: "userSpaceOnUse",
+				children: [/* @__PURE__ */ e("stop", { stopColor: "#01579B" }), /* @__PURE__ */ e("stop", {
+					offset: "1",
+					stopColor: "#002B4B"
+				})]
+			}) })
+		]
+	});
+}
+//#endregion
+export { n as default };

package/dist/components/FrameworkIcon/icons/multi/index.js

@@ -3,26 +3,30 @@ import t from "./Android.js";
 import n from "./Angular.js";
 import r from "./Css.js";
 import i from "./Dotnet.js";
-import a from "./Html.js";
-import o from "./Javascript.js";
-import s from "./Python.js";
-import c from "./React.js";
-import l from "./Swift.js";
-import u from "./Typescript.js";
-import d from "./Vue.js";
+import a from "./Figma.js";
+import o from "./Flutter.js";
+import s from "./Html.js";
+import c from "./Javascript.js";
+import l from "./Python.js";
+import u from "./React.js";
+import d from "./Swift.js";
+import f from "./Typescript.js";
+import p from "./Vue.js";
 //#region lib/components/FrameworkIcon/icons/multi/index.ts
-var f = /* @__PURE__ */ e({
+var m = /* @__PURE__ */ e({
 	Android: () => t,
 	Angular: () => n,
 	Css: () => r,
 	Dotnet: () => i,
-	Html: () => a,
-	Javascript: () => o,
-	Python: () => s,
-	React: () => c,
-	Swift: () => l,
-	Typescript: () => u,
-	Vue: () => d
+	Figma: () => a,
+	Flutter: () => o,
+	Html: () => s,
+	Javascript: () => c,
+	Python: () => l,
+	React: () => u,
+	Swift: () => d,
+	Typescript: () => f,
+	Vue: () => p
 });
 //#endregion
-export { t as Android, n as Angular, r as Css, i as Dotnet, a as Html, o as Javascript, s as Python, c as React, l as Swift, u as Typescript, d as Vue, f as t };
+export { t as Android, n as Angular, r as Css, i as Dotnet, a as Figma, o as Flutter, s as Html, c as Javascript, l as Python, u as React, d as Swift, f as Typescript, p as Vue, m as t };

package/dist/components/FrameworkIcon/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "../../FrameworkIcon-Ds6WrxO0.js";
+import { t as e } from "../../FrameworkIcon-D7N3PjYr.js";
 export { e as FrameworkIcon };