@kanso-labs/kanso-ui 0.4.6 → 0.5.0

package/dist/cjs/styles/ripple.cjs

@@ -1,33 +0,0 @@
-//#region src/styles/ripple.ts
-const styles = {
-	press: {
-		kKwaWg: "xliahv6",
-		kbCHJM: "xu96u03",
-		kSiTet: "xg01cxk",
-		kVAEAm: "x10l6tqk",
-		k87sOh: "x13vifvy",
-		k3nNDw: "x1g0ag68",
-		kIyJzY: "xbg8nd6",
-		k1ekBW: "x19991ni",
-		kAMwcw: "xcj1dhv",
-		$$css: true
-	},
-	pressed: {
-		kSiTet: "xjg27g",
-		kIyJzY: "xjl7l83",
-		$$css: true
-	},
-	surface: {
-		kaIpWk: "x1pjcqnp",
-		k1xSpc: "x1lliihq x1c7sf14",
-		kpwlN0: "x10a8y8t",
-		kVQacm: "xb3r6kr",
-		kfzvcC: "x47corl",
-		kVAEAm: "x10l6tqk",
-		$$css: true
-	}
-};
-//#endregion
-exports.rippleStyles = styles;
-
-//# sourceMappingURL=ripple.cjs.map

package/dist/cjs/styles/ripple.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"ripple.cjs","names":[],"sources":["../../../src/styles/ripple.ts"],"sourcesContent":["import * as stylex from '@stylexjs/stylex';\nimport '../tokens/design.tokens.stylex';\nimport { stateLayerOpacity } from '../tokens/design.tokens.stylex';\nconst FORCED_COLORS = '@media (forced-colors: active)';\n\n// Growth and opacity are two independent mechanisms. Growth (width/height/\n// transform) is driven imperatively via the Web Animations API in\n// useRipple, decoupled from press/release timing so it always plays out\n// over a fixed duration. Opacity is what this file owns — toggled by the\n// `pressed` class — with a fast fade-in and a slower fade-out, so a quick\n// tap still reads as a deliberate, visible ripple rather than a flicker.\n//\n// None of the three timings below is a motion token, and that is deliberate\n// rather than an oversight predating them. The fade pair is the asymmetry\n// the paragraph above describes: 105ms in against 375ms out, hand-tuned as\n// a ratio to each other, and neither lands on the scale (105ms is near\n// durationShort1's 100ms; 375ms sits between durationMedium3 and\n// durationLong1). Snapping either to its nearest token would flatten a\n// tuned asymmetry into two arbitrary values, and adding tokens to fit would\n// make a scale that documents itself as three bands of three describe this\n// component instead. `linear` is likewise not on the easing scale, and\n// belongs off it — a fade to and from a state layer wants no acceleration,\n// which is why every curve in the token set is the wrong answer here.\n//\n// These three are now the only ripple timings off the scale. Everything\n// useRipple drives from JS is a token, read through src/tokens/values\n// because element.animate() and setTimeout both reject the StyleX form.\n//\n// The gradient's soft edge (a currentColor disc fading to transparent over\n// its outer 30-35%, capped at 70px) replaces a hard-edged circle so the\n// ripple blends into the surface rather than looking like a solid dot.\n//\n// `closest-side` + a plain circular box means no `border-radius` is needed\n// on the ripple itself — the gradient's own shape reads as a circle.\nconst styles = {\n  press: {\n    kKwaWg: \"xliahv6\",\n    kbCHJM: \"xu96u03\",\n    kSiTet: \"xg01cxk\",\n    kVAEAm: \"x10l6tqk\",\n    k87sOh: \"x13vifvy\",\n    k3nNDw: \"x1g0ag68\",\n    kIyJzY: \"xbg8nd6\",\n    k1ekBW: \"x19991ni\",\n    kAMwcw: \"xcj1dhv\",\n    $$css: true\n  },\n  pressed: {\n    kSiTet: \"xjg27g\",\n    kIyJzY: \"xjl7l83\",\n    $$css: true\n  },\n  surface: {\n    kaIpWk: \"x1pjcqnp\",\n    k1xSpc: \"x1lliihq x1c7sf14\",\n    kpwlN0: \"x10a8y8t\",\n    kVQacm: \"xb3r6kr\",\n    kfzvcC: \"x47corl\",\n    kVAEAm: \"x10l6tqk\",\n    $$css: true\n  }\n};\nexport { styles as rippleStyles };"],"mappings":";AAkCA,MAAM,SAAS;CACb,OAAO;EACL,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,SAAS;EACP,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,SAAS;EACP,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;AACF"}

package/dist/cjs/tokens/values.cjs

@@ -1,36 +0,0 @@
-//#region src/tokens/values.ts
-const motionDurationMs = {
-	long1: 450,
-	long2: 500,
-	long3: 600,
-	medium1: 250,
-	medium2: 300,
-	medium3: 350,
-	short1: 100,
-	short2: 150,
-	short3: 200
-};
-const motionEasing = {
-	emphasized: "cubic-bezier(0.2, 0, 0, 1)",
-	emphasizedAccelerate: "cubic-bezier(0.3, 0, 0.8, 0.15)",
-	emphasizedDecelerate: "cubic-bezier(0.05, 0.7, 0.1, 1)",
-	springFast: "cubic-bezier(0.34, 1.56, 0.64, 1)",
-	springSlow: "cubic-bezier(0.16, 1, 0.3, 1)",
-	standard: "cubic-bezier(0.2, 0, 0, 1)"
-};
-const spacingPx = {
-	lg: 16,
-	md: 12,
-	sm: 8,
-	xl: 24,
-	xs: 4,
-	xxl: 32,
-	xxs: 2,
-	xxxl: 40
-};
-//#endregion
-exports.motionDurationMs = motionDurationMs;
-exports.motionEasing = motionEasing;
-exports.spacingPx = spacingPx;
-
-//# sourceMappingURL=values.cjs.map

package/dist/cjs/tokens/values.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"values.cjs","names":[],"sources":["../../../src/tokens/values.ts"],"sourcesContent":["// AUTO-GENERATED by scripts/build-tokens.mjs from the sibling design.tokens.json.\n// Do not hand-edit — change design.tokens.json and run `npm run tokens:build`.\n//\n// Tokens as plain JS values, for the code that cannot take a CSS one. Reach for\n// the StyleX theme in design.tokens.stylex.ts anywhere a CSS property value\n// will do: those are var(--kui-*, literal) references, so a consumer who\n// redeclares the custom property moves them. The literals below are frozen at\n// build time and cannot honour such an override, which is the whole cost of\n// using them.\n//\n// So a group appears here only once something has to compute with it rather\n// than declare it, which today means two:\n//\n//   motion  — element.animate() throws a TypeError on a var() duration or\n//             easing, and its duration wants a number of milliseconds, so even\n//             '450ms' throws. setTimeout coerces a string to NaN and fires\n//             immediately, silently.\n//   spacing — useRipple does arithmetic with it, growing the ripple past the\n//             host's corners by a fixed inset. A var() would concatenate into\n//             nonsense rather than add.\n//\n// Colours, radii, shadows, typography and the state-layer opacities are all\n// declared rather than computed, so none of them is generated here.\n\nconst motionDurationMs = {\n  long1: 450,\n  long2: 500,\n  long3: 600,\n  medium1: 250,\n  medium2: 300,\n  medium3: 350,\n  short1: 100,\n  short2: 150,\n  short3: 200,\n} as const\n\nconst motionEasing = {\n  emphasized: 'cubic-bezier(0.2, 0, 0, 1)',\n  emphasizedAccelerate: 'cubic-bezier(0.3, 0, 0.8, 0.15)',\n  emphasizedDecelerate: 'cubic-bezier(0.05, 0.7, 0.1, 1)',\n  springFast: 'cubic-bezier(0.34, 1.56, 0.64, 1)',\n  springSlow: 'cubic-bezier(0.16, 1, 0.3, 1)',\n  standard: 'cubic-bezier(0.2, 0, 0, 1)',\n} as const\n\nconst spacingPx = {\n  lg: 16,\n  md: 12,\n  sm: 8,\n  xl: 24,\n  xs: 4,\n  xxl: 32,\n  xxs: 2,\n  xxxl: 40,\n} as const\n\nexport { motionDurationMs, motionEasing, spacingPx }\n"],"mappings":";AAwBA,MAAM,mBAAmB;CACvB,OAAO;CACP,OAAO;CACP,OAAO;CACP,SAAS;CACT,SAAS;CACT,SAAS;CACT,QAAQ;CACR,QAAQ;CACR,QAAQ;AACV;AAEA,MAAM,eAAe;CACnB,YAAY;CACZ,sBAAsB;CACtB,sBAAsB;CACtB,YAAY;CACZ,YAAY;CACZ,UAAU;AACZ;AAEA,MAAM,YAAY;CAChB,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,KAAK;CACL,KAAK;CACL,MAAM;AACR"}