@kinetixui/cli 0.23.2 → 0.23.3

package/dist/index.js

@@ -2468,6 +2468,59 @@ function swiftColor(hex) {
   const [r, g, b] = swiftUiChannels(`#${h}`);
   return `Color(red: ${r}, green: ${g}, blue: ${b})`;
 }
+function swiftShadowColor(hex) {
+  const h = hex.replace("#", "").trim();
+  if (!/^[0-9a-fA-F]{6}([0-9a-fA-F]{2})?$/.test(h)) return null;
+  const base = h.slice(0, 6) === "000000" ? "Color.black" : swiftColor(`#${h.slice(0, 6)}`);
+  if (!base) return null;
+  if (h.length === 6) return base;
+  const alpha = Number((parseInt(h.slice(6, 8), 16) / 255).toFixed(3));
+  return `${base}.opacity(${alpha})`;
+}
+var RADIUS_STEPS2 = ["sm", "md", "lg", "xl"];
+var ELEVATION_STEPS = ["sm", "md", "lg", "xl"];
+var sameLayers = (a, b) => a.length === b.length && a.every((layer, i) => {
+  const other = b[i];
+  return layer.color.toLowerCase() === other.color.toLowerCase() && layer.offsetX === other.offsetX && layer.offsetY === other.offsetY && layer.blur === other.blur && layer.spread === other.spread;
+});
+var swiftLength = (value) => Number(Number(value).toFixed(3));
+function swiftRadii(radius) {
+  if (RADIUS_STEPS2.every((step) => radius[step] === SHIPPED_RADIUS[step])) return "KinetixRadii.default";
+  return [
+    "KinetixRadii(",
+    `        field: ${swiftLength(String(radius.sm))},`,
+    `        control: ${swiftLength(String(radius.md))},`,
+    `        container: ${swiftLength(String(radius.lg))},`,
+    `        surface: ${swiftLength(String(radius.xl))}`,
+    "    )"
+  ].join("\n");
+}
+function swiftElevations(elevation) {
+  if (ELEVATION_STEPS.every((s) => sameLayers(elevation[s], SHIPPED_ELEVATION[s]))) return "KinetixElevations.default";
+  const step = (layers) => {
+    if (layers.length === 0) return ".none";
+    const rendered = layers.map((layer) => {
+      const color = swiftShadowColor(layer.color) ?? "Color.black.opacity(0.05)";
+      return [
+        "            KinetixShadowLayer(",
+        `                color: ${color},`,
+        `                radius: ${swiftLength(layer.blur)},`,
+        `                x: ${swiftLength(layer.offsetX)},`,
+        `                y: ${swiftLength(layer.offsetY)}`,
+        "            ),"
+      ].join("\n");
+    });
+    return ["KinetixElevation([", ...rendered, "        ])"].join("\n");
+  };
+  return [
+    "KinetixElevations(",
+    `        sm: ${step(elevation.sm)},`,
+    `        md: ${step(elevation.md)},`,
+    `        lg: ${step(elevation.lg)},`,
+    `        xl: ${step(elevation.xl)}`,
+    "    )"
+  ].join("\n");
+}
 var SWIFT_COLOR_FIELDS = [
   "primary",
   "primary-foreground",
@@ -2534,12 +2587,16 @@ function header3(symbol, theme2) {
     "// editing this file: it is a rendering of a preset, not a source of one.",
     "//",
     `// Theme colour ${design.brand} \xB7 ${design.neutral} neutral \xB7 ${design.chartPalette} charts`,
+    `// Radius ${design.radius} \xB7 surface ${design.surface}`,
     "//",
-    "// COLOURS ONLY \u2014 and that is now a limit of this exporter rather than of the package. SwiftUI",
-    "// gained `KinetixRadii` and `KinetixElevations` alongside `KinetixColors`, so there is somewhere",
-    `// for a radius to land; this file does not write one yet. This design's radius (${design.radius}) and`,
-    `// surface treatment (${design.surface}) are therefore NOT carried here \u2014 set them by hand for now:`,
-    "// `KinetixTheme(light: \u2026, dark: \u2026, radii: \u2026, elevations: \u2026)`. Nothing is silently dropped.",
+    "// Colours, corner radii and elevation \u2014 the whole design this file can express. Radii and",
+    "// elevation are one value rather than a light/dark pair, because the runtime takes one and the",
+    "// two appearances resolve to the same ladder.",
+    "//",
+    "// ONE THING DOES NOT SURVIVE THE PORT. CSS shadows have `spread`; SwiftUI's `.shadow` has no",
+    "// equivalent, so the spread on this design's larger steps is dropped and they render slightly",
+    "// wider here than on the web. The shipped `KinetixElevations.default` is mapped the same way, so",
+    "// a generated theme and the built-in one differ from the web in exactly the same manner.",
     "//",
     "// A field written as `KinetixColorsSwiftUI.\u2026` is one this design did not change, and it keeps",
     "// following the library.",
@@ -2557,8 +2614,9 @@ function exportSwiftUi(theme2, options = {}) {
     "import KinetixUI",
     "",
     `public enum ${symbol} {`,
-    "    /// Apply with `KinetixTheme(light: .light, dark: .dark) { \u2026 }`, or set",
-    "    /// `\\.kinetixColors` directly to pin one appearance.",
+    "    /// Apply the whole design with",
+    `    /// \`KinetixTheme(light: .light, dark: .dark, radii: .radii, elevations: .elevations) { \u2026 }\`,`,
+    "    /// or set `\\.kinetixColors` directly to pin one appearance.",
     `    public static let light = KinetixColors(`,
     colorSet3(theme2.light, "light"),
     "    )",
@@ -2566,6 +2624,13 @@ function exportSwiftUi(theme2, options = {}) {
     `    public static let dark = KinetixColors(`,
     colorSet3(theme2.dark, "dark"),
     "    )",
+    "",
+    // One value, not a light/dark pair: the runtime takes one, and the resolver produces the same
+    // ladder for both appearances — a card's corner does not change when the lights go out.
+    // `swiftui.test.ts` asserts that equality rather than trusting it.
+    `    public static let radii = ${swiftRadii(theme2.light.radius)}`,
+    "",
+    `    public static let elevations = ${swiftElevations(theme2.light.elevation)}`,
     "}",
     ""
   ].join("\n");
@@ -2637,7 +2702,10 @@ async function presetSwiftUi(input, opts) {
   const swift = exportSwiftUi(resolveCreateTheme(read(input)), { symbol });
   if (opts.output) {
     await writeFile3(opts.output, swift, "utf8");
-    console.log(pc8.green("\u2714"), `Wrote ${opts.output} \u2014 apply it with KinetixTheme(light: ${symbol}.light, dark: ${symbol}.dark)`);
+    console.log(
+      pc8.green("\u2714"),
+      `Wrote ${opts.output} \u2014 apply it with KinetixTheme(light: ${symbol}.light, dark: ${symbol}.dark, radii: ${symbol}.radii, elevations: ${symbol}.elevations)`
+    );
     return;
   }
   process.stdout.write(swift);
@@ -2886,7 +2954,7 @@ async function themeBuild(name, options) {
 // package.json
 var package_default = {
   name: "@kinetixui/cli",
-  version: "0.23.2",
+  version: "0.23.3",
   description: "Add KinetixUI components and tokens to your project.",
   type: "module",
   license: "MIT",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kinetixui/cli",
-  "version": "0.23.2",
+  "version": "0.23.3",
   "description": "Add KinetixUI components and tokens to your project.",
   "type": "module",
   "license": "MIT",