@cyclone-ui/theme-builder 0.0.5 → 0.0.7

package/CHANGELOG.md

@@ -2,6 +2,24 @@
 
 # Changelog for Cyclone UI - Theme Builder
 
+## [0.0.7](https://github.com/storm-software/cyclone-ui/releases/tag/theme-builder%400.0.7) (10/14/2026)
+
+### Bug Fixes
+
+- **monorepo:** Clean up components display styling ([1866f60c](https://github.com/storm-software/cyclone-ui/commit/1866f60c))
+
+### Features
+
+- **time-picker:** Added the Time Picker form field component ([8add53ce](https://github.com/storm-software/cyclone-ui/commit/8add53ce))
+- **data-table:** Added `card` theme to Data Table component ([74202899](https://github.com/storm-software/cyclone-ui/commit/74202899))
+
+## [0.0.6](https://github.com/storm-software/cyclone-ui/releases/tag/theme-builder%400.0.6) (10/13/2026)
+
+### Bug Fixes
+
+- **monorepo:** Clean up of various components and tokens ([08a494ad](https://github.com/storm-software/cyclone-ui/commit/08a494ad))
+- **tokens:** Further updates to token structure for improved theme customizations ([c694f50b](https://github.com/storm-software/cyclone-ui/commit/c694f50b))
+
 ## [0.0.5](https://github.com/storm-software/cyclone-ui/releases/tag/theme-builder%400.0.5) (10/12/2026)
 
 ### Bug Fixes

package/dist/preprocessor.cjs

@@ -1 +1 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});let e=require("@razorwind/core/plugin");const t=/^#(?:[0-9a-f]{3,4}|[0-9a-f]{6}|[0-9a-f]{8})$/i,n=/^oklch\(\s*([0-9.]+%?|none)\s+([0-9.]+|none)\s+([0-9.]+|none)(?:\s*\/\s*([0-9.%]+))?\s*\)$/i,r=/* @__PURE__ */ new Set([`$schema`,`$type`,`$description`,`$extensions`,`$extends`,`$deprecated`,`$root`,`$value`,`$ref`,`theme`,`palette`,`primitive`]);function i(e){return typeof e==`object`&&!!e&&!Array.isArray(e)}function a(e){return i(e)&&(`$value`in e||`$ref`in e)}function o(e){let t=e.trim();return t.startsWith(`{`)||t.startsWith(`var(`)}function s(e){return Math.min(1,Math.max(0,e))}function c(e){let t=s(e);return t<=.0031308?12.92*t:1.055*t**(1/2.4)-.055}function l(e){let t=s(e);return t<=.04045?t/12.92:((t+.055)/1.055)**2.4}function u(e){return Math.round(c(e)*255).toString(16).padStart(2,`0`)}function d(e){return Math.round(s(e)*255).toString(16).padStart(2,`0`)}function f(e){return Math.round(s(e)*255).toString(16).padStart(2,`0`)}function p(e){let t=e.startsWith(`#`)?e.slice(1):e;return t.length===3||t.length===4?`#${[...t].map(e=>e+e).join(``)}`:`#${t}`}function m(e){if(typeof e==`string`){let n=e.trim();if(!t.test(n))return;let r=p(n).toLowerCase();return r.length===9&&r.endsWith(`ff`)?r.slice(0,7):r}if(i(e)){if(typeof e.hex==`string`&&t.test(e.hex)){let t=p(e.hex).toLowerCase().slice(0,7),n=v(e.alpha);return n!==void 0&&n<1?`${t}${f(n)}`:t}if(e.colorSpace===`srgb`&&Array.isArray(e.components)&&e.components.length>=3){let t=_(e.components[0]),n=_(e.components[1]),r=_(e.components[2]);if(t===void 0||n===void 0||r===void 0)return;let i=`#${d(t)}${d(n)}${d(r)}`,a=v(e.alpha);return a!==void 0&&a<1?`${i}${f(a)}`:i}}}function h(e,t,n){let r=n*Math.PI/180,i=t*Math.cos(r),a=t*Math.sin(r),o=e+.3963377774*i+.2158037573*a,s=e-.1055613458*i-.0638541728*a,c=e-.0894841775*i-1.291485548*a,l=o**3,u=s**3,d=c**3;return{red:4.0767416621*l-3.3077115913*u+.2309699292*d,green:-1.2684380046*l+2.6097574011*u-.3413193965*d,blue:-.0041960863*l-.7034186147*u+1.707614701*d}}function g(e,t,n,r){let{red:i,green:a,blue:o}=h(e,t,n),s=`#${u(i)}${u(a)}${u(o)}`;return r===void 0||r>=1?s:`${s}${f(r)}`}function _(e){if(typeof e==`number`&&Number.isFinite(e))return e;if(typeof e!=`string`||e===`none`)return;let t=Number.parseFloat(e);return Number.isFinite(t)?t:void 0}function v(e){if(typeof e==`number`&&Number.isFinite(e))return e>1?e/100:e;if(typeof e!=`string`)return;let t=Number.parseFloat(e);if(Number.isFinite(t))return e.includes(`%`)||t>1?t/100:t}function ee(e){let t=n.exec(e.trim());if(!t)return;let r=_(t[1]),i=_(t[2]),a=_(t[3]);if(r!==void 0&&i!==void 0&&a!==void 0)return t[1]?.includes(`%`)&&(r/=100),g(r,i,a,v(t[4]))}function te(e){if(!Array.isArray(e.components)||e.components.length<3)return;let t=_(e.components[0]),n=_(e.components[1]),r=_(e.components[2]);if(t!==void 0&&n!==void 0&&r!==void 0)return t>1&&(t/=100),g(t,n,r,v(e.alpha))}function y(e){if(typeof e==`string`)return o(e)?void 0:ee(e)??m(e)??void 0;if(i(e))return typeof e.colorSpace==`string`&&e.colorSpace.toLowerCase()===`oklch`?te(e):m(e)??void 0}function b(e){if(Array.isArray(e))return e.map(e=>b(e));if(!i(e)||!(`color`in e))return e;let t=y(e.color);return t?{...e,color:t}:e}function ne(e,t){if(t===`shadow`)return b(e);if(t===`border`&&i(e)&&`color`in e){let t=y(e.color);return t?{...e,color:t}:e}return t===`color`||t===void 0?y(e)??e:e}function x(e,t){return typeof e.$type==`string`?e.$type:typeof e.type==`string`?e.type:t}function re(e,t){if(`$ref`in e&&!(`$value`in e))return{...e};let n=x(e,t);return`$value`in e?{...e,$value:ne(e.$value,n)}:{...e}}function S(e,t){if(Array.isArray(e))return e.map(e=>S(e,t));if(!i(e))return e;if(a(e))return re(e,t);let n=typeof e.$type==`string`?e.$type:t,o={};for(let[t,i]of Object.entries(e))o[t]=r.has(t)||t.startsWith(`$`)?i:S(i,n);return o}const C={dark:`#ffffff`,light:`#0c0c0d`},ie={dark:`#ffffff`,light:`#000000`};function w(e){if(typeof e!=`string`)return;let t=/\b(dark|light)[\s-]+theme\b/i.exec(e)?.[1];return t?.toLowerCase()===`dark`?`dark`:t?.toLowerCase()===`light`?`light`:void 0}function ae(e){if(i(e)&&i(e.color))return w(e.color.$description)}const oe={name:`active`,brightness:1.45,useContrastPrimitive:!0},se={name:`active`,brightness:1.25},ce={name:`active`,brightness:1.125},le={name:`active`,brightness:1.4},ue={name:`active`,brightness:1.8,useContrastPrimitive:!0},T={name:`inactive`,brightness:.8},E={name:`inactive`,brightness:.6,useContrastPrimitive:!0},D={name:`disabled`,opacity:.35,saturation:.85,fadeOver:`oklch(0.3839 0.0045 286.26)`},O={lowSaturation:[oe,E,D],saturated:[se,T,D]},de={lowSaturation:[ce,E,D],saturated:O.saturated},k={name:`inactive`,brightness:.9},A={...D,opacity:.675,saturation:.925},fe={lowSaturation:[{name:`active`,brightness:1.0375},k,A],saturated:[{name:`active`,brightness:1.125},k,A]},j=[`base`,`danger`,`warning`,`info`,`discovery`,`success`],pe={primary:O,secondary:de},me={foreground:O,background:fe},he={hairline:{lowSaturation:[ue,E,D],saturated:[le,T,D]}},M=7.25,N=.01;function ge(e){return e.toLowerCase().endsWith(`-hovered`)||e.toLowerCase().endsWith(`-active`)||e.toLowerCase().endsWith(`-inactive`)||e.toLowerCase().endsWith(`-disabled`)}function _e(e,t){let n=e;for(let e of t.split(`.`).filter(Boolean)){if(!i(n)||!(e in n))return;n=n[e]}return a(n)?n:void 0}function P(e,t,n=/* @__PURE__ */ new Set){let r=y(e);if(r)return r;if(typeof e!=`string`)return;let i=/^\{([^{}]+)\}$/.exec(e.trim());if(!i?.[1]||n.has(i[1]))return;n.add(i[1]);let a=_e(t,i[1]);if(a&&`$value`in a)return P(a.$value,t,n)}function F(e,t){let n=p(e).toLowerCase(),r=n.slice(0,7),i=s((n.length===9?Number.parseInt(n.slice(7,9),16)/255:1)*t);return i>=1?r:`${r}${f(i)}`}function ve(e,t,n){let r=p(e).toLowerCase(),i=p(y(t)??t).toLowerCase(),a=s((r.length===9?Number.parseInt(r.slice(7,9),16)/255:1)*n),o=e=>d((Number.parseInt(r.slice(e,e+2),16)*a+Number.parseInt(i.slice(e,e+2),16)*(1-a))/255);return`#${o(1)}${o(3)}${o(5)}`}function I(e,t,n=!1){if(Array.isArray(e))return e.map(e=>I(e,t,n));if(!i(e))return e;if(n&&a(e)&&x(e)===`shadow`){let n=e.$value,r=e=>{if(!i(e)||!(`color`in e))return e;let n=P(e.color,t);return n?{...e,color:F(n,R(n)?.1:.15)}:e};return{...e,$value:Array.isArray(n)?n.map((e,t)=>t===n.length-1?r(e):e):r(n)}}let r={};for(let[i,a]of Object.entries(e))r[i]=I(a,t,n||i.toLowerCase()===`ring`);return r}function L(e,t){let n={value:0,unit:`px`};return{color:e,offsetX:n,offsetY:n,blur:n,spread:{value:t,unit:`px`}}}function ye(e){if(!i(e)||!i(e.color))return e;let t=e.color,n=i(e.ring)?{...e.ring}:{},r=!1;for(let e of j){let o=t[e];if(!i(o)||!a(o.primary))continue;let s=`{color.${e}.primary}`,c=L(`{color.elevated}`,3),l={[e]:[`${e} 3px focus ring with no gap`,[L(s,3)]],[`${e}-subtle`]:[`${e} 1px hairline focus ring with no gap`,[L(s,1)]],[`${e}-offset`]:[`${e} 3px focus ring with a 3px gap`,[c,L(s,6)]],[`${e}-subtle-offset`]:[`${e} 1px focus ring with a 3px gap`,[c,L(s,4)]]};for(let[t,[i,a]]of Object.entries(l))t in n||(n[t]={$description:`Generated ${i}`,$type:`shadow`,$value:a,theme:e},r=!0)}return r?{...e,ring:n}:e}function R(e){return B(e).chroma<.02}function z(e){let t=p(e).toLowerCase();return t.slice(1,3)===t.slice(3,5)&&t.slice(3,5)===t.slice(5,7)}function B(e){let t=p(e).toLowerCase(),n=l(Number.parseInt(t.slice(1,3),16)/255),r=l(Number.parseInt(t.slice(3,5),16)/255),i=l(Number.parseInt(t.slice(5,7),16)/255),a=t.length===9?Number.parseInt(t.slice(7,9),16)/255:void 0,o=.4122214708*n+.5363325363*r+.0514459929*i,s=.2119034982*n+.6806995451*r+.1073969566*i,c=.0883024619*n+.2817188376*r+.6299787005*i,u=Math.cbrt(o),d=Math.cbrt(s),f=Math.cbrt(c),m=.2104542553*u+.793617785*d-.0040720468*f,h=1.9779984951*u-2.428592205*d+.4505937099*f,g=.0259040371*u+.7827717662*d-.808675766*f,_=Math.hypot(h,g),v=Math.atan2(g,h)*180/Math.PI;return v<0&&(v+=360),{lightness:m,chroma:_,hue:v,alpha:a}}function V({red:e,green:t,blue:n}){return e>=0&&e<=1&&t>=0&&t<=1&&n>=0&&n<=1}function H(e,t,n,r){if(V(h(e,t,n)))return g(e,t,n,r);let i=0,a=t;for(let t=0;t<32;t+=1){let t=(i+a)/2;V(h(e,t,n))?i=t:a=t}return g(e,i,n,r)}function be(e,t){let{lightness:n,chroma:r,hue:i,alpha:a}=B(e);return g(s(n*t),r,i,a)}function xe(e,t){let{lightness:n,chroma:r,hue:i,alpha:a}=B(e);return g(s(n+t),r,i,a)}function Se(e,t){let{lightness:n,chroma:r,hue:i,alpha:a}=B(e);return g(n,r*s(t),i,a)}function U(e){let t=p(e).toLowerCase(),n=e=>{let n=Number.parseInt(t.slice(e,e+2),16)/255;return n<=.04045?n/12.92:((n+.055)/1.055)**2.4};return .2126*n(1)+.7152*n(3)+.0722*n(5)}function W(e,t){let n=U(e),r=U(t),i=Math.max(n,r),a=Math.min(n,r);return(i+.05)/(a+.05)}function G(e){let t=W(e,`#FAFAFA`);return t>=2?`#FAFAFA`:W(e,`#151518`)*.5>t?`#151518`:`#FAFAFA`}function Ce(e,t){let{lightness:n,chroma:r,hue:i,alpha:a}=B(e),o=t===`light`?1:-1,c=-o,l=n,u=n,d=e,f=e;for(let t=0;t<100;t+=1){if(l=s(l+o*N),d=H(l,r,i,a),W(d,f)>=M)return f===e?{secondary:d}:{secondary:d,onMuted:f};if(u=s(u+c*N),f=H(u,r,i,a),W(d,f)>=M)return{secondary:d,onMuted:f};if((l===0||l===1)&&(u===0||u===1))break}throw Error(`Unable to generate an accessible secondary pair for ${e}`)}function we(e,t){return t===`dark`?K(e):t===`light`?!q(e):B(e).lightness>=.5}function Te(e,t){return!we(e,t)}function K(e){return B(e).lightness>=.75}function q(e){return B(e).lightness<=.25}function J(e){return e.name===`hovered`||e.name===`active`}function Y(e,t){return t===`dark`?K(e):t===`light`&&q(e)}function Ee(e,t,n){return Te(e,n)?t:2-t}function X(e,t){return e.useContrastPrimitive&&t?C[t]:void 0}function Z(e,t,n){if(t.name===`hovered`&&X(t,n)&&Y(e,n))return n===`dark`?-.25:.25}function De(e,t,n){let r=X(t,n);return r&&n&&t.name===`active`&&Y(e,n)?ie[n]:r}function Oe(e,t,n){return t.brightness===void 0?1:X(t,n)?J(t)?1:t.brightness:Ee(e,t.brightness,n)}function ke(e,t,n){let r=Z(e,t,n),i=r===void 0?De(e,t,n):void 0,a=i??e;return r===void 0?t.brightness!==void 0&&!(i&&J(t))&&(a=be(a,Oe(a,t,n))):a=xe(e,r),t.saturation!==void 0&&!z(e)&&(a=Se(a,t.saturation),t.fadeOver===void 0)?a:t.fadeOver===void 0?t.opacity===void 0?a:F(a,t.opacity):ve(a,t.fadeOver,t.opacity??1)}function Ae(e,t,n){let r=[],i=Z(t,e,n),a=De(t,e,n);if(i!==void 0)r.push(`${Math.round(Math.abs(i)*100)}% ${i<0?`darker`:`lighter`}`);else if(a&&J(e))r.push(n&&a!==C[n]?`pure ${n===`dark`?`white`:`black`}`:`${n} contrast primitive`);else if(e.brightness!==void 0){let i=Oe(t,e,n),a=Math.round((i-1)*100);r.push(a>=0?`${a}% brighter`:`${Math.abs(a)}% darker`)}return e.saturation!==void 0&&!z(t)&&r.push(`${Math.round(e.saturation*100)}% saturation`),e.fadeOver===void 0?e.opacity!==void 0&&(e.saturation===void 0||z(t))&&r.push(`${Math.round(e.opacity*100)}% opacity`):r.push(`${Math.round((e.opacity??1)*100)}% over ${e.fadeOver}`),r.join(`, `)||e.name}function je(e,t,n,r){let i=Ae(n,t,r),a=ke(t,n,r);return{...e,$type:`color`,$value:a,$description:typeof e.$description==`string`?`${e.$description} (${n.name}, ${i})`:`${n.name} state at ${i}`}}function Q(e,t,n,r,i){let o={...e},s=r?[r]:Object.keys(e);for(let r of s){if(r.startsWith(`$`)||ge(r))continue;let s=e[r];if(!a(s))continue;let c=x(s);if(c&&c!==`color`)continue;let l=P(s.$value,t);if(!l)continue;let u=(R(l)?n.lowSaturation:n.saturated).flatMap(e=>e.name===`active`?[{...e,name:`hovered`},e]:[e]),d=w(s.$description)??i;for(let e of u){let t=`${r}-${e.name}`;t in o||(o[t]=je(s,l,e,d))}}return o}function Me(e,t,n,r){let i=t.primary,o=a(i)&&P(i.$value,n),s=a(i)&&x(i);if(!a(i)||!o||s&&s!==`color`)return t;let c={...t};c[`on-primary`]??={...i,$type:`color`,$value:G(o),$description:`Generated text and icon color on ${e} primary backgrounds`};let l;if(r&&!(`secondary`in t)){let t=Ce(o,r);c.secondary={...i,$type:`color`,$value:t.secondary,$description:`Generated low-emphasis ${e} background for the ${r} theme`},l=t.onMuted??o}else if(a(t.secondary)){let e=P(t.secondary.$value,n);l=e&&G(e)}l&&!(`on-secondary`in t)&&(c[`on-secondary`]={...i,$type:`color`,$value:l,$description:`Generated text and icon color on ${e} secondary backgrounds`});for(let[e,t]of Object.entries(pe))c=Q(c,n,t,e,r);for(let[t,n]of Object.entries(c))a(n)&&(c[t]={theme:e,group:e,...n});return c}function Ne(e){let t={...e};for(let[n,r]of Object.entries(e)){let e=n.replace(/^on-/,``).replace(/-(?:hovered|active|inactive|disabled)$/i,``);e!==n&&a(r)&&!(`group`in r)&&(t[n]={...r,group:e})}return t}function $(e,t,n,o){if(Array.isArray(e))return e.map(e=>$(e,t,void 0,o));if(!i(e)||a(e))return e;let s={};for(let[n,i]of Object.entries(e))s[n]=r.has(n)||n.startsWith(`$`)?i:$(i,t,n,n===`dark`||n===`light`?n:o);let c=s;if(n===`color`){for(let e of j){let n=c[e];i(n)&&!a(n)&&(c[e]=Me(e,n,t,o))}for(let[e,n]of Object.entries(c)){let r=a(n)&&typeof n.group==`string`?me[n.group]:void 0;r&&(c=Q(c,t,r,e,o))}}for(let[e,n]of Object.entries(he))a(c[e])&&(c=Q(c,t,n,e,o));return n===`color`?Ne(c):c}function Pe(e){let t=S(e),n=ye($(t,t,void 0,ae(t)));return I(n,n)}var Fe=(0,e.definePlugin)(()=>({name:`cyclone-ui:tamagui-preprocessor`,preprocessors:[{name:`tamagui-preprocessor`,preprocessor:Pe}]}));exports.default=Fe,exports.tamaguiPreprocessor=Pe;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});let e=require("@razorwind/core/plugin");const t=/^#(?:[0-9a-f]{3,4}|[0-9a-f]{6}|[0-9a-f]{8})$/i,n=/^oklch\(\s*([0-9.]+%?|none)\s+([0-9.]+|none)\s+([0-9.]+|none)(?:\s*\/\s*([0-9.%]+))?\s*\)$/i,r=/* @__PURE__ */ new Set([`$schema`,`$type`,`$description`,`$extensions`,`$extends`,`$deprecated`,`$root`,`$value`,`$ref`,`theme`,`palette`,`primitive`]);function i(e){return typeof e==`object`&&!!e&&!Array.isArray(e)}function a(e){return i(e)&&(`$value`in e||`$ref`in e)}function o(e){let t=e.trim();return t.startsWith(`{`)||t.startsWith(`var(`)}function s(e){return Math.min(1,Math.max(0,e))}function c(e){let t=s(e);return t<=.0031308?12.92*t:1.055*t**(1/2.4)-.055}function l(e){let t=s(e);return t<=.04045?t/12.92:((t+.055)/1.055)**2.4}function u(e){return Math.round(c(e)*255).toString(16).padStart(2,`0`)}function d(e){return Math.round(s(e)*255).toString(16).padStart(2,`0`)}function f(e){return Math.round(s(e)*255).toString(16).padStart(2,`0`)}function p(e){let t=e.startsWith(`#`)?e.slice(1):e;return t.length===3||t.length===4?`#${[...t].map(e=>e+e).join(``)}`:`#${t}`}function m(e){if(typeof e==`string`){let n=e.trim();if(!t.test(n))return;let r=p(n).toLowerCase();return r.length===9&&r.endsWith(`ff`)?r.slice(0,7):r}if(i(e)){if(typeof e.hex==`string`&&t.test(e.hex)){let t=p(e.hex).toLowerCase().slice(0,7),n=v(e.alpha);return n!==void 0&&n<1?`${t}${f(n)}`:t}if(e.colorSpace===`srgb`&&Array.isArray(e.components)&&e.components.length>=3){let t=_(e.components[0]),n=_(e.components[1]),r=_(e.components[2]);if(t===void 0||n===void 0||r===void 0)return;let i=`#${d(t)}${d(n)}${d(r)}`,a=v(e.alpha);return a!==void 0&&a<1?`${i}${f(a)}`:i}}}function h(e,t,n){let r=n*Math.PI/180,i=t*Math.cos(r),a=t*Math.sin(r),o=e+.3963377774*i+.2158037573*a,s=e-.1055613458*i-.0638541728*a,c=e-.0894841775*i-1.291485548*a,l=o**3,u=s**3,d=c**3;return{red:4.0767416621*l-3.3077115913*u+.2309699292*d,green:-1.2684380046*l+2.6097574011*u-.3413193965*d,blue:-.0041960863*l-.7034186147*u+1.707614701*d}}function g(e,t,n,r){let{red:i,green:a,blue:o}=h(e,t,n),s=`#${u(i)}${u(a)}${u(o)}`;return r===void 0||r>=1?s:`${s}${f(r)}`}function _(e){if(typeof e==`number`&&Number.isFinite(e))return e;if(typeof e!=`string`||e===`none`)return;let t=Number.parseFloat(e);return Number.isFinite(t)?t:void 0}function v(e){if(typeof e==`number`&&Number.isFinite(e))return e>1?e/100:e;if(typeof e!=`string`)return;let t=Number.parseFloat(e);if(Number.isFinite(t))return e.includes(`%`)||t>1?t/100:t}function ee(e){let t=n.exec(e.trim());if(!t)return;let r=_(t[1]),i=_(t[2]),a=_(t[3]);if(r!==void 0&&i!==void 0&&a!==void 0)return t[1]?.includes(`%`)&&(r/=100),g(r,i,a,v(t[4]))}function te(e){if(!Array.isArray(e.components)||e.components.length<3)return;let t=_(e.components[0]),n=_(e.components[1]),r=_(e.components[2]);if(t!==void 0&&n!==void 0&&r!==void 0)return t>1&&(t/=100),g(t,n,r,v(e.alpha))}function y(e){if(typeof e==`string`)return o(e)?void 0:ee(e)??m(e)??void 0;if(i(e))return typeof e.colorSpace==`string`&&e.colorSpace.toLowerCase()===`oklch`?te(e):m(e)??void 0}function ne(e){if(Array.isArray(e))return e.map(e=>ne(e));if(!i(e)||!(`color`in e))return e;let t=y(e.color);return t?{...e,color:t}:e}function re(e,t){if(t===`shadow`)return ne(e);if(t===`border`&&i(e)&&`color`in e){let t=y(e.color);return t?{...e,color:t}:e}return t===`color`||t===void 0?y(e)??e:e}function b(e,t){return typeof e.$type==`string`?e.$type:typeof e.type==`string`?e.type:t}function ie(e,t){if(`$ref`in e&&!(`$value`in e))return{...e};let n=b(e,t);return`$value`in e?{...e,$value:re(e.$value,n)}:{...e}}function x(e,t){if(Array.isArray(e))return e.map(e=>x(e,t));if(!i(e))return e;if(a(e))return ie(e,t);let n=typeof e.$type==`string`?e.$type:t,o={};for(let[t,i]of Object.entries(e))o[t]=r.has(t)||t.startsWith(`$`)?i:x(i,n);return o}const S={dark:`#ffffff`,light:`#0c0c0d`},ae={dark:`#ffffff`,light:`#000000`};function C(e){if(typeof e!=`string`)return;let t=/\b(dark|light)[\s-]+theme\b/i.exec(e)?.[1];return t?.toLowerCase()===`dark`?`dark`:t?.toLowerCase()===`light`?`light`:void 0}function oe(e){if(i(e)&&i(e.color))return C(e.color.$description)}const se={name:`active`,brightness:1.45,useContrastPrimitive:!0},ce={name:`active`,brightness:1.25},le={name:`active`,brightness:1.125},ue={name:`active`,brightness:1.4},de={name:`active`,brightness:1.8,useContrastPrimitive:!0},fe={name:`inactive`,brightness:.8},w={name:`inactive`,brightness:.5,useContrastPrimitive:!0},T={name:`disabled`,opacity:.35,saturation:.85,fadeOver:`oklch(0.3839 0.0045 286.26)`},E={lowSaturation:[se,w,T],saturated:[ce,fe,T]},pe={lowSaturation:[le,w,T],saturated:E.saturated},D={name:`inactive`,brightness:.9},O={...T,opacity:.675,saturation:.925},k={lowSaturation:[{name:`active`,brightness:1.15},D,O],saturated:[{name:`active`,brightness:1.25},D,O]},A=[`base`,`danger`,`warning`,`info`,`discovery`,`success`],me={primary:E,secondary:pe,link:E},he={foreground:{lowSaturation:[{name:`hovered`,brightness:1.45},...E.lowSaturation],saturated:[{name:`hovered`,brightness:1.15},...E.saturated]},background:{lowSaturation:[{name:`hovered`,brightness:1.1},...k.lowSaturation],saturated:[{name:`hovered`,brightness:1.15},...k.saturated]}},ge={outline:{lowSaturation:[de,w,T],saturated:[ue,fe,T]}},j=7.5,M=.01;function _e(e){return e.toLowerCase().endsWith(`-hovered`)||e.toLowerCase().endsWith(`-active`)||e.toLowerCase().endsWith(`-inactive`)||e.toLowerCase().endsWith(`-disabled`)}function ve(e,t){let n=e;for(let e of t.split(`.`).filter(Boolean)){if(!i(n)||!(e in n))return;n=n[e]}return a(n)?n:void 0}function N(e,t,n=/* @__PURE__ */ new Set){let r=y(e);if(r)return r;if(typeof e!=`string`)return;let i=/^\{([^{}]+)\}$/.exec(e.trim());if(!i?.[1]||n.has(i[1]))return;n.add(i[1]);let a=ve(t,i[1]);if(a&&`$value`in a)return N(a.$value,t,n)}function P(e,t){let n=p(e).toLowerCase(),r=n.slice(0,7),i=s((n.length===9?Number.parseInt(n.slice(7,9),16)/255:1)*t);return i>=1?r:`${r}${f(i)}`}function ye(e,t,n){let r=p(e).toLowerCase(),i=p(y(t)??t).toLowerCase(),a=s((r.length===9?Number.parseInt(r.slice(7,9),16)/255:1)*n),o=e=>d((Number.parseInt(r.slice(e,e+2),16)*a+Number.parseInt(i.slice(e,e+2),16)*(1-a))/255);return`#${o(1)}${o(3)}${o(5)}`}function F(e,t,n=!1){if(Array.isArray(e))return e.map(e=>F(e,t,n));if(!i(e))return e;if(n&&a(e)&&b(e)===`shadow`){let n=e.$value,r=e=>{if(!i(e)||!(`color`in e))return e;let n=N(e.color,t);return n?{...e,color:P(n,R(n)?.1:.15)}:e};return{...e,$value:Array.isArray(n)?n.map((e,t)=>t===n.length-1?r(e):e):r(n)}}let r={};for(let[i,a]of Object.entries(e))r[i]=F(a,t,n||i.toLowerCase()===`ring`);return r}const I={value:0,unit:`px`};function L(e,t){return{color:e,offsetX:I,offsetY:I,blur:I,spread:{value:t,unit:`px`}}}function be(e){if(!i(e)||!i(e.color))return e;let t=e.color,n=i(e.ring)?{...e.ring}:{},r=!1;for(let e of A){let o=t[e];if(!i(o)||!a(o.primary))continue;let s=`{color.${e}.primary}`,c=e=>L(`{color.elevated}`,e),l={[e]:[`${e} 3px focus ring with no gap`,[L(s,3)]],[`${e}-subtle`]:[`${e} 1px outline focus ring with no gap`,[L(s,1)]],[`${e}-offset`]:[`${e} 3px focus ring with a 3px gap`,[c(3),L(s,6)]],[`${e}-subtle-offset`]:[`${e} 1px focus ring with a 2px gap`,[c(2),L(s,3)]]};for(let[t,[i,a]]of Object.entries(l))t in n||(n[t]={$description:`Generated ${i}`,$type:`shadow`,$value:a,theme:e},r=!0)}return r?{...e,ring:n}:e}function R(e){return B(e).chroma<.02}function z(e){let t=p(e).toLowerCase();return t.slice(1,3)===t.slice(3,5)&&t.slice(3,5)===t.slice(5,7)}function B(e){let t=p(e).toLowerCase(),n=l(Number.parseInt(t.slice(1,3),16)/255),r=l(Number.parseInt(t.slice(3,5),16)/255),i=l(Number.parseInt(t.slice(5,7),16)/255),a=t.length===9?Number.parseInt(t.slice(7,9),16)/255:void 0,o=.4122214708*n+.5363325363*r+.0514459929*i,s=.2119034982*n+.6806995451*r+.1073969566*i,c=.0883024619*n+.2817188376*r+.6299787005*i,u=Math.cbrt(o),d=Math.cbrt(s),f=Math.cbrt(c),m=.2104542553*u+.793617785*d-.0040720468*f,h=1.9779984951*u-2.428592205*d+.4505937099*f,g=.0259040371*u+.7827717662*d-.808675766*f,_=Math.hypot(h,g),v=Math.atan2(g,h)*180/Math.PI;return v<0&&(v+=360),{lightness:m,chroma:_,hue:v,alpha:a}}function V({red:e,green:t,blue:n}){return e>=0&&e<=1&&t>=0&&t<=1&&n>=0&&n<=1}function H(e,t,n,r){if(V(h(e,t,n)))return g(e,t,n,r);let i=0,a=t;for(let t=0;t<32;t+=1){let t=(i+a)/2;V(h(e,t,n))?i=t:a=t}return g(e,i,n,r)}function xe(e,t){let{lightness:n,chroma:r,hue:i,alpha:a}=B(e);return g(s(n*t),r,i,a)}function Se(e,t){let{lightness:n,chroma:r,hue:i,alpha:a}=B(e);return g(s(n+t),r,i,a)}function Ce(e,t){let{lightness:n,chroma:r,hue:i,alpha:a}=B(e);return g(n,r*s(t),i,a)}function U(e){let t=p(e).toLowerCase(),n=e=>{let n=Number.parseInt(t.slice(e,e+2),16)/255;return n<=.04045?n/12.92:((n+.055)/1.055)**2.4};return .2126*n(1)+.7152*n(3)+.0722*n(5)}function W(e,t){let n=U(e),r=U(t),i=Math.max(n,r),a=Math.min(n,r);return(i+.05)/(a+.05)}function G(e){let t=W(e,`#FAFAFA`);return t>=2?`#FAFAFA`:W(e,`#151518`)*.5>t?`#151518`:`#FAFAFA`}function we(e,t){let{lightness:n,chroma:r,hue:i,alpha:a}=B(e),o=t===`light`?1:-1,c=-o,l=n,u=n,d=e,f=e;for(let t=0;t<100;t+=1){if(l=s(l+o*M),d=H(l,r,i,a),W(d,f)>=j)return f===e?{secondary:d}:{secondary:d,onMuted:f};if(u=s(u+c*M),f=H(u,r,i,a),W(d,f)>=j)return{secondary:d,onMuted:f};if((l===0||l===1)&&(u===0||u===1))break}throw Error(`Unable to generate an accessible secondary pair for ${e}`)}function Te(e,t){return t===`dark`?K(e):t===`light`?!q(e):B(e).lightness>=.5}function Ee(e,t){return!Te(e,t)}const De=B(`#dddddd`).lightness,Oe=B(`#262626`).lightness;function K(e){return B(e).lightness>=(R(e)?De:.75)}function q(e){return B(e).lightness<=(R(e)?Oe:.25)}function J(e){return e.name===`hovered`||e.name===`active`}function ke(e,t){return t===`dark`?K(e):t===`light`&&q(e)}function Ae(e,t,n){return Ee(e,n)?t:2-t}function Y(e,t){return e.useContrastPrimitive&&t?S[t]:void 0}function X(e,t,n){if(t.name===`hovered`&&Y(t,n)&&ke(e,n))return n===`dark`?-.25:.25}function je(e,t,n){let r=Y(t,n);return r&&n&&t.name===`active`&&ke(e,n)?ae[n]:r}function Me(e,t,n){return t.brightness===void 0?1:Y(t,n)?J(t)?1:t.brightness:Ae(e,t.brightness,n)}function Ne(e,t,n){let r=X(e,t,n),i=r===void 0?je(e,t,n):void 0,a=i??e;return r===void 0?t.brightness!==void 0&&!(i&&J(t))&&(a=xe(a,Me(a,t,n))):a=Se(e,r),t.saturation!==void 0&&!z(e)&&(a=Ce(a,t.saturation),t.fadeOver===void 0)?a:t.fadeOver===void 0?t.opacity===void 0?a:P(a,t.opacity):ye(a,t.fadeOver,t.opacity??1)}function Pe(e,t,n){let r=[],i=X(t,e,n),a=je(t,e,n);if(i!==void 0)r.push(`${Math.round(Math.abs(i)*100)}% ${i<0?`darker`:`lighter`}`);else if(a&&J(e))r.push(n&&a!==S[n]?`pure ${n===`dark`?`white`:`black`}`:`${n} contrast primitive`);else if(e.brightness!==void 0){let i=Me(t,e,n),a=Math.round((i-1)*100);r.push(a>=0?`${a}% brighter`:`${Math.abs(a)}% darker`)}return e.saturation!==void 0&&!z(t)&&r.push(`${Math.round(e.saturation*100)}% saturation`),e.fadeOver===void 0?e.opacity!==void 0&&(e.saturation===void 0||z(t))&&r.push(`${Math.round(e.opacity*100)}% opacity`):r.push(`${Math.round((e.opacity??1)*100)}% over ${e.fadeOver}`),r.join(`, `)||e.name}function Fe(e,t,n,r){let i=Pe(n,t,r),a=Ne(t,n,r);return{...e,$type:`color`,$value:a,$description:typeof e.$description==`string`?`${e.$description} (${n.name}, ${i})`:`${n.name} state at ${i}`}}function Z(e,t,n,r,i){let o={...e},s=r?[r]:Object.keys(e);for(let r of s){if(r.startsWith(`$`)||_e(r))continue;let s=e[r];if(!a(s))continue;let c=b(s);if(c&&c!==`color`)continue;let l=N(s.$value,t);if(!l)continue;let u=R(l)?n.lowSaturation:n.saturated,d=u.some(e=>e.name===`hovered`),f=u.flatMap(e=>e.name===`active`&&!d?[{...e,name:`hovered`},e]:[e]),p=C(s.$description)??i;for(let e of f){let t=`${r}-${e.name}`;t in o||(o[t]=Fe(s,l,e,p))}}return o}function Ie(e,t,n,r){let i=t.primary,o=a(i)&&N(i.$value,n),s=a(i)&&b(i);if(!a(i)||!o||s&&s!==`color`)return t;let c={...t};c.link??={...i,$type:`color`,$value:`{color.${e}.primary}`,$description:`Generated ${e} hyperlink text color (matches primary)`},c[`on-primary`]??={...i,$type:`color`,$value:G(o),$description:`Generated text and icon color on ${e} primary backgrounds`};let l;if(r&&!(`secondary`in t)){let t=we(o,r);c.secondary={...i,$type:`color`,$value:t.secondary,$description:`Generated low-emphasis ${e} background for the ${r} theme`},l=t.onMuted??o}else if(a(t.secondary)){let e=N(t.secondary.$value,n);l=e&&G(e)}l&&!(`on-secondary`in t)&&(c[`on-secondary`]={...i,$type:`color`,$value:l,$description:`Generated text and icon color on ${e} secondary backgrounds`});for(let[e,t]of Object.entries(me))c=Z(c,n,t,e,r);for(let[t,n]of Object.entries(c))a(n)&&(c[t]={theme:e,group:e,...n});return c}function Le(e){let t={...e};for(let[n,r]of Object.entries(e)){let e=n.replace(/^on-/,``).replace(/-(?:hovered|active|inactive|disabled)$/i,``);e!==n&&a(r)&&!(`group`in r)&&(t[n]={...r,group:e})}return t}function Q(e,t,n,o){if(Array.isArray(e))return e.map(e=>Q(e,t,void 0,o));if(!i(e)||a(e))return e;let s={};for(let[n,i]of Object.entries(e))s[n]=r.has(n)||n.startsWith(`$`)?i:Q(i,t,n,n===`dark`||n===`light`?n:o);let c=s;if(n===`color`){for(let e of A){let n=c[e];i(n)&&!a(n)&&(c[e]=Ie(e,n,t,o))}for(let[e,n]of Object.entries(c)){let r=a(n)&&typeof n.group==`string`?he[n.group]:void 0;r&&(c=Z(c,t,r,e,o))}}for(let[e,n]of Object.entries(ge))a(c[e])&&(c=Z(c,t,n,e,o));return n===`color`?Le(c):c}function $(e){let t=x(e),n=be(Q(t,t,void 0,oe(t)));return F(n,n)}var Re=(0,e.definePlugin)(()=>({name:`cyclone-ui:tamagui-preprocessor`,preprocessors:[{name:`tamagui-preprocessor`,preprocessor:$}]}));exports.default=Re,exports.tamaguiPreprocessor=$;

package/dist/preprocessor.d.cts

@@ -3,20 +3,22 @@ import { PreprocessedTokens } from "style-dictionary/types";
 /**
  * Style Dictionary preprocessor: rewrite color `$value`s (and nested shadow
  * colors) to hex so generators emit `#rrggbb` / `#rrggbbaa` instead of
- * `oklch()`. Root colors (emphasis, ink, subtle, subtlest, hairline, backgrounds)
+ * `oklch()`. Root colors (emphasis, ink, subtle, subtlest, outline, backgrounds)
  * stay in the root light and dark themes without rings. For the `base` group and each
  * status group, a missing `secondary` background and `on-primary` /
  * `on-secondary` text colors are generated, then hovered, active, inactive,
- * and disabled variants are added to the hairline, `foreground` and
- * `background` group colors, and each theme color group's `primary` and `secondary`.
+ * and disabled variants are added to the outline, `foreground` and
+ * `background` group colors, and each theme color group's `primary`, `secondary`
+ * and `link` (which defaults to `primary` when missing).
  * Low-saturation colors derive their states from the parent theme's contrast
  * primitive (backgrounds use a half-strength shift of their own lightness; hovered
  * colors already near that primitive shift toward the middle, while active
  * ones become pure white or black); saturated
- * colors scale their own lightness. Tokens in a theme color group get the
+ * colors scale their own lightness. Foreground and background hovered states
+ * take a smaller step than their active states. Tokens in a theme color group get the
  * group name as `theme` and `group`, unless already set; root state and `on-*`
- * tokens get their main token name as `group` (e.g. `hairline-active` →
- * `hairline`).
+ * tokens get their main token name as `group` (e.g. `outline-active` →
+ * `outline`).
  * Finally, focus rings are generated for `base` and each status color.
  */
 declare function tamaguiPreprocessor(dictionary: PreprocessedTokens): PreprocessedTokens;

package/dist/preprocessor.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"preprocessor.d.cts","names":[],"sources":["../src/preprocessor.ts"],"mappings":";;;;;;;;;;;;;;;;;;;;;iBA28CgB,oBACd,YAAY,qBACX"}
+{"version":3,"file":"preprocessor.d.cts","names":[],"sources":["../src/preprocessor.ts"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;iBA0/CgB,oBACd,YAAY,qBACX"}

package/dist/preprocessor.d.mts

@@ -3,20 +3,22 @@ import { PreprocessedTokens } from "style-dictionary/types";
 /**
  * Style Dictionary preprocessor: rewrite color `$value`s (and nested shadow
  * colors) to hex so generators emit `#rrggbb` / `#rrggbbaa` instead of
- * `oklch()`. Root colors (emphasis, ink, subtle, subtlest, hairline, backgrounds)
+ * `oklch()`. Root colors (emphasis, ink, subtle, subtlest, outline, backgrounds)
  * stay in the root light and dark themes without rings. For the `base` group and each
  * status group, a missing `secondary` background and `on-primary` /
  * `on-secondary` text colors are generated, then hovered, active, inactive,
- * and disabled variants are added to the hairline, `foreground` and
- * `background` group colors, and each theme color group's `primary` and `secondary`.
+ * and disabled variants are added to the outline, `foreground` and
+ * `background` group colors, and each theme color group's `primary`, `secondary`
+ * and `link` (which defaults to `primary` when missing).
  * Low-saturation colors derive their states from the parent theme's contrast
  * primitive (backgrounds use a half-strength shift of their own lightness; hovered
  * colors already near that primitive shift toward the middle, while active
  * ones become pure white or black); saturated
- * colors scale their own lightness. Tokens in a theme color group get the
+ * colors scale their own lightness. Foreground and background hovered states
+ * take a smaller step than their active states. Tokens in a theme color group get the
  * group name as `theme` and `group`, unless already set; root state and `on-*`
- * tokens get their main token name as `group` (e.g. `hairline-active` →
- * `hairline`).
+ * tokens get their main token name as `group` (e.g. `outline-active` →
+ * `outline`).
  * Finally, focus rings are generated for `base` and each status color.
  */
 declare function tamaguiPreprocessor(dictionary: PreprocessedTokens): PreprocessedTokens;

package/dist/preprocessor.mjs

@@ -1,2 +1,2 @@
-import{definePlugin as e}from"@razorwind/core/plugin";const t=/^#(?:[0-9a-f]{3,4}|[0-9a-f]{6}|[0-9a-f]{8})$/i,n=/^oklch\(\s*([0-9.]+%?|none)\s+([0-9.]+|none)\s+([0-9.]+|none)(?:\s*\/\s*([0-9.%]+))?\s*\)$/i,r=/* @__PURE__ */ new Set([`$schema`,`$type`,`$description`,`$extensions`,`$extends`,`$deprecated`,`$root`,`$value`,`$ref`,`theme`,`palette`,`primitive`]);function i(e){return typeof e==`object`&&!!e&&!Array.isArray(e)}function a(e){return i(e)&&(`$value`in e||`$ref`in e)}function o(e){let t=e.trim();return t.startsWith(`{`)||t.startsWith(`var(`)}function s(e){return Math.min(1,Math.max(0,e))}function c(e){let t=s(e);return t<=.0031308?12.92*t:1.055*t**(1/2.4)-.055}function l(e){let t=s(e);return t<=.04045?t/12.92:((t+.055)/1.055)**2.4}function u(e){return Math.round(c(e)*255).toString(16).padStart(2,`0`)}function d(e){return Math.round(s(e)*255).toString(16).padStart(2,`0`)}function f(e){return Math.round(s(e)*255).toString(16).padStart(2,`0`)}function p(e){let t=e.startsWith(`#`)?e.slice(1):e;return t.length===3||t.length===4?`#${[...t].map(e=>e+e).join(``)}`:`#${t}`}function m(e){if(typeof e==`string`){let n=e.trim();if(!t.test(n))return;let r=p(n).toLowerCase();return r.length===9&&r.endsWith(`ff`)?r.slice(0,7):r}if(i(e)){if(typeof e.hex==`string`&&t.test(e.hex)){let t=p(e.hex).toLowerCase().slice(0,7),n=v(e.alpha);return n!==void 0&&n<1?`${t}${f(n)}`:t}if(e.colorSpace===`srgb`&&Array.isArray(e.components)&&e.components.length>=3){let t=_(e.components[0]),n=_(e.components[1]),r=_(e.components[2]);if(t===void 0||n===void 0||r===void 0)return;let i=`#${d(t)}${d(n)}${d(r)}`,a=v(e.alpha);return a!==void 0&&a<1?`${i}${f(a)}`:i}}}function h(e,t,n){let r=n*Math.PI/180,i=t*Math.cos(r),a=t*Math.sin(r),o=e+.3963377774*i+.2158037573*a,s=e-.1055613458*i-.0638541728*a,c=e-.0894841775*i-1.291485548*a,l=o**3,u=s**3,d=c**3;return{red:4.0767416621*l-3.3077115913*u+.2309699292*d,green:-1.2684380046*l+2.6097574011*u-.3413193965*d,blue:-.0041960863*l-.7034186147*u+1.707614701*d}}function g(e,t,n,r){let{red:i,green:a,blue:o}=h(e,t,n),s=`#${u(i)}${u(a)}${u(o)}`;return r===void 0||r>=1?s:`${s}${f(r)}`}function _(e){if(typeof e==`number`&&Number.isFinite(e))return e;if(typeof e!=`string`||e===`none`)return;let t=Number.parseFloat(e);return Number.isFinite(t)?t:void 0}function v(e){if(typeof e==`number`&&Number.isFinite(e))return e>1?e/100:e;if(typeof e!=`string`)return;let t=Number.parseFloat(e);if(Number.isFinite(t))return e.includes(`%`)||t>1?t/100:t}function ee(e){let t=n.exec(e.trim());if(!t)return;let r=_(t[1]),i=_(t[2]),a=_(t[3]);if(r!==void 0&&i!==void 0&&a!==void 0)return t[1]?.includes(`%`)&&(r/=100),g(r,i,a,v(t[4]))}function te(e){if(!Array.isArray(e.components)||e.components.length<3)return;let t=_(e.components[0]),n=_(e.components[1]),r=_(e.components[2]);if(t!==void 0&&n!==void 0&&r!==void 0)return t>1&&(t/=100),g(t,n,r,v(e.alpha))}function y(e){if(typeof e==`string`)return o(e)?void 0:ee(e)??m(e)??void 0;if(i(e))return typeof e.colorSpace==`string`&&e.colorSpace.toLowerCase()===`oklch`?te(e):m(e)??void 0}function b(e){if(Array.isArray(e))return e.map(e=>b(e));if(!i(e)||!(`color`in e))return e;let t=y(e.color);return t?{...e,color:t}:e}function ne(e,t){if(t===`shadow`)return b(e);if(t===`border`&&i(e)&&`color`in e){let t=y(e.color);return t?{...e,color:t}:e}return t===`color`||t===void 0?y(e)??e:e}function x(e,t){return typeof e.$type==`string`?e.$type:typeof e.type==`string`?e.type:t}function re(e,t){if(`$ref`in e&&!(`$value`in e))return{...e};let n=x(e,t);return`$value`in e?{...e,$value:ne(e.$value,n)}:{...e}}function S(e,t){if(Array.isArray(e))return e.map(e=>S(e,t));if(!i(e))return e;if(a(e))return re(e,t);let n=typeof e.$type==`string`?e.$type:t,o={};for(let[t,i]of Object.entries(e))o[t]=r.has(t)||t.startsWith(`$`)?i:S(i,n);return o}const C={dark:`#ffffff`,light:`#0c0c0d`},ie={dark:`#ffffff`,light:`#000000`};function w(e){if(typeof e!=`string`)return;let t=/\b(dark|light)[\s-]+theme\b/i.exec(e)?.[1];return t?.toLowerCase()===`dark`?`dark`:t?.toLowerCase()===`light`?`light`:void 0}function ae(e){if(i(e)&&i(e.color))return w(e.color.$description)}const oe={name:`active`,brightness:1.45,useContrastPrimitive:!0},se={name:`active`,brightness:1.25},ce={name:`active`,brightness:1.125},le={name:`active`,brightness:1.4},ue={name:`active`,brightness:1.8,useContrastPrimitive:!0},T={name:`inactive`,brightness:.8},E={name:`inactive`,brightness:.6,useContrastPrimitive:!0},D={name:`disabled`,opacity:.35,saturation:.85,fadeOver:`oklch(0.3839 0.0045 286.26)`},O={lowSaturation:[oe,E,D],saturated:[se,T,D]},de={lowSaturation:[ce,E,D],saturated:O.saturated},k={name:`inactive`,brightness:.9},A={...D,opacity:.675,saturation:.925},fe={lowSaturation:[{name:`active`,brightness:1.0375},k,A],saturated:[{name:`active`,brightness:1.125},k,A]},j=[`base`,`danger`,`warning`,`info`,`discovery`,`success`],pe={primary:O,secondary:de},me={foreground:O,background:fe},he={hairline:{lowSaturation:[ue,E,D],saturated:[le,T,D]}},M=7.25,N=.01;function ge(e){return e.toLowerCase().endsWith(`-hovered`)||e.toLowerCase().endsWith(`-active`)||e.toLowerCase().endsWith(`-inactive`)||e.toLowerCase().endsWith(`-disabled`)}function _e(e,t){let n=e;for(let e of t.split(`.`).filter(Boolean)){if(!i(n)||!(e in n))return;n=n[e]}return a(n)?n:void 0}function P(e,t,n=/* @__PURE__ */ new Set){let r=y(e);if(r)return r;if(typeof e!=`string`)return;let i=/^\{([^{}]+)\}$/.exec(e.trim());if(!i?.[1]||n.has(i[1]))return;n.add(i[1]);let a=_e(t,i[1]);if(a&&`$value`in a)return P(a.$value,t,n)}function F(e,t){let n=p(e).toLowerCase(),r=n.slice(0,7),i=s((n.length===9?Number.parseInt(n.slice(7,9),16)/255:1)*t);return i>=1?r:`${r}${f(i)}`}function ve(e,t,n){let r=p(e).toLowerCase(),i=p(y(t)??t).toLowerCase(),a=s((r.length===9?Number.parseInt(r.slice(7,9),16)/255:1)*n),o=e=>d((Number.parseInt(r.slice(e,e+2),16)*a+Number.parseInt(i.slice(e,e+2),16)*(1-a))/255);return`#${o(1)}${o(3)}${o(5)}`}function I(e,t,n=!1){if(Array.isArray(e))return e.map(e=>I(e,t,n));if(!i(e))return e;if(n&&a(e)&&x(e)===`shadow`){let n=e.$value,r=e=>{if(!i(e)||!(`color`in e))return e;let n=P(e.color,t);return n?{...e,color:F(n,R(n)?.1:.15)}:e};return{...e,$value:Array.isArray(n)?n.map((e,t)=>t===n.length-1?r(e):e):r(n)}}let r={};for(let[i,a]of Object.entries(e))r[i]=I(a,t,n||i.toLowerCase()===`ring`);return r}function L(e,t){let n={value:0,unit:`px`};return{color:e,offsetX:n,offsetY:n,blur:n,spread:{value:t,unit:`px`}}}function ye(e){if(!i(e)||!i(e.color))return e;let t=e.color,n=i(e.ring)?{...e.ring}:{},r=!1;for(let e of j){let o=t[e];if(!i(o)||!a(o.primary))continue;let s=`{color.${e}.primary}`,c=L(`{color.elevated}`,3),l={[e]:[`${e} 3px focus ring with no gap`,[L(s,3)]],[`${e}-subtle`]:[`${e} 1px hairline focus ring with no gap`,[L(s,1)]],[`${e}-offset`]:[`${e} 3px focus ring with a 3px gap`,[c,L(s,6)]],[`${e}-subtle-offset`]:[`${e} 1px focus ring with a 3px gap`,[c,L(s,4)]]};for(let[t,[i,a]]of Object.entries(l))t in n||(n[t]={$description:`Generated ${i}`,$type:`shadow`,$value:a,theme:e},r=!0)}return r?{...e,ring:n}:e}function R(e){return B(e).chroma<.02}function z(e){let t=p(e).toLowerCase();return t.slice(1,3)===t.slice(3,5)&&t.slice(3,5)===t.slice(5,7)}function B(e){let t=p(e).toLowerCase(),n=l(Number.parseInt(t.slice(1,3),16)/255),r=l(Number.parseInt(t.slice(3,5),16)/255),i=l(Number.parseInt(t.slice(5,7),16)/255),a=t.length===9?Number.parseInt(t.slice(7,9),16)/255:void 0,o=.4122214708*n+.5363325363*r+.0514459929*i,s=.2119034982*n+.6806995451*r+.1073969566*i,c=.0883024619*n+.2817188376*r+.6299787005*i,u=Math.cbrt(o),d=Math.cbrt(s),f=Math.cbrt(c),m=.2104542553*u+.793617785*d-.0040720468*f,h=1.9779984951*u-2.428592205*d+.4505937099*f,g=.0259040371*u+.7827717662*d-.808675766*f,_=Math.hypot(h,g),v=Math.atan2(g,h)*180/Math.PI;return v<0&&(v+=360),{lightness:m,chroma:_,hue:v,alpha:a}}function V({red:e,green:t,blue:n}){return e>=0&&e<=1&&t>=0&&t<=1&&n>=0&&n<=1}function H(e,t,n,r){if(V(h(e,t,n)))return g(e,t,n,r);let i=0,a=t;for(let t=0;t<32;t+=1){let t=(i+a)/2;V(h(e,t,n))?i=t:a=t}return g(e,i,n,r)}function be(e,t){let{lightness:n,chroma:r,hue:i,alpha:a}=B(e);return g(s(n*t),r,i,a)}function xe(e,t){let{lightness:n,chroma:r,hue:i,alpha:a}=B(e);return g(s(n+t),r,i,a)}function Se(e,t){let{lightness:n,chroma:r,hue:i,alpha:a}=B(e);return g(n,r*s(t),i,a)}function U(e){let t=p(e).toLowerCase(),n=e=>{let n=Number.parseInt(t.slice(e,e+2),16)/255;return n<=.04045?n/12.92:((n+.055)/1.055)**2.4};return .2126*n(1)+.7152*n(3)+.0722*n(5)}function W(e,t){let n=U(e),r=U(t),i=Math.max(n,r),a=Math.min(n,r);return(i+.05)/(a+.05)}function G(e){let t=W(e,`#FAFAFA`);return t>=2?`#FAFAFA`:W(e,`#151518`)*.5>t?`#151518`:`#FAFAFA`}function Ce(e,t){let{lightness:n,chroma:r,hue:i,alpha:a}=B(e),o=t===`light`?1:-1,c=-o,l=n,u=n,d=e,f=e;for(let t=0;t<100;t+=1){if(l=s(l+o*N),d=H(l,r,i,a),W(d,f)>=M)return f===e?{secondary:d}:{secondary:d,onMuted:f};if(u=s(u+c*N),f=H(u,r,i,a),W(d,f)>=M)return{secondary:d,onMuted:f};if((l===0||l===1)&&(u===0||u===1))break}throw Error(`Unable to generate an accessible secondary pair for ${e}`)}function we(e,t){return t===`dark`?K(e):t===`light`?!q(e):B(e).lightness>=.5}function Te(e,t){return!we(e,t)}function K(e){return B(e).lightness>=.75}function q(e){return B(e).lightness<=.25}function J(e){return e.name===`hovered`||e.name===`active`}function Y(e,t){return t===`dark`?K(e):t===`light`&&q(e)}function Ee(e,t,n){return Te(e,n)?t:2-t}function X(e,t){return e.useContrastPrimitive&&t?C[t]:void 0}function Z(e,t,n){if(t.name===`hovered`&&X(t,n)&&Y(e,n))return n===`dark`?-.25:.25}function De(e,t,n){let r=X(t,n);return r&&n&&t.name===`active`&&Y(e,n)?ie[n]:r}function Oe(e,t,n){return t.brightness===void 0?1:X(t,n)?J(t)?1:t.brightness:Ee(e,t.brightness,n)}function ke(e,t,n){let r=Z(e,t,n),i=r===void 0?De(e,t,n):void 0,a=i??e;return r===void 0?t.brightness!==void 0&&!(i&&J(t))&&(a=be(a,Oe(a,t,n))):a=xe(e,r),t.saturation!==void 0&&!z(e)&&(a=Se(a,t.saturation),t.fadeOver===void 0)?a:t.fadeOver===void 0?t.opacity===void 0?a:F(a,t.opacity):ve(a,t.fadeOver,t.opacity??1)}function Ae(e,t,n){let r=[],i=Z(t,e,n),a=De(t,e,n);if(i!==void 0)r.push(`${Math.round(Math.abs(i)*100)}% ${i<0?`darker`:`lighter`}`);else if(a&&J(e))r.push(n&&a!==C[n]?`pure ${n===`dark`?`white`:`black`}`:`${n} contrast primitive`);else if(e.brightness!==void 0){let i=Oe(t,e,n),a=Math.round((i-1)*100);r.push(a>=0?`${a}% brighter`:`${Math.abs(a)}% darker`)}return e.saturation!==void 0&&!z(t)&&r.push(`${Math.round(e.saturation*100)}% saturation`),e.fadeOver===void 0?e.opacity!==void 0&&(e.saturation===void 0||z(t))&&r.push(`${Math.round(e.opacity*100)}% opacity`):r.push(`${Math.round((e.opacity??1)*100)}% over ${e.fadeOver}`),r.join(`, `)||e.name}function je(e,t,n,r){let i=Ae(n,t,r),a=ke(t,n,r);return{...e,$type:`color`,$value:a,$description:typeof e.$description==`string`?`${e.$description} (${n.name}, ${i})`:`${n.name} state at ${i}`}}function Q(e,t,n,r,i){let o={...e},s=r?[r]:Object.keys(e);for(let r of s){if(r.startsWith(`$`)||ge(r))continue;let s=e[r];if(!a(s))continue;let c=x(s);if(c&&c!==`color`)continue;let l=P(s.$value,t);if(!l)continue;let u=(R(l)?n.lowSaturation:n.saturated).flatMap(e=>e.name===`active`?[{...e,name:`hovered`},e]:[e]),d=w(s.$description)??i;for(let e of u){let t=`${r}-${e.name}`;t in o||(o[t]=je(s,l,e,d))}}return o}function Me(e,t,n,r){let i=t.primary,o=a(i)&&P(i.$value,n),s=a(i)&&x(i);if(!a(i)||!o||s&&s!==`color`)return t;let c={...t};c[`on-primary`]??={...i,$type:`color`,$value:G(o),$description:`Generated text and icon color on ${e} primary backgrounds`};let l;if(r&&!(`secondary`in t)){let t=Ce(o,r);c.secondary={...i,$type:`color`,$value:t.secondary,$description:`Generated low-emphasis ${e} background for the ${r} theme`},l=t.onMuted??o}else if(a(t.secondary)){let e=P(t.secondary.$value,n);l=e&&G(e)}l&&!(`on-secondary`in t)&&(c[`on-secondary`]={...i,$type:`color`,$value:l,$description:`Generated text and icon color on ${e} secondary backgrounds`});for(let[e,t]of Object.entries(pe))c=Q(c,n,t,e,r);for(let[t,n]of Object.entries(c))a(n)&&(c[t]={theme:e,group:e,...n});return c}function Ne(e){let t={...e};for(let[n,r]of Object.entries(e)){let e=n.replace(/^on-/,``).replace(/-(?:hovered|active|inactive|disabled)$/i,``);e!==n&&a(r)&&!(`group`in r)&&(t[n]={...r,group:e})}return t}function $(e,t,n,o){if(Array.isArray(e))return e.map(e=>$(e,t,void 0,o));if(!i(e)||a(e))return e;let s={};for(let[n,i]of Object.entries(e))s[n]=r.has(n)||n.startsWith(`$`)?i:$(i,t,n,n===`dark`||n===`light`?n:o);let c=s;if(n===`color`){for(let e of j){let n=c[e];i(n)&&!a(n)&&(c[e]=Me(e,n,t,o))}for(let[e,n]of Object.entries(c)){let r=a(n)&&typeof n.group==`string`?me[n.group]:void 0;r&&(c=Q(c,t,r,e,o))}}for(let[e,n]of Object.entries(he))a(c[e])&&(c=Q(c,t,n,e,o));return n===`color`?Ne(c):c}function Pe(e){let t=S(e),n=ye($(t,t,void 0,ae(t)));return I(n,n)}var Fe=e(()=>({name:`cyclone-ui:tamagui-preprocessor`,preprocessors:[{name:`tamagui-preprocessor`,preprocessor:Pe}]}));export{Fe as default,Pe as tamaguiPreprocessor};
+import{definePlugin as e}from"@razorwind/core/plugin";const t=/^#(?:[0-9a-f]{3,4}|[0-9a-f]{6}|[0-9a-f]{8})$/i,n=/^oklch\(\s*([0-9.]+%?|none)\s+([0-9.]+|none)\s+([0-9.]+|none)(?:\s*\/\s*([0-9.%]+))?\s*\)$/i,r=/* @__PURE__ */ new Set([`$schema`,`$type`,`$description`,`$extensions`,`$extends`,`$deprecated`,`$root`,`$value`,`$ref`,`theme`,`palette`,`primitive`]);function i(e){return typeof e==`object`&&!!e&&!Array.isArray(e)}function a(e){return i(e)&&(`$value`in e||`$ref`in e)}function o(e){let t=e.trim();return t.startsWith(`{`)||t.startsWith(`var(`)}function s(e){return Math.min(1,Math.max(0,e))}function c(e){let t=s(e);return t<=.0031308?12.92*t:1.055*t**(1/2.4)-.055}function l(e){let t=s(e);return t<=.04045?t/12.92:((t+.055)/1.055)**2.4}function u(e){return Math.round(c(e)*255).toString(16).padStart(2,`0`)}function d(e){return Math.round(s(e)*255).toString(16).padStart(2,`0`)}function f(e){return Math.round(s(e)*255).toString(16).padStart(2,`0`)}function p(e){let t=e.startsWith(`#`)?e.slice(1):e;return t.length===3||t.length===4?`#${[...t].map(e=>e+e).join(``)}`:`#${t}`}function m(e){if(typeof e==`string`){let n=e.trim();if(!t.test(n))return;let r=p(n).toLowerCase();return r.length===9&&r.endsWith(`ff`)?r.slice(0,7):r}if(i(e)){if(typeof e.hex==`string`&&t.test(e.hex)){let t=p(e.hex).toLowerCase().slice(0,7),n=v(e.alpha);return n!==void 0&&n<1?`${t}${f(n)}`:t}if(e.colorSpace===`srgb`&&Array.isArray(e.components)&&e.components.length>=3){let t=_(e.components[0]),n=_(e.components[1]),r=_(e.components[2]);if(t===void 0||n===void 0||r===void 0)return;let i=`#${d(t)}${d(n)}${d(r)}`,a=v(e.alpha);return a!==void 0&&a<1?`${i}${f(a)}`:i}}}function h(e,t,n){let r=n*Math.PI/180,i=t*Math.cos(r),a=t*Math.sin(r),o=e+.3963377774*i+.2158037573*a,s=e-.1055613458*i-.0638541728*a,c=e-.0894841775*i-1.291485548*a,l=o**3,u=s**3,d=c**3;return{red:4.0767416621*l-3.3077115913*u+.2309699292*d,green:-1.2684380046*l+2.6097574011*u-.3413193965*d,blue:-.0041960863*l-.7034186147*u+1.707614701*d}}function g(e,t,n,r){let{red:i,green:a,blue:o}=h(e,t,n),s=`#${u(i)}${u(a)}${u(o)}`;return r===void 0||r>=1?s:`${s}${f(r)}`}function _(e){if(typeof e==`number`&&Number.isFinite(e))return e;if(typeof e!=`string`||e===`none`)return;let t=Number.parseFloat(e);return Number.isFinite(t)?t:void 0}function v(e){if(typeof e==`number`&&Number.isFinite(e))return e>1?e/100:e;if(typeof e!=`string`)return;let t=Number.parseFloat(e);if(Number.isFinite(t))return e.includes(`%`)||t>1?t/100:t}function ee(e){let t=n.exec(e.trim());if(!t)return;let r=_(t[1]),i=_(t[2]),a=_(t[3]);if(r!==void 0&&i!==void 0&&a!==void 0)return t[1]?.includes(`%`)&&(r/=100),g(r,i,a,v(t[4]))}function te(e){if(!Array.isArray(e.components)||e.components.length<3)return;let t=_(e.components[0]),n=_(e.components[1]),r=_(e.components[2]);if(t!==void 0&&n!==void 0&&r!==void 0)return t>1&&(t/=100),g(t,n,r,v(e.alpha))}function y(e){if(typeof e==`string`)return o(e)?void 0:ee(e)??m(e)??void 0;if(i(e))return typeof e.colorSpace==`string`&&e.colorSpace.toLowerCase()===`oklch`?te(e):m(e)??void 0}function ne(e){if(Array.isArray(e))return e.map(e=>ne(e));if(!i(e)||!(`color`in e))return e;let t=y(e.color);return t?{...e,color:t}:e}function re(e,t){if(t===`shadow`)return ne(e);if(t===`border`&&i(e)&&`color`in e){let t=y(e.color);return t?{...e,color:t}:e}return t===`color`||t===void 0?y(e)??e:e}function b(e,t){return typeof e.$type==`string`?e.$type:typeof e.type==`string`?e.type:t}function ie(e,t){if(`$ref`in e&&!(`$value`in e))return{...e};let n=b(e,t);return`$value`in e?{...e,$value:re(e.$value,n)}:{...e}}function x(e,t){if(Array.isArray(e))return e.map(e=>x(e,t));if(!i(e))return e;if(a(e))return ie(e,t);let n=typeof e.$type==`string`?e.$type:t,o={};for(let[t,i]of Object.entries(e))o[t]=r.has(t)||t.startsWith(`$`)?i:x(i,n);return o}const S={dark:`#ffffff`,light:`#0c0c0d`},ae={dark:`#ffffff`,light:`#000000`};function C(e){if(typeof e!=`string`)return;let t=/\b(dark|light)[\s-]+theme\b/i.exec(e)?.[1];return t?.toLowerCase()===`dark`?`dark`:t?.toLowerCase()===`light`?`light`:void 0}function oe(e){if(i(e)&&i(e.color))return C(e.color.$description)}const se={name:`active`,brightness:1.45,useContrastPrimitive:!0},ce={name:`active`,brightness:1.25},le={name:`active`,brightness:1.125},ue={name:`active`,brightness:1.4},de={name:`active`,brightness:1.8,useContrastPrimitive:!0},fe={name:`inactive`,brightness:.8},w={name:`inactive`,brightness:.5,useContrastPrimitive:!0},T={name:`disabled`,opacity:.35,saturation:.85,fadeOver:`oklch(0.3839 0.0045 286.26)`},E={lowSaturation:[se,w,T],saturated:[ce,fe,T]},pe={lowSaturation:[le,w,T],saturated:E.saturated},D={name:`inactive`,brightness:.9},O={...T,opacity:.675,saturation:.925},k={lowSaturation:[{name:`active`,brightness:1.15},D,O],saturated:[{name:`active`,brightness:1.25},D,O]},A=[`base`,`danger`,`warning`,`info`,`discovery`,`success`],me={primary:E,secondary:pe,link:E},he={foreground:{lowSaturation:[{name:`hovered`,brightness:1.45},...E.lowSaturation],saturated:[{name:`hovered`,brightness:1.15},...E.saturated]},background:{lowSaturation:[{name:`hovered`,brightness:1.1},...k.lowSaturation],saturated:[{name:`hovered`,brightness:1.15},...k.saturated]}},ge={outline:{lowSaturation:[de,w,T],saturated:[ue,fe,T]}},j=7.5,M=.01;function _e(e){return e.toLowerCase().endsWith(`-hovered`)||e.toLowerCase().endsWith(`-active`)||e.toLowerCase().endsWith(`-inactive`)||e.toLowerCase().endsWith(`-disabled`)}function ve(e,t){let n=e;for(let e of t.split(`.`).filter(Boolean)){if(!i(n)||!(e in n))return;n=n[e]}return a(n)?n:void 0}function N(e,t,n=/* @__PURE__ */ new Set){let r=y(e);if(r)return r;if(typeof e!=`string`)return;let i=/^\{([^{}]+)\}$/.exec(e.trim());if(!i?.[1]||n.has(i[1]))return;n.add(i[1]);let a=ve(t,i[1]);if(a&&`$value`in a)return N(a.$value,t,n)}function P(e,t){let n=p(e).toLowerCase(),r=n.slice(0,7),i=s((n.length===9?Number.parseInt(n.slice(7,9),16)/255:1)*t);return i>=1?r:`${r}${f(i)}`}function ye(e,t,n){let r=p(e).toLowerCase(),i=p(y(t)??t).toLowerCase(),a=s((r.length===9?Number.parseInt(r.slice(7,9),16)/255:1)*n),o=e=>d((Number.parseInt(r.slice(e,e+2),16)*a+Number.parseInt(i.slice(e,e+2),16)*(1-a))/255);return`#${o(1)}${o(3)}${o(5)}`}function F(e,t,n=!1){if(Array.isArray(e))return e.map(e=>F(e,t,n));if(!i(e))return e;if(n&&a(e)&&b(e)===`shadow`){let n=e.$value,r=e=>{if(!i(e)||!(`color`in e))return e;let n=N(e.color,t);return n?{...e,color:P(n,R(n)?.1:.15)}:e};return{...e,$value:Array.isArray(n)?n.map((e,t)=>t===n.length-1?r(e):e):r(n)}}let r={};for(let[i,a]of Object.entries(e))r[i]=F(a,t,n||i.toLowerCase()===`ring`);return r}const I={value:0,unit:`px`};function L(e,t){return{color:e,offsetX:I,offsetY:I,blur:I,spread:{value:t,unit:`px`}}}function be(e){if(!i(e)||!i(e.color))return e;let t=e.color,n=i(e.ring)?{...e.ring}:{},r=!1;for(let e of A){let o=t[e];if(!i(o)||!a(o.primary))continue;let s=`{color.${e}.primary}`,c=e=>L(`{color.elevated}`,e),l={[e]:[`${e} 3px focus ring with no gap`,[L(s,3)]],[`${e}-subtle`]:[`${e} 1px outline focus ring with no gap`,[L(s,1)]],[`${e}-offset`]:[`${e} 3px focus ring with a 3px gap`,[c(3),L(s,6)]],[`${e}-subtle-offset`]:[`${e} 1px focus ring with a 2px gap`,[c(2),L(s,3)]]};for(let[t,[i,a]]of Object.entries(l))t in n||(n[t]={$description:`Generated ${i}`,$type:`shadow`,$value:a,theme:e},r=!0)}return r?{...e,ring:n}:e}function R(e){return B(e).chroma<.02}function z(e){let t=p(e).toLowerCase();return t.slice(1,3)===t.slice(3,5)&&t.slice(3,5)===t.slice(5,7)}function B(e){let t=p(e).toLowerCase(),n=l(Number.parseInt(t.slice(1,3),16)/255),r=l(Number.parseInt(t.slice(3,5),16)/255),i=l(Number.parseInt(t.slice(5,7),16)/255),a=t.length===9?Number.parseInt(t.slice(7,9),16)/255:void 0,o=.4122214708*n+.5363325363*r+.0514459929*i,s=.2119034982*n+.6806995451*r+.1073969566*i,c=.0883024619*n+.2817188376*r+.6299787005*i,u=Math.cbrt(o),d=Math.cbrt(s),f=Math.cbrt(c),m=.2104542553*u+.793617785*d-.0040720468*f,h=1.9779984951*u-2.428592205*d+.4505937099*f,g=.0259040371*u+.7827717662*d-.808675766*f,_=Math.hypot(h,g),v=Math.atan2(g,h)*180/Math.PI;return v<0&&(v+=360),{lightness:m,chroma:_,hue:v,alpha:a}}function V({red:e,green:t,blue:n}){return e>=0&&e<=1&&t>=0&&t<=1&&n>=0&&n<=1}function H(e,t,n,r){if(V(h(e,t,n)))return g(e,t,n,r);let i=0,a=t;for(let t=0;t<32;t+=1){let t=(i+a)/2;V(h(e,t,n))?i=t:a=t}return g(e,i,n,r)}function xe(e,t){let{lightness:n,chroma:r,hue:i,alpha:a}=B(e);return g(s(n*t),r,i,a)}function Se(e,t){let{lightness:n,chroma:r,hue:i,alpha:a}=B(e);return g(s(n+t),r,i,a)}function Ce(e,t){let{lightness:n,chroma:r,hue:i,alpha:a}=B(e);return g(n,r*s(t),i,a)}function U(e){let t=p(e).toLowerCase(),n=e=>{let n=Number.parseInt(t.slice(e,e+2),16)/255;return n<=.04045?n/12.92:((n+.055)/1.055)**2.4};return .2126*n(1)+.7152*n(3)+.0722*n(5)}function W(e,t){let n=U(e),r=U(t),i=Math.max(n,r),a=Math.min(n,r);return(i+.05)/(a+.05)}function G(e){let t=W(e,`#FAFAFA`);return t>=2?`#FAFAFA`:W(e,`#151518`)*.5>t?`#151518`:`#FAFAFA`}function we(e,t){let{lightness:n,chroma:r,hue:i,alpha:a}=B(e),o=t===`light`?1:-1,c=-o,l=n,u=n,d=e,f=e;for(let t=0;t<100;t+=1){if(l=s(l+o*M),d=H(l,r,i,a),W(d,f)>=j)return f===e?{secondary:d}:{secondary:d,onMuted:f};if(u=s(u+c*M),f=H(u,r,i,a),W(d,f)>=j)return{secondary:d,onMuted:f};if((l===0||l===1)&&(u===0||u===1))break}throw Error(`Unable to generate an accessible secondary pair for ${e}`)}function Te(e,t){return t===`dark`?K(e):t===`light`?!q(e):B(e).lightness>=.5}function Ee(e,t){return!Te(e,t)}const De=B(`#dddddd`).lightness,Oe=B(`#262626`).lightness;function K(e){return B(e).lightness>=(R(e)?De:.75)}function q(e){return B(e).lightness<=(R(e)?Oe:.25)}function J(e){return e.name===`hovered`||e.name===`active`}function ke(e,t){return t===`dark`?K(e):t===`light`&&q(e)}function Ae(e,t,n){return Ee(e,n)?t:2-t}function Y(e,t){return e.useContrastPrimitive&&t?S[t]:void 0}function X(e,t,n){if(t.name===`hovered`&&Y(t,n)&&ke(e,n))return n===`dark`?-.25:.25}function je(e,t,n){let r=Y(t,n);return r&&n&&t.name===`active`&&ke(e,n)?ae[n]:r}function Me(e,t,n){return t.brightness===void 0?1:Y(t,n)?J(t)?1:t.brightness:Ae(e,t.brightness,n)}function Ne(e,t,n){let r=X(e,t,n),i=r===void 0?je(e,t,n):void 0,a=i??e;return r===void 0?t.brightness!==void 0&&!(i&&J(t))&&(a=xe(a,Me(a,t,n))):a=Se(e,r),t.saturation!==void 0&&!z(e)&&(a=Ce(a,t.saturation),t.fadeOver===void 0)?a:t.fadeOver===void 0?t.opacity===void 0?a:P(a,t.opacity):ye(a,t.fadeOver,t.opacity??1)}function Pe(e,t,n){let r=[],i=X(t,e,n),a=je(t,e,n);if(i!==void 0)r.push(`${Math.round(Math.abs(i)*100)}% ${i<0?`darker`:`lighter`}`);else if(a&&J(e))r.push(n&&a!==S[n]?`pure ${n===`dark`?`white`:`black`}`:`${n} contrast primitive`);else if(e.brightness!==void 0){let i=Me(t,e,n),a=Math.round((i-1)*100);r.push(a>=0?`${a}% brighter`:`${Math.abs(a)}% darker`)}return e.saturation!==void 0&&!z(t)&&r.push(`${Math.round(e.saturation*100)}% saturation`),e.fadeOver===void 0?e.opacity!==void 0&&(e.saturation===void 0||z(t))&&r.push(`${Math.round(e.opacity*100)}% opacity`):r.push(`${Math.round((e.opacity??1)*100)}% over ${e.fadeOver}`),r.join(`, `)||e.name}function Fe(e,t,n,r){let i=Pe(n,t,r),a=Ne(t,n,r);return{...e,$type:`color`,$value:a,$description:typeof e.$description==`string`?`${e.$description} (${n.name}, ${i})`:`${n.name} state at ${i}`}}function Z(e,t,n,r,i){let o={...e},s=r?[r]:Object.keys(e);for(let r of s){if(r.startsWith(`$`)||_e(r))continue;let s=e[r];if(!a(s))continue;let c=b(s);if(c&&c!==`color`)continue;let l=N(s.$value,t);if(!l)continue;let u=R(l)?n.lowSaturation:n.saturated,d=u.some(e=>e.name===`hovered`),f=u.flatMap(e=>e.name===`active`&&!d?[{...e,name:`hovered`},e]:[e]),p=C(s.$description)??i;for(let e of f){let t=`${r}-${e.name}`;t in o||(o[t]=Fe(s,l,e,p))}}return o}function Ie(e,t,n,r){let i=t.primary,o=a(i)&&N(i.$value,n),s=a(i)&&b(i);if(!a(i)||!o||s&&s!==`color`)return t;let c={...t};c.link??={...i,$type:`color`,$value:`{color.${e}.primary}`,$description:`Generated ${e} hyperlink text color (matches primary)`},c[`on-primary`]??={...i,$type:`color`,$value:G(o),$description:`Generated text and icon color on ${e} primary backgrounds`};let l;if(r&&!(`secondary`in t)){let t=we(o,r);c.secondary={...i,$type:`color`,$value:t.secondary,$description:`Generated low-emphasis ${e} background for the ${r} theme`},l=t.onMuted??o}else if(a(t.secondary)){let e=N(t.secondary.$value,n);l=e&&G(e)}l&&!(`on-secondary`in t)&&(c[`on-secondary`]={...i,$type:`color`,$value:l,$description:`Generated text and icon color on ${e} secondary backgrounds`});for(let[e,t]of Object.entries(me))c=Z(c,n,t,e,r);for(let[t,n]of Object.entries(c))a(n)&&(c[t]={theme:e,group:e,...n});return c}function Le(e){let t={...e};for(let[n,r]of Object.entries(e)){let e=n.replace(/^on-/,``).replace(/-(?:hovered|active|inactive|disabled)$/i,``);e!==n&&a(r)&&!(`group`in r)&&(t[n]={...r,group:e})}return t}function Q(e,t,n,o){if(Array.isArray(e))return e.map(e=>Q(e,t,void 0,o));if(!i(e)||a(e))return e;let s={};for(let[n,i]of Object.entries(e))s[n]=r.has(n)||n.startsWith(`$`)?i:Q(i,t,n,n===`dark`||n===`light`?n:o);let c=s;if(n===`color`){for(let e of A){let n=c[e];i(n)&&!a(n)&&(c[e]=Ie(e,n,t,o))}for(let[e,n]of Object.entries(c)){let r=a(n)&&typeof n.group==`string`?he[n.group]:void 0;r&&(c=Z(c,t,r,e,o))}}for(let[e,n]of Object.entries(ge))a(c[e])&&(c=Z(c,t,n,e,o));return n===`color`?Le(c):c}function $(e){let t=x(e),n=be(Q(t,t,void 0,oe(t)));return F(n,n)}var Re=e(()=>({name:`cyclone-ui:tamagui-preprocessor`,preprocessors:[{name:`tamagui-preprocessor`,preprocessor:$}]}));export{Re as default,$ as tamaguiPreprocessor};
 //# sourceMappingURL=preprocessor.mjs.map

package/dist/preprocessor.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"preprocessor.mjs","names":["HEX_RE","OKLCH_RE","RESERVED_KEYS","isPlainObject","value","isTokenNode","isAlias","trimmed","clamp01","toSrgb","clipped","channel","fromSrgb","hexChannel","srgbHexChannel","alphaHex","alpha","expandHex","hex","digit","colorValueToHex","expanded","parseAlpha","red","parseComponent","green","blue","oklchToLinearSrgb","hueRad","hue","a","chroma","b","l_","lightness","m_","s_","l3","m3","s3","oklchToHex","parsed","oklchStringToHex","match","oklchObjectToHex","convertColor","convertShadow","layer","color","convertValue","type","resolveType","token","inheritedType","mapTokenNode","walk","node","item","groupType","result","key","CONTRAST_PRIMITIVES","PURE_CONTRAST_COLORS","parentThemeFromDescription","description","theme","parentThemeFromDictionary","dictionary","LOW_SATURATION_COLOR_STATE_ACTIVE","COLOR_STATE_ACTIVE","SUBTLE_LOW_SATURATION_COLOR_STATE_ACTIVE","HAIRLINE_COLOR_STATE_ACTIVE","INCREASED_LOW_SATURATION_COLOR_STATE_ACTIVE","COLOR_STATE_INACTIVE","LOW_SATURATION_COLOR_STATE_INACTIVE","COLOR_STATE_DISABLED","DEFAULT_COLOR_STATE_VARIANTS","SUBTLE_COLOR_STATE_VARIANTS","BACKGROUND_COLOR_STATE_INACTIVE","BACKGROUND_COLOR_STATE_DISABLED","BACKGROUND_COLOR_STATE_VARIANTS","THEME_COLOR_KEYS","THEME_COLOR_STATE_VARIANTS","COLOR_STATE_TOKEN_GROUPS","COLOR_STATE_VARIANTS","MINIMUM_SUBTLE_CONTRAST_RATIO","SUBTLE_COLOR_LIGHTNESS_STEP","isStateVariantKey","getTokenAtPath","tree","part","path","resolveColorHex","direct","ref","seen","applyOpacity","rgb","opacity","applyFadeOver","foreground","base","background","offset","applyRingOpacity","inRingGroup","applyToLayer","isLowSaturation","index","ringLayer","zero","spread","addMissingRingTokens","ring","changed","name","group","ringColor","gap","variants","hexToOklch","isGreyscale","l","m","s","isInSrgbGamut","oklchToGamutMappedHex","minimumChroma","maximumChroma","candidateChroma","applyBrightness","factor","applyLightnessShift","shift","applySaturation","relativeLuminance","contrastRatio","firstLuminance","first","secondLuminance","second","lighter","darker","createOnColor","whiteContrast","createMutedColor","secondaryDirection","parentTheme","onMutedDirection","secondaryLightness","onMutedLightness","secondary","onMuted","isLightColor","isWhiteColor","isBlackColor","isDarkColor","isInteractionState","variant","isNearContrastPrimitive","directedBrightnessFactor","contrastPrimitive","contrastSideLightnessShift","stateContrastColor","primitive","stateBrightnessFactor","applyStateTransform","transformed","variantDetail","details","percent","createStateToken","detail","source","addColorStateTokens","names","onlyKey","tokenVariants","tokenParentTheme","variantKey","addThemeColorGroupTokens","onSecondary","pair","secondaryHex","addColorTokenGroups","root","injectColorStateVariants","childKey","withStates","tokenKey","tamaguiPreprocessor","converted","withRings","preprocessor_default","definePlugin"],"sources":[],"mappings":""}
+{"version":3,"file":"preprocessor.mjs","names":["HEX_RE","OKLCH_RE","RESERVED_KEYS","isPlainObject","value","isTokenNode","isAlias","trimmed","clamp01","toSrgb","clipped","channel","fromSrgb","hexChannel","srgbHexChannel","alphaHex","alpha","expandHex","hex","digit","colorValueToHex","expanded","parseAlpha","red","parseComponent","green","blue","oklchToLinearSrgb","hueRad","hue","a","chroma","b","l_","lightness","m_","s_","l3","m3","s3","oklchToHex","parsed","oklchStringToHex","match","oklchObjectToHex","convertColor","convertShadow","layer","color","convertValue","type","resolveType","token","inheritedType","mapTokenNode","walk","node","item","groupType","result","key","CONTRAST_PRIMITIVES","PURE_CONTRAST_COLORS","parentThemeFromDescription","description","theme","parentThemeFromDictionary","dictionary","LOW_SATURATION_COLOR_STATE_ACTIVE","COLOR_STATE_ACTIVE","SUBTLE_LOW_SATURATION_COLOR_STATE_ACTIVE","HAIRLINE_COLOR_STATE_ACTIVE","INCREASED_LOW_SATURATION_COLOR_STATE_ACTIVE","COLOR_STATE_INACTIVE","LOW_SATURATION_COLOR_STATE_INACTIVE","COLOR_STATE_DISABLED","DEFAULT_COLOR_STATE_VARIANTS","SUBTLE_COLOR_STATE_VARIANTS","BACKGROUND_COLOR_STATE_INACTIVE","BACKGROUND_COLOR_STATE_DISABLED","BACKGROUND_COLOR_STATE_VARIANTS","THEME_COLOR_KEYS","THEME_COLOR_STATE_VARIANTS","COLOR_STATE_TOKEN_GROUPS","COLOR_STATE_VARIANTS","MINIMUM_SUBTLE_CONTRAST_RATIO","SUBTLE_COLOR_LIGHTNESS_STEP","isStateVariantKey","getTokenAtPath","tree","part","path","resolveColorHex","direct","ref","seen","applyOpacity","rgb","opacity","applyFadeOver","foreground","base","background","offset","applyRingOpacity","inRingGroup","applyToLayer","isLowSaturation","index","ZERO","ringLayer","spread","addMissingRingTokens","ring","changed","name","group","ringColor","gap","variants","hexToOklch","isGreyscale","l","m","s","isInSrgbGamut","oklchToGamutMappedHex","minimumChroma","maximumChroma","candidateChroma","applyBrightness","factor","applyLightnessShift","shift","applySaturation","relativeLuminance","contrastRatio","firstLuminance","first","secondLuminance","second","lighter","darker","createOnColor","whiteContrast","createMutedColor","secondaryDirection","parentTheme","onMutedDirection","secondaryLightness","onMutedLightness","secondary","onMuted","isLightColor","isWhiteColor","isBlackColor","isDarkColor","LOW_SATURATION_WHITE_LIGHTNESS","LOW_SATURATION_BLACK_LIGHTNESS","isInteractionState","variant","isNearContrastPrimitive","directedBrightnessFactor","contrastPrimitive","contrastSideLightnessShift","stateContrastColor","primitive","stateBrightnessFactor","applyStateTransform","transformed","variantDetail","details","percent","createStateToken","detail","source","addColorStateTokens","names","onlyKey","baseVariants","hasHovered","tokenVariants","tokenParentTheme","variantKey","addThemeColorGroupTokens","onSecondary","pair","secondaryHex","addColorTokenGroups","root","injectColorStateVariants","childKey","withStates","tokenKey","tamaguiPreprocessor","converted","withRings","preprocessor_default","definePlugin"],"sources":[],"mappings":""}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cyclone-ui/theme-builder",
-  "version": "0.0.5",
+  "version": "0.0.7",
   "private": false,
   "publishConfig": {
     "access": "public"

package/src/preprocessor.ts

@@ -482,7 +482,7 @@ const COLOR_STATE_INACTIVE: ColorStateVariant = {
 
 const LOW_SATURATION_COLOR_STATE_INACTIVE: ColorStateVariant = {
   name: "inactive",
-  brightness: 0.6,
+  brightness: 0.5,
   useContrastPrimitive: true
 };
 
@@ -534,12 +534,12 @@ const BACKGROUND_COLOR_STATE_DISABLED: ColorStateVariant = {
 
 const BACKGROUND_COLOR_STATE_VARIANTS: ColorStateVariants = {
   lowSaturation: [
-    { name: "active", brightness: 1.0375 },
+    { name: "active", brightness: 1.15 },
     BACKGROUND_COLOR_STATE_INACTIVE,
     BACKGROUND_COLOR_STATE_DISABLED
   ],
   saturated: [
-    { name: "active", brightness: 1.125 },
+    { name: "active", brightness: 1.25 },
     BACKGROUND_COLOR_STATE_INACTIVE,
     BACKGROUND_COLOR_STATE_DISABLED
   ]
@@ -564,18 +564,45 @@ const THEME_COLOR_KEYS = [
 /** State variants for the tokens inside each theme color group. */
 const THEME_COLOR_STATE_VARIANTS: Record<string, ColorStateVariants> = {
   primary: DEFAULT_COLOR_STATE_VARIANTS,
-  secondary: SUBTLE_COLOR_STATE_VARIANTS
+  secondary: SUBTLE_COLOR_STATE_VARIANTS,
+  link: DEFAULT_COLOR_STATE_VARIANTS
+};
+
+/**
+ * Foreground and background hovered states are a smaller step than active
+ * (e.g. in dark themes, active is lighter than hovered).
+ */
+const FOREGROUND_COLOR_STATE_VARIANTS: ColorStateVariants = {
+  lowSaturation: [
+    { name: "hovered", brightness: 1.45 },
+    ...DEFAULT_COLOR_STATE_VARIANTS.lowSaturation
+  ],
+  saturated: [
+    { name: "hovered", brightness: 1.15 },
+    ...DEFAULT_COLOR_STATE_VARIANTS.saturated
+  ]
+};
+
+const BACKGROUND_COLOR_STATE_HOVERED_VARIANTS: ColorStateVariants = {
+  lowSaturation: [
+    { name: "hovered", brightness: 1.1 },
+    ...BACKGROUND_COLOR_STATE_VARIANTS.lowSaturation
+  ],
+  saturated: [
+    { name: "hovered", brightness: 1.15 },
+    ...BACKGROUND_COLOR_STATE_VARIANTS.saturated
+  ]
 };
 
 /** Color tokens with these `group`s receive state variants. */
 const COLOR_STATE_TOKEN_GROUPS: Record<string, ColorStateVariants> = {
-  foreground: DEFAULT_COLOR_STATE_VARIANTS,
-  background: BACKGROUND_COLOR_STATE_VARIANTS
+  foreground: FOREGROUND_COLOR_STATE_VARIANTS,
+  background: BACKGROUND_COLOR_STATE_HOVERED_VARIANTS
 };
 
 /** Standalone color tokens that receive state variants. */
 const COLOR_STATE_VARIANTS: Record<string, ColorStateVariants> = {
-  hairline: {
+  outline: {
     lowSaturation: [
       INCREASED_LOW_SATURATION_COLOR_STATE_ACTIVE,
       LOW_SATURATION_COLOR_STATE_INACTIVE,
@@ -594,7 +621,7 @@ const LOW_SATURATION_CHROMA = 0.02;
 
 const LOW_SATURATION_RING_OPACITY = 0.1;
 const SATURATED_RING_OPACITY = 0.15;
-const MINIMUM_SUBTLE_CONTRAST_RATIO = 7.25;
+const MINIMUM_SUBTLE_CONTRAST_RATIO = 7.5;
 const MINIMUM_INVERSE_CONTRAST_RATIO = 2;
 const SUBTLE_COLOR_LIGHTNESS_STEP = 0.01;
 const MAX_SUBTLE_COLOR_ADJUSTMENTS = 100;
@@ -753,14 +780,14 @@ function applyRingOpacity(
   return result;
 }
 
-function ringLayer(color: string, spread: number): Record<string, unknown> {
-  const zero = { value: 0, unit: "px" };
+const ZERO = { value: 0, unit: "px" };
 
+function ringLayer(color: string, spread: number): Record<string, unknown> {
   return {
     color,
-    offsetX: zero,
-    offsetY: zero,
-    blur: zero,
+    offsetX: ZERO,
+    offsetY: ZERO,
+    blur: ZERO,
     spread: { value: spread, unit: "px" }
   };
 }
@@ -786,20 +813,20 @@ function addMissingRingTokens(dictionary: unknown): unknown {
     }
 
     const ringColor = `{color.${name}.primary}`;
-    const gap = ringLayer("{color.elevated}", 3);
+    const gap = (spread: number) => ringLayer("{color.elevated}", spread);
     const variants: Record<string, [string, unknown[]]> = {
       [name]: [`${name} 3px focus ring with no gap`, [ringLayer(ringColor, 3)]],
       [`${name}-subtle`]: [
-        `${name} 1px hairline focus ring with no gap`,
+        `${name} 1px outline focus ring with no gap`,
         [ringLayer(ringColor, 1)]
       ],
       [`${name}-offset`]: [
         `${name} 3px focus ring with a 3px gap`,
-        [gap, ringLayer(ringColor, 6)]
+        [gap(3), ringLayer(ringColor, 6)]
       ],
       [`${name}-subtle-offset`]: [
-        `${name} 1px focus ring with a 3px gap`,
-        [gap, ringLayer(ringColor, 4)]
+        `${name} 1px focus ring with a 2px gap`,
+        [gap(2), ringLayer(ringColor, 3)]
       ]
     };
 
@@ -1031,12 +1058,22 @@ function isDarkColor(hex: string, parentTheme?: ParentTheme): boolean {
   return !isLightColor(hex, parentTheme);
 }
 
+/** Low-saturation colors only count as white / black past ≈ #dddddd / #262626. */
+const LOW_SATURATION_WHITE_LIGHTNESS = hexToOklch("#dddddd").lightness;
+const LOW_SATURATION_BLACK_LIGHTNESS = hexToOklch("#262626").lightness;
+
 function isWhiteColor(hex: string): boolean {
-  return hexToOklch(hex).lightness >= 0.75;
+  return (
+    hexToOklch(hex).lightness >=
+    (isLowSaturation(hex) ? LOW_SATURATION_WHITE_LIGHTNESS : 0.75)
+  );
 }
 
 function isBlackColor(hex: string): boolean {
-  return hexToOklch(hex).lightness <= 0.25;
+  return (
+    hexToOklch(hex).lightness <=
+    (isLowSaturation(hex) ? LOW_SATURATION_BLACK_LIGHTNESS : 0.25)
+  );
 }
 
 /** Hovered and active states share the contrast primitive behavior. */
@@ -1268,11 +1305,13 @@ function addColorStateTokens(
       continue;
     }
 
-    // Hovered states are generated from the matching active variant.
-    const tokenVariants = (
-      isLowSaturation(hex) ? variants.lowSaturation : variants.saturated
-    ).flatMap(variant =>
-      variant.name === "active"
+    // Hovered states default to the matching active variant.
+    const baseVariants = isLowSaturation(hex)
+      ? variants.lowSaturation
+      : variants.saturated;
+    const hasHovered = baseVariants.some(variant => variant.name === "hovered");
+    const tokenVariants = baseVariants.flatMap(variant =>
+      variant.name === "active" && !hasHovered
         ? [{ ...variant, name: "hovered" }, variant]
         : [variant]
     );
@@ -1300,8 +1339,8 @@ function addColorStateTokens(
 /**
  * Fill in a theme color group (`color.danger`, …): generate a missing
  * `secondary` low-emphasis background from `primary` and the parent theme,
- * `on-primary` / `on-secondary` text colors, and state variants for
- * `primary` and `secondary`. Every token in the group gets the group name as
+ * a missing `link` color (aliasing `primary`), `on-primary` / `on-secondary`
+ * text colors, and state variants for `primary`, `secondary` and `link`. Every token in the group gets the group name as
  * its `theme` and `group`, so Tamagui places it in that child theme (e.g.
  * `danger.on-primary` → `onPrimary` in the `danger` theme).
  */
@@ -1319,6 +1358,12 @@ function addThemeColorGroupTokens(
   }
 
   let result: Record<string, unknown> = { ...group };
+  result.link ??= {
+    ...token,
+    $type: "color",
+    $value: `{color.${name}.primary}`,
+    $description: `Generated ${name} hyperlink text color (matches primary)`
+  };
   result["on-primary"] ??= {
     ...token,
     $type: "color",
@@ -1365,7 +1410,7 @@ function addThemeColorGroupTokens(
 
 /**
  * Add a `group` (the main token name) to each state and `on-*` color token
- * that does not define one, e.g. `hairline-active` → `hairline`.
+ * that does not define one, e.g. `outline-active` → `outline`.
  */
 function addColorTokenGroups(
   group: Record<string, unknown>
@@ -1465,20 +1510,22 @@ function injectColorStateVariants(
 /**
  * Style Dictionary preprocessor: rewrite color `$value`s (and nested shadow
  * colors) to hex so generators emit `#rrggbb` / `#rrggbbaa` instead of
- * `oklch()`. Root colors (emphasis, ink, subtle, subtlest, hairline, backgrounds)
+ * `oklch()`. Root colors (emphasis, ink, subtle, subtlest, outline, backgrounds)
  * stay in the root light and dark themes without rings. For the `base` group and each
  * status group, a missing `secondary` background and `on-primary` /
  * `on-secondary` text colors are generated, then hovered, active, inactive,
- * and disabled variants are added to the hairline, `foreground` and
- * `background` group colors, and each theme color group's `primary` and `secondary`.
+ * and disabled variants are added to the outline, `foreground` and
+ * `background` group colors, and each theme color group's `primary`, `secondary`
+ * and `link` (which defaults to `primary` when missing).
  * Low-saturation colors derive their states from the parent theme's contrast
  * primitive (backgrounds use a half-strength shift of their own lightness; hovered
  * colors already near that primitive shift toward the middle, while active
  * ones become pure white or black); saturated
- * colors scale their own lightness. Tokens in a theme color group get the
+ * colors scale their own lightness. Foreground and background hovered states
+ * take a smaller step than their active states. Tokens in a theme color group get the
  * group name as `theme` and `group`, unless already set; root state and `on-*`
- * tokens get their main token name as `group` (e.g. `hairline-active` →
- * `hairline`).
+ * tokens get their main token name as `group` (e.g. `outline-active` →
+ * `outline`).
  * Finally, focus rings are generated for `base` and each status color.
  */
 export function tamaguiPreprocessor(

package/test/shiki-theme-mapping.spec.ts

@@ -65,6 +65,8 @@ const semanticColors = (prefix: string) => ({
     emphasis: color(`${prefix}-emphasis`),
     ink: color(`${prefix}-ink`),
     subtle: color(`${prefix}-subtle`),
+    subtlest: color(`${prefix}-subtlest`),
+    outline: color(`${prefix}-outline`),
     hairline: color(`${prefix}-hairline`),
     canvas: color(`${prefix}-canvas`),
     sunken: color(`${prefix}-sunken`),

package/test/storybook-theme-mapping.spec.ts

@@ -57,6 +57,8 @@ const semanticColors = (prefix: string) => ({
     emphasis: token(`${prefix}-emphasis`),
     ink: token(`${prefix}-ink`),
     subtlest: token(`${prefix}-subtlest`),
+    subtle: token(`${prefix}-subtle`),
+    outline: token(`${prefix}-outline`),
     hairline: token(`${prefix}-hairline`),
     canvas: token(`${prefix}-canvas`),
     elevated: token(`${prefix}-elevated`),
@@ -96,16 +98,16 @@ describe("Storybook theme mapping", () => {
       appBg: "dark-canvas",
       appContentBg: "dark-canvas",
       appPreviewBg: "dark-canvas",
-      appBorderColor: "dark-hairline",
+      appBorderColor: "dark-outline",
       appBorderRadius: 6,
       barTextColor: "dark-ink",
       barSelectedColor: "dark-emphasis",
       barBg: "dark-floating",
       barHoverColor: "dark-subtlest",
       buttonBg: "dark-elevated",
-      buttonBorder: "dark-hairline",
+      buttonBorder: "dark-outline",
       inputBg: "dark-elevated",
-      inputBorder: "dark-hairline",
+      inputBorder: "dark-outline",
       inputTextColor: "dark-ink",
       inputBorderRadius: 6,
       booleanBg: "dark-elevated",