@kanso-labs/kanso-ui 0.40.2 → 0.40.3

package/dist/navigation/styles.js

@@ -15,7 +15,7 @@ const navigationItemStyles = {
 		$$css: true
 	},
 	itemDisabled: {
-		kMwMTN: "x1gpw424",
+		kMwMTN: "x1gpw424 x1bhcspo",
 		kkrTdU: "xt0e3qv",
 		$$css: true
 	},

package/dist/navigation/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","names":["stylex","colors","media","radii","spacing","stateLayerOpacity","typography","FORCED_COLORS","HOVERED_OVER_NOTHING","onSecondaryContainer","hover","FOCUSED_OVER_NOTHING","focus","PRESSED_OVER_NOTHING","pressed","HOVERED_OVER_CURRENT","secondaryContainer","FOCUSED_OVER_CURRENT","PRESSED_OVER_CURRENT","navigationItemStyles","icon","kGNEyG","k1xSpc","kGuDYH","kjj79g","$$css","itemDisabled","kMwMTN","kkrTdU","label","kVQacm","kg5iWk","khDVqt","link","kB7OPa","k3XXqK","kVAEAm","kMnn75","pill","kWkggS","kaIpWk","barItemStyles","indicator","kZKoxP","kmuXW","kzqmXN","indicatorCurrent","kVAM5u","ksu8eU","kMzoRj","indicatorFocused","indicatorFocusedCurrent","indicatorHovered","indicatorHoveredCurrent","indicatorPressed","indicatorPressedCurrent","indicatorRing","kjBf7l","kInvED","kMeerF","item","kCS8Yb","kXwgrk","kzQI83","kOIVth","k7Eaqz","k8WAf4","kg3NbH","itemCurrent","itemFocused","itemFocusedCurrent","itemHovered","itemHoveredCurrent","itemPressed","itemPressedCurrent","itemRing","kMv6JI","k63SB2","kb6lSQ","kLWn49","ks0D6T","labelCurrent","collapsedItemStyles","expandedItemStyles","kSGwAc"],"sources":["../../src/navigation/styles.ts"],"sourcesContent":["import * as stylex from '@stylexjs/stylex';\nimport '../tokens/design.tokens.stylex';\nimport { colors, media, radii, spacing, stateLayerOpacity, typography } from '../tokens/design.tokens.stylex';\n\n// The destinations NavigationBar and NavigationRail both draw, in the three\n// forms the two pages give them. Apart from either component so the two\n// cannot drift, and outside `src/components` for the reason src/row gives.\n//\n// A vertical destination puts its icon in the page's 56dp by 32dp active\n// indicator with the label 4dp under it, in label medium: the navigation bar\n// below the medium breakpoint, and the collapsed rail. A horizontal one is a\n// pill holding the icon and the label side by side, 16dp in at either end:\n// the bar at and above the medium breakpoint at 40dp with 4dp between the\n// two, and the expanded rail at 56dp with 8dp between them, in label large.\n//\n// The current destination's pill is the secondary container, with its icon\n// in on secondary container and, under the pill, its label in secondary;\n// every other is on surface variant. A label set inside the pill, as a\n// horizontal destination sets it, takes on secondary container instead — the\n// library's own call. Secondary over secondary container is not a pair a\n// scheme is held to, and the Poster scheme's came to 4:1, short of the 4.5:1\n// text needs; on secondary container is the pair every scheme guarantees.\n//\n// The hover, focus and pressed layers are the on secondary container role\n// over whatever the pill is, at the pages' 8%, 10% and 10%, drawn on the\n// pill — the indicator in a vertical destination, the whole destination in a\n// horizontal one. They are applied in that order, so where two hold the\n// later wins, as the pages draw one layer at a time. A focused destination's\n// ring goes around the same pill; ./index.tsx says whose ring it is.\n//\n// Under forced colours the mode paints the secondary container over in its\n// background, which left the current destination looking like every other.\n// The pill takes a 2px border in `Highlight` there, which the mode keeps.\n\n// Windows High Contrast and the rest of the forced-colours modes. Spelled\n// here rather than imported, for the reason src/field/styles.ts records: the\n// StyleX compiler resolves a constant across files only out of a `.stylex.ts`\n// module, and the generated one holds design tokens rather than queries.\nconst FORCED_COLORS = '@media (forced-colors: active)';\n\n// The pill's ground and the layers over it, written out whole for each\n// ground, since StyleX replaces a property whole.\nconst HOVERED_OVER_NOTHING = `color-mix(in srgb, ${colors.onSecondaryContainer} calc(${stateLayerOpacity.hover} * 100%), transparent)`;\nconst FOCUSED_OVER_NOTHING = `color-mix(in srgb, ${colors.onSecondaryContainer} calc(${stateLayerOpacity.focus} * 100%), transparent)`;\nconst PRESSED_OVER_NOTHING = `color-mix(in srgb, ${colors.onSecondaryContainer} calc(${stateLayerOpacity.pressed} * 100%), transparent)`;\nconst HOVERED_OVER_CURRENT = `color-mix(in srgb, ${colors.onSecondaryContainer} calc(${stateLayerOpacity.hover} * 100%), ${colors.secondaryContainer})`;\nconst FOCUSED_OVER_CURRENT = `color-mix(in srgb, ${colors.onSecondaryContainer} calc(${stateLayerOpacity.focus} * 100%), ${colors.secondaryContainer})`;\nconst PRESSED_OVER_CURRENT = `color-mix(in srgb, ${colors.onSecondaryContainer} calc(${stateLayerOpacity.pressed} * 100%), ${colors.secondaryContainer})`;\n\n// What every destination draws whatever its form.\nconst navigationItemStyles = {\n  icon: {\n    kGNEyG: \"x6s0dn4\",\n    k1xSpc: \"x78zum5\",\n    kGuDYH: \"x1pvqxga\",\n    kjj79g: \"xl56j7k\",\n    $$css: true\n  },\n  itemDisabled: {\n    kMwMTN: \"x1gpw424\",\n    kkrTdU: \"xt0e3qv\",\n    $$css: true\n  },\n  label: {\n    kMwMTN: \"x1w5n3ug\",\n    kVQacm: \"xb3r6kr\",\n    kg5iWk: \"xlyipyv\",\n    khDVqt: \"xuxw1ft\",\n    $$css: true\n  },\n  link: {\n    kGNEyG: \"x6s0dn4\",\n    kB7OPa: \"x9f619\",\n    kMwMTN: \"x1w5n3ug\",\n    kkrTdU: \"x1ypdohk\",\n    k1xSpc: \"x78zum5\",\n    k3XXqK: \"x1t137rt\",\n    kVAEAm: \"x1n2onr6\",\n    kMnn75: \"xkrqix3\",\n    $$css: true\n  },\n  pill: {\n    kWkggS: \"xjbqb8w\",\n    kaIpWk: \"x1dkaolv\",\n    kB7OPa: \"x9f619\",\n    kMwMTN: \"x1w5n3ug\",\n    $$css: true\n  }\n};\n\n// The navigation bar's destination: vertical below the medium breakpoint and\n// horizontal at it and above, so every value that differs is a pair.\nconst barItemStyles = {\n  indicator: {\n    kGNEyG: \"x6s0dn4\",\n    kZKoxP: \"x10w6t97 x10qpgbh\",\n    kaIpWk: \"x1dkaolv\",\n    kB7OPa: \"x9f619\",\n    k1xSpc: \"x78zum5\",\n    kmuXW: \"x2lah0s\",\n    kzqmXN: \"x15yg21f x11lewyt\",\n    kjj79g: \"xl56j7k\",\n    $$css: true\n  },\n  indicatorCurrent: {\n    kWkggS: \"x15dekr4 x8jqrm0\",\n    kVAM5u: \"x1n2ykn\",\n    ksu8eU: \"xx61lck xnqlxux\",\n    kMzoRj: \"x2h6xq1\",\n    kMwMTN: \"x1sawysd\",\n    $$css: true\n  },\n  indicatorFocused: {\n    kWkggS: \"x1syr9su x8jqrm0\",\n    $$css: true\n  },\n  indicatorFocusedCurrent: {\n    kWkggS: \"x1s5x49g x8jqrm0\",\n    $$css: true\n  },\n  indicatorHovered: {\n    kWkggS: \"x173luhf x8jqrm0\",\n    $$css: true\n  },\n  indicatorHoveredCurrent: {\n    kWkggS: \"x1fctxn6 x8jqrm0\",\n    $$css: true\n  },\n  indicatorPressed: {\n    kWkggS: \"x1rydsgj x8jqrm0\",\n    $$css: true\n  },\n  indicatorPressedCurrent: {\n    kWkggS: \"xzpauq9 x8jqrm0\",\n    $$css: true\n  },\n  indicatorRing: {\n    kjBf7l: \"xrgy624\",\n    kInvED: \"x1hl8ikr\",\n    k3XXqK: \"xaatb59 x1t601oj\",\n    kMeerF: \"x1de99jn\",\n    $$css: true\n  },\n  item: {\n    kZKoxP: \"x5yr21d xiioxts\",\n    kaIpWk: \"x1dkaolv\",\n    kCS8Yb: \"x1r8uery x1a6ly76\",\n    kXwgrk: \"xdt5ytf xapwh9g\",\n    kzQI83: \"x1iyjqo2 x10cb59y\",\n    kOIVth: \"xzoy561\",\n    kjj79g: \"xl56j7k\",\n    k7Eaqz: \"xeuugli\",\n    k8WAf4: \"x1t0vds8 x1nouyz5\",\n    kg3NbH: \"xnjsko4 xze1m75\",\n    $$css: true\n  },\n  itemCurrent: {\n    kWkggS: \"xjbqb8w x1xec0pq\",\n    kVAM5u: \"x1n2ykn\",\n    ksu8eU: \"x1xldtvv x1wx4lrg\",\n    kMzoRj: \"x2h6xq1\",\n    $$css: true\n  },\n  itemFocused: {\n    kWkggS: \"xjbqb8w xdodzsd\",\n    $$css: true\n  },\n  itemFocusedCurrent: {\n    kWkggS: \"xjbqb8w xnmt8re\",\n    $$css: true\n  },\n  itemHovered: {\n    kWkggS: \"xjbqb8w xdenq60\",\n    $$css: true\n  },\n  itemHoveredCurrent: {\n    kWkggS: \"xjbqb8w xjq3nej\",\n    $$css: true\n  },\n  itemPressed: {\n    kWkggS: \"xjbqb8w x7fq6vu\",\n    $$css: true\n  },\n  itemPressedCurrent: {\n    kWkggS: \"xjbqb8w x9wewpu\",\n    $$css: true\n  },\n  itemRing: {\n    kjBf7l: \"xrgy624\",\n    kInvED: \"x1hl8ikr\",\n    k3XXqK: \"x1t137rt xxgb522\",\n    kMeerF: \"x1de99jn\",\n    $$css: true\n  },\n  label: {\n    kMv6JI: \"xp6n8n2\",\n    kGuDYH: \"xkucv67\",\n    k63SB2: \"x14hhc5u\",\n    kb6lSQ: \"x12utw95\",\n    kLWn49: \"xvzb9hk\",\n    ks0D6T: \"x193iq5w\",\n    $$css: true\n  },\n  labelCurrent: {\n    kMwMTN: \"xzakmg9 x16ybrrz\",\n    $$css: true\n  }\n};\n\n// The collapsed rail's destination: always vertical, the pitch from one to\n// the next the rail's 4dp gap.\nconst collapsedItemStyles = {\n  indicator: {\n    kGNEyG: \"x6s0dn4\",\n    kZKoxP: \"x10w6t97\",\n    kaIpWk: \"x1dkaolv\",\n    kB7OPa: \"x9f619\",\n    k1xSpc: \"x78zum5\",\n    kmuXW: \"x2lah0s\",\n    kzqmXN: \"x15yg21f\",\n    kjj79g: \"xl56j7k\",\n    $$css: true\n  },\n  indicatorCurrent: {\n    kWkggS: \"x15dekr4\",\n    kVAM5u: \"x1n2ykn\",\n    ksu8eU: \"xx61lck\",\n    kMzoRj: \"x2h6xq1\",\n    kMwMTN: \"x1sawysd\",\n    $$css: true\n  },\n  indicatorFocused: {\n    kWkggS: \"x1syr9su\",\n    $$css: true\n  },\n  indicatorFocusedCurrent: {\n    kWkggS: \"x1s5x49g\",\n    $$css: true\n  },\n  indicatorHovered: {\n    kWkggS: \"x173luhf\",\n    $$css: true\n  },\n  indicatorHoveredCurrent: {\n    kWkggS: \"x1fctxn6\",\n    $$css: true\n  },\n  indicatorPressed: {\n    kWkggS: \"x1rydsgj\",\n    $$css: true\n  },\n  indicatorPressedCurrent: {\n    kWkggS: \"xzpauq9\",\n    $$css: true\n  },\n  item: {\n    kXwgrk: \"xdt5ytf\",\n    kOIVth: \"xzoy561\",\n    kzqmXN: \"xh8yej3\",\n    kjj79g: \"xl56j7k\",\n    k8WAf4: \"x1t0vds8\",\n    kg3NbH: \"ximhkdq\",\n    $$css: true\n  },\n  itemCurrent: {\n    $$css: true\n  },\n  itemFocused: {\n    $$css: true\n  },\n  itemFocusedCurrent: {\n    $$css: true\n  },\n  itemHovered: {\n    $$css: true\n  },\n  itemHoveredCurrent: {\n    $$css: true\n  },\n  itemPressed: {\n    $$css: true\n  },\n  itemPressedCurrent: {\n    $$css: true\n  },\n  label: {\n    kMv6JI: \"xp6n8n2\",\n    kGuDYH: \"xkucv67\",\n    k63SB2: \"x14hhc5u\",\n    kb6lSQ: \"x12utw95\",\n    kLWn49: \"xvzb9hk\",\n    ks0D6T: \"x193iq5w\",\n    $$css: true\n  },\n  labelCurrent: {\n    kMwMTN: \"xzakmg9\",\n    $$css: true\n  }\n};\n\n// The expanded rail's destination: always horizontal, a 56dp pill as wide as\n// what it holds.\nconst expandedItemStyles = {\n  indicator: {\n    kGNEyG: \"x6s0dn4\",\n    k1xSpc: \"x78zum5\",\n    kmuXW: \"x2lah0s\",\n    $$css: true\n  },\n  indicatorCurrent: {\n    kMwMTN: \"x1sawysd\",\n    $$css: true\n  },\n  indicatorFocused: {\n    $$css: true\n  },\n  indicatorFocusedCurrent: {\n    $$css: true\n  },\n  indicatorHovered: {\n    $$css: true\n  },\n  indicatorHoveredCurrent: {\n    $$css: true\n  },\n  indicatorPressed: {\n    $$css: true\n  },\n  indicatorPressedCurrent: {\n    $$css: true\n  },\n  item: {\n    kSGwAc: \"xqcrz7y\",\n    kZKoxP: \"xnnlda6\",\n    kaIpWk: \"x1dkaolv\",\n    kXwgrk: \"x1q0g3np\",\n    kOIVth: \"x126z3so\",\n    ks0D6T: \"x193iq5w\",\n    kg3NbH: \"x790zyz\",\n    $$css: true\n  },\n  itemCurrent: {\n    kWkggS: \"x15dekr4\",\n    kVAM5u: \"x1n2ykn\",\n    ksu8eU: \"xx61lck\",\n    kMzoRj: \"x2h6xq1\",\n    $$css: true\n  },\n  itemFocused: {\n    kWkggS: \"x1syr9su\",\n    $$css: true\n  },\n  itemFocusedCurrent: {\n    kWkggS: \"x1s5x49g\",\n    $$css: true\n  },\n  itemHovered: {\n    kWkggS: \"x173luhf\",\n    $$css: true\n  },\n  itemHoveredCurrent: {\n    kWkggS: \"x1fctxn6\",\n    $$css: true\n  },\n  itemPressed: {\n    kWkggS: \"x1rydsgj\",\n    $$css: true\n  },\n  itemPressedCurrent: {\n    kWkggS: \"xzpauq9\",\n    $$css: true\n  },\n  label: {\n    kMv6JI: \"xkknnkr\",\n    kGuDYH: \"x14zspaw\",\n    k63SB2: \"x1v9cpvo\",\n    kb6lSQ: \"x155f00i\",\n    kLWn49: \"x1lz68p4\",\n    $$css: true\n  },\n  labelCurrent: {\n    kMwMTN: \"x1sawysd\",\n    $$css: true\n  }\n};\nexport { barItemStyles, collapsedItemStyles, expandedItemStyles, navigationItemStyles };"],"mappings":";;AA0C6B,GAAsBC,OAAOQ,uBAA6BJ,kBAAkBK;AAC5E,GAAsBT,OAAOQ,uBAA6BJ,kBAAkBO;AAC5E,GAAsBX,OAAOQ,uBAA6BJ,kBAAkBS;AAC5E,GAAsBb,OAAOQ,uBAA6BJ,kBAAkBK,QAAkBT,OAAOe;AACrG,GAAsBf,OAAOQ,uBAA6BJ,kBAAkBO,QAAkBX,OAAOe;AACrG,GAAsBf,OAAOQ,uBAA6BJ,kBAAkBS,UAAoBb,OAAOe;AAGpI,MAAMG,uBAAuB;CAC3BC,MAAM;EACJC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,OAAO;CACT;CACAC,cAAc;EACZC,QAAQ;EACRC,QAAQ;EACRH,OAAO;CACT;CACAI,OAAO;EACLF,QAAQ;EACRG,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRP,OAAO;CACT;CACAQ,MAAM;EACJZ,QAAQ;EACRa,QAAQ;EACRP,QAAQ;EACRC,QAAQ;EACRN,QAAQ;EACRa,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRZ,OAAO;CACT;CACAa,MAAM;EACJC,QAAQ;EACRC,QAAQ;EACRN,QAAQ;EACRP,QAAQ;EACRF,OAAO;CACT;AACF;AAIA,MAAMgB,gBAAgB;CACpBC,WAAW;EACTrB,QAAQ;EACRsB,QAAQ;EACRH,QAAQ;EACRN,QAAQ;EACRZ,QAAQ;EACRsB,OAAO;EACPC,QAAQ;EACRrB,QAAQ;EACRC,OAAO;CACT;CACAqB,kBAAkB;EAChBP,QAAQ;EACRQ,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRtB,QAAQ;EACRF,OAAO;CACT;CACAyB,kBAAkB;EAChBX,QAAQ;EACRd,OAAO;CACT;CACA0B,yBAAyB;EACvBZ,QAAQ;EACRd,OAAO;CACT;CACA2B,kBAAkB;EAChBb,QAAQ;EACRd,OAAO;CACT;CACA4B,yBAAyB;EACvBd,QAAQ;EACRd,OAAO;CACT;CACA6B,kBAAkB;EAChBf,QAAQ;EACRd,OAAO;CACT;CACA8B,yBAAyB;EACvBhB,QAAQ;EACRd,OAAO;CACT;CACA+B,eAAe;EACbC,QAAQ;EACRC,QAAQ;EACRvB,QAAQ;EACRwB,QAAQ;EACRlC,OAAO;CACT;CACAmC,MAAM;EACJjB,QAAQ;EACRH,QAAQ;EACRqB,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRxC,QAAQ;EACRyC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACR1C,OAAO;CACT;CACA2C,aAAa;EACX7B,QAAQ;EACRQ,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRxB,OAAO;CACT;CACA4C,aAAa;EACX9B,QAAQ;EACRd,OAAO;CACT;CACA6C,oBAAoB;EAClB/B,QAAQ;EACRd,OAAO;CACT;CACA8C,aAAa;EACXhC,QAAQ;EACRd,OAAO;CACT;CACA+C,oBAAoB;EAClBjC,QAAQ;EACRd,OAAO;CACT;CACAgD,aAAa;EACXlC,QAAQ;EACRd,OAAO;CACT;CACAiD,oBAAoB;EAClBnC,QAAQ;EACRd,OAAO;CACT;CACAkD,UAAU;EACRlB,QAAQ;EACRC,QAAQ;EACRvB,QAAQ;EACRwB,QAAQ;EACRlC,OAAO;CACT;CACAI,OAAO;EACL+C,QAAQ;EACRrD,QAAQ;EACRsD,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRvD,OAAO;CACT;CACAwD,cAAc;EACZtD,QAAQ;EACRF,OAAO;CACT;AACF;AAIA,MAAMyD,sBAAsB;CAC1BxC,WAAW;EACTrB,QAAQ;EACRsB,QAAQ;EACRH,QAAQ;EACRN,QAAQ;EACRZ,QAAQ;EACRsB,OAAO;EACPC,QAAQ;EACRrB,QAAQ;EACRC,OAAO;CACT;CACAqB,kBAAkB;EAChBP,QAAQ;EACRQ,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRtB,QAAQ;EACRF,OAAO;CACT;CACAyB,kBAAkB;EAChBX,QAAQ;EACRd,OAAO;CACT;CACA0B,yBAAyB;EACvBZ,QAAQ;EACRd,OAAO;CACT;CACA2B,kBAAkB;EAChBb,QAAQ;EACRd,OAAO;CACT;CACA4B,yBAAyB;EACvBd,QAAQ;EACRd,OAAO;CACT;CACA6B,kBAAkB;EAChBf,QAAQ;EACRd,OAAO;CACT;CACA8B,yBAAyB;EACvBhB,QAAQ;EACRd,OAAO;CACT;CACAmC,MAAM;EACJE,QAAQ;EACRE,QAAQ;EACRnB,QAAQ;EACRrB,QAAQ;EACR0C,QAAQ;EACRC,QAAQ;EACR1C,OAAO;CACT;CACA2C,aAAa,EACX3C,OAAO,KACT;CACA4C,aAAa,EACX5C,OAAO,KACT;CACA6C,oBAAoB,EAClB7C,OAAO,KACT;CACA8C,aAAa,EACX9C,OAAO,KACT;CACA+C,oBAAoB,EAClB/C,OAAO,KACT;CACAgD,aAAa,EACXhD,OAAO,KACT;CACAiD,oBAAoB,EAClBjD,OAAO,KACT;CACAI,OAAO;EACL+C,QAAQ;EACRrD,QAAQ;EACRsD,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRvD,OAAO;CACT;CACAwD,cAAc;EACZtD,QAAQ;EACRF,OAAO;CACT;AACF;AAIA,MAAM0D,qBAAqB;CACzBzC,WAAW;EACTrB,QAAQ;EACRC,QAAQ;EACRsB,OAAO;EACPnB,OAAO;CACT;CACAqB,kBAAkB;EAChBnB,QAAQ;EACRF,OAAO;CACT;CACAyB,kBAAkB,EAChBzB,OAAO,KACT;CACA0B,yBAAyB,EACvB1B,OAAO,KACT;CACA2B,kBAAkB,EAChB3B,OAAO,KACT;CACA4B,yBAAyB,EACvB5B,OAAO,KACT;CACA6B,kBAAkB,EAChB7B,OAAO,KACT;CACA8B,yBAAyB,EACvB9B,OAAO,KACT;CACAmC,MAAM;EACJwB,QAAQ;EACRzC,QAAQ;EACRH,QAAQ;EACRsB,QAAQ;EACRE,QAAQ;EACRgB,QAAQ;EACRb,QAAQ;EACR1C,OAAO;CACT;CACA2C,aAAa;EACX7B,QAAQ;EACRQ,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRxB,OAAO;CACT;CACA4C,aAAa;EACX9B,QAAQ;EACRd,OAAO;CACT;CACA6C,oBAAoB;EAClB/B,QAAQ;EACRd,OAAO;CACT;CACA8C,aAAa;EACXhC,QAAQ;EACRd,OAAO;CACT;CACA+C,oBAAoB;EAClBjC,QAAQ;EACRd,OAAO;CACT;CACAgD,aAAa;EACXlC,QAAQ;EACRd,OAAO;CACT;CACAiD,oBAAoB;EAClBnC,QAAQ;EACRd,OAAO;CACT;CACAI,OAAO;EACL+C,QAAQ;EACRrD,QAAQ;EACRsD,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRtD,OAAO;CACT;CACAwD,cAAc;EACZtD,QAAQ;EACRF,OAAO;CACT;AACF"}
+{"version":3,"file":"styles.js","names":["stylex","colors","media","radii","spacing","stateLayerOpacity","typography","FORCED_COLORS","HOVERED_OVER_NOTHING","onSecondaryContainer","hover","FOCUSED_OVER_NOTHING","focus","PRESSED_OVER_NOTHING","pressed","HOVERED_OVER_CURRENT","secondaryContainer","FOCUSED_OVER_CURRENT","PRESSED_OVER_CURRENT","navigationItemStyles","icon","kGNEyG","k1xSpc","kGuDYH","kjj79g","$$css","itemDisabled","kMwMTN","kkrTdU","label","kVQacm","kg5iWk","khDVqt","link","kB7OPa","k3XXqK","kVAEAm","kMnn75","pill","kWkggS","kaIpWk","barItemStyles","indicator","kZKoxP","kmuXW","kzqmXN","indicatorCurrent","kVAM5u","ksu8eU","kMzoRj","indicatorFocused","indicatorFocusedCurrent","indicatorHovered","indicatorHoveredCurrent","indicatorPressed","indicatorPressedCurrent","indicatorRing","kjBf7l","kInvED","kMeerF","item","kCS8Yb","kXwgrk","kzQI83","kOIVth","k7Eaqz","k8WAf4","kg3NbH","itemCurrent","itemFocused","itemFocusedCurrent","itemHovered","itemHoveredCurrent","itemPressed","itemPressedCurrent","itemRing","kMv6JI","k63SB2","kb6lSQ","kLWn49","ks0D6T","labelCurrent","collapsedItemStyles","expandedItemStyles","kSGwAc"],"sources":["../../src/navigation/styles.ts"],"sourcesContent":["import * as stylex from '@stylexjs/stylex';\nimport '../tokens/design.tokens.stylex';\nimport { colors, media, radii, spacing, stateLayerOpacity, typography } from '../tokens/design.tokens.stylex';\n\n// The destinations NavigationBar and NavigationRail both draw, in the three\n// forms the two pages give them. Apart from either component so the two\n// cannot drift, and outside `src/components` for the reason src/row gives.\n//\n// A vertical destination puts its icon in the page's 56dp by 32dp active\n// indicator with the label 4dp under it, in label medium: the navigation bar\n// below the medium breakpoint, and the collapsed rail. A horizontal one is a\n// pill holding the icon and the label side by side, 16dp in at either end:\n// the bar at and above the medium breakpoint at 40dp with 4dp between the\n// two, and the expanded rail at 56dp with 8dp between them, in label large.\n//\n// The current destination's pill is the secondary container, with its icon\n// in on secondary container and, under the pill, its label in secondary;\n// every other is on surface variant. A label set inside the pill, as a\n// horizontal destination sets it, takes on secondary container instead — the\n// library's own call. Secondary over secondary container is not a pair a\n// scheme is held to, and the Poster scheme's came to 4:1, short of the 4.5:1\n// text needs; on secondary container is the pair every scheme guarantees.\n//\n// The hover, focus and pressed layers are the on secondary container role\n// over whatever the pill is, at the pages' 8%, 10% and 10%, drawn on the\n// pill — the indicator in a vertical destination, the whole destination in a\n// horizontal one. They are applied in that order, so where two hold the\n// later wins, as the pages draw one layer at a time. A focused destination's\n// ring goes around the same pill; ./index.tsx says whose ring it is.\n//\n// Under forced colours the mode paints the secondary container over in its\n// background, which left the current destination looking like every other.\n// The pill takes a 2px border in `Highlight` there, which the mode keeps.\n\n// Windows High Contrast and the rest of the forced-colours modes. Spelled\n// here rather than imported, for the reason src/field/styles.ts records: the\n// StyleX compiler resolves a constant across files only out of a `.stylex.ts`\n// module, and the generated one holds design tokens rather than queries.\nconst FORCED_COLORS = '@media (forced-colors: active)';\n\n// The pill's ground and the layers over it, written out whole for each\n// ground, since StyleX replaces a property whole.\nconst HOVERED_OVER_NOTHING = `color-mix(in srgb, ${colors.onSecondaryContainer} calc(${stateLayerOpacity.hover} * 100%), transparent)`;\nconst FOCUSED_OVER_NOTHING = `color-mix(in srgb, ${colors.onSecondaryContainer} calc(${stateLayerOpacity.focus} * 100%), transparent)`;\nconst PRESSED_OVER_NOTHING = `color-mix(in srgb, ${colors.onSecondaryContainer} calc(${stateLayerOpacity.pressed} * 100%), transparent)`;\nconst HOVERED_OVER_CURRENT = `color-mix(in srgb, ${colors.onSecondaryContainer} calc(${stateLayerOpacity.hover} * 100%), ${colors.secondaryContainer})`;\nconst FOCUSED_OVER_CURRENT = `color-mix(in srgb, ${colors.onSecondaryContainer} calc(${stateLayerOpacity.focus} * 100%), ${colors.secondaryContainer})`;\nconst PRESSED_OVER_CURRENT = `color-mix(in srgb, ${colors.onSecondaryContainer} calc(${stateLayerOpacity.pressed} * 100%), ${colors.secondaryContainer})`;\n\n// What every destination draws whatever its form.\nconst navigationItemStyles = {\n  icon: {\n    kGNEyG: \"x6s0dn4\",\n    k1xSpc: \"x78zum5\",\n    kGuDYH: \"x1pvqxga\",\n    kjj79g: \"xl56j7k\",\n    $$css: true\n  },\n  itemDisabled: {\n    kMwMTN: \"x1gpw424 x1bhcspo\",\n    kkrTdU: \"xt0e3qv\",\n    $$css: true\n  },\n  label: {\n    kMwMTN: \"x1w5n3ug\",\n    kVQacm: \"xb3r6kr\",\n    kg5iWk: \"xlyipyv\",\n    khDVqt: \"xuxw1ft\",\n    $$css: true\n  },\n  link: {\n    kGNEyG: \"x6s0dn4\",\n    kB7OPa: \"x9f619\",\n    kMwMTN: \"x1w5n3ug\",\n    kkrTdU: \"x1ypdohk\",\n    k1xSpc: \"x78zum5\",\n    k3XXqK: \"x1t137rt\",\n    kVAEAm: \"x1n2onr6\",\n    kMnn75: \"xkrqix3\",\n    $$css: true\n  },\n  pill: {\n    kWkggS: \"xjbqb8w\",\n    kaIpWk: \"x1dkaolv\",\n    kB7OPa: \"x9f619\",\n    kMwMTN: \"x1w5n3ug\",\n    $$css: true\n  }\n};\n\n// The navigation bar's destination: vertical below the medium breakpoint and\n// horizontal at it and above, so every value that differs is a pair.\nconst barItemStyles = {\n  indicator: {\n    kGNEyG: \"x6s0dn4\",\n    kZKoxP: \"x10w6t97 x10qpgbh\",\n    kaIpWk: \"x1dkaolv\",\n    kB7OPa: \"x9f619\",\n    k1xSpc: \"x78zum5\",\n    kmuXW: \"x2lah0s\",\n    kzqmXN: \"x15yg21f x11lewyt\",\n    kjj79g: \"xl56j7k\",\n    $$css: true\n  },\n  indicatorCurrent: {\n    kWkggS: \"x15dekr4 x8jqrm0\",\n    kVAM5u: \"x1n2ykn\",\n    ksu8eU: \"xx61lck xnqlxux\",\n    kMzoRj: \"x2h6xq1\",\n    kMwMTN: \"x1sawysd\",\n    $$css: true\n  },\n  indicatorFocused: {\n    kWkggS: \"x1syr9su x8jqrm0\",\n    $$css: true\n  },\n  indicatorFocusedCurrent: {\n    kWkggS: \"x1s5x49g x8jqrm0\",\n    $$css: true\n  },\n  indicatorHovered: {\n    kWkggS: \"x173luhf x8jqrm0\",\n    $$css: true\n  },\n  indicatorHoveredCurrent: {\n    kWkggS: \"x1fctxn6 x8jqrm0\",\n    $$css: true\n  },\n  indicatorPressed: {\n    kWkggS: \"x1rydsgj x8jqrm0\",\n    $$css: true\n  },\n  indicatorPressedCurrent: {\n    kWkggS: \"xzpauq9 x8jqrm0\",\n    $$css: true\n  },\n  indicatorRing: {\n    kjBf7l: \"xrgy624\",\n    kInvED: \"x1hl8ikr\",\n    k3XXqK: \"xaatb59 x1t601oj\",\n    kMeerF: \"x1de99jn\",\n    $$css: true\n  },\n  item: {\n    kZKoxP: \"x5yr21d xiioxts\",\n    kaIpWk: \"x1dkaolv\",\n    kCS8Yb: \"x1r8uery x1a6ly76\",\n    kXwgrk: \"xdt5ytf xapwh9g\",\n    kzQI83: \"x1iyjqo2 x10cb59y\",\n    kOIVth: \"xzoy561\",\n    kjj79g: \"xl56j7k\",\n    k7Eaqz: \"xeuugli\",\n    k8WAf4: \"x1t0vds8 x1nouyz5\",\n    kg3NbH: \"xnjsko4 xze1m75\",\n    $$css: true\n  },\n  itemCurrent: {\n    kWkggS: \"xjbqb8w x1xec0pq\",\n    kVAM5u: \"x1n2ykn\",\n    ksu8eU: \"x1xldtvv x1wx4lrg\",\n    kMzoRj: \"x2h6xq1\",\n    $$css: true\n  },\n  itemFocused: {\n    kWkggS: \"xjbqb8w xdodzsd\",\n    $$css: true\n  },\n  itemFocusedCurrent: {\n    kWkggS: \"xjbqb8w xnmt8re\",\n    $$css: true\n  },\n  itemHovered: {\n    kWkggS: \"xjbqb8w xdenq60\",\n    $$css: true\n  },\n  itemHoveredCurrent: {\n    kWkggS: \"xjbqb8w xjq3nej\",\n    $$css: true\n  },\n  itemPressed: {\n    kWkggS: \"xjbqb8w x7fq6vu\",\n    $$css: true\n  },\n  itemPressedCurrent: {\n    kWkggS: \"xjbqb8w x9wewpu\",\n    $$css: true\n  },\n  itemRing: {\n    kjBf7l: \"xrgy624\",\n    kInvED: \"x1hl8ikr\",\n    k3XXqK: \"x1t137rt xxgb522\",\n    kMeerF: \"x1de99jn\",\n    $$css: true\n  },\n  label: {\n    kMv6JI: \"xp6n8n2\",\n    kGuDYH: \"xkucv67\",\n    k63SB2: \"x14hhc5u\",\n    kb6lSQ: \"x12utw95\",\n    kLWn49: \"xvzb9hk\",\n    ks0D6T: \"x193iq5w\",\n    $$css: true\n  },\n  labelCurrent: {\n    kMwMTN: \"xzakmg9 x16ybrrz\",\n    $$css: true\n  }\n};\n\n// The collapsed rail's destination: always vertical, the pitch from one to\n// the next the rail's 4dp gap.\nconst collapsedItemStyles = {\n  indicator: {\n    kGNEyG: \"x6s0dn4\",\n    kZKoxP: \"x10w6t97\",\n    kaIpWk: \"x1dkaolv\",\n    kB7OPa: \"x9f619\",\n    k1xSpc: \"x78zum5\",\n    kmuXW: \"x2lah0s\",\n    kzqmXN: \"x15yg21f\",\n    kjj79g: \"xl56j7k\",\n    $$css: true\n  },\n  indicatorCurrent: {\n    kWkggS: \"x15dekr4\",\n    kVAM5u: \"x1n2ykn\",\n    ksu8eU: \"xx61lck\",\n    kMzoRj: \"x2h6xq1\",\n    kMwMTN: \"x1sawysd\",\n    $$css: true\n  },\n  indicatorFocused: {\n    kWkggS: \"x1syr9su\",\n    $$css: true\n  },\n  indicatorFocusedCurrent: {\n    kWkggS: \"x1s5x49g\",\n    $$css: true\n  },\n  indicatorHovered: {\n    kWkggS: \"x173luhf\",\n    $$css: true\n  },\n  indicatorHoveredCurrent: {\n    kWkggS: \"x1fctxn6\",\n    $$css: true\n  },\n  indicatorPressed: {\n    kWkggS: \"x1rydsgj\",\n    $$css: true\n  },\n  indicatorPressedCurrent: {\n    kWkggS: \"xzpauq9\",\n    $$css: true\n  },\n  item: {\n    kXwgrk: \"xdt5ytf\",\n    kOIVth: \"xzoy561\",\n    kzqmXN: \"xh8yej3\",\n    kjj79g: \"xl56j7k\",\n    k8WAf4: \"x1t0vds8\",\n    kg3NbH: \"ximhkdq\",\n    $$css: true\n  },\n  itemCurrent: {\n    $$css: true\n  },\n  itemFocused: {\n    $$css: true\n  },\n  itemFocusedCurrent: {\n    $$css: true\n  },\n  itemHovered: {\n    $$css: true\n  },\n  itemHoveredCurrent: {\n    $$css: true\n  },\n  itemPressed: {\n    $$css: true\n  },\n  itemPressedCurrent: {\n    $$css: true\n  },\n  label: {\n    kMv6JI: \"xp6n8n2\",\n    kGuDYH: \"xkucv67\",\n    k63SB2: \"x14hhc5u\",\n    kb6lSQ: \"x12utw95\",\n    kLWn49: \"xvzb9hk\",\n    ks0D6T: \"x193iq5w\",\n    $$css: true\n  },\n  labelCurrent: {\n    kMwMTN: \"xzakmg9\",\n    $$css: true\n  }\n};\n\n// The expanded rail's destination: always horizontal, a 56dp pill as wide as\n// what it holds.\nconst expandedItemStyles = {\n  indicator: {\n    kGNEyG: \"x6s0dn4\",\n    k1xSpc: \"x78zum5\",\n    kmuXW: \"x2lah0s\",\n    $$css: true\n  },\n  indicatorCurrent: {\n    kMwMTN: \"x1sawysd\",\n    $$css: true\n  },\n  indicatorFocused: {\n    $$css: true\n  },\n  indicatorFocusedCurrent: {\n    $$css: true\n  },\n  indicatorHovered: {\n    $$css: true\n  },\n  indicatorHoveredCurrent: {\n    $$css: true\n  },\n  indicatorPressed: {\n    $$css: true\n  },\n  indicatorPressedCurrent: {\n    $$css: true\n  },\n  item: {\n    kSGwAc: \"xqcrz7y\",\n    kZKoxP: \"xnnlda6\",\n    kaIpWk: \"x1dkaolv\",\n    kXwgrk: \"x1q0g3np\",\n    kOIVth: \"x126z3so\",\n    ks0D6T: \"x193iq5w\",\n    kg3NbH: \"x790zyz\",\n    $$css: true\n  },\n  itemCurrent: {\n    kWkggS: \"x15dekr4\",\n    kVAM5u: \"x1n2ykn\",\n    ksu8eU: \"xx61lck\",\n    kMzoRj: \"x2h6xq1\",\n    $$css: true\n  },\n  itemFocused: {\n    kWkggS: \"x1syr9su\",\n    $$css: true\n  },\n  itemFocusedCurrent: {\n    kWkggS: \"x1s5x49g\",\n    $$css: true\n  },\n  itemHovered: {\n    kWkggS: \"x173luhf\",\n    $$css: true\n  },\n  itemHoveredCurrent: {\n    kWkggS: \"x1fctxn6\",\n    $$css: true\n  },\n  itemPressed: {\n    kWkggS: \"x1rydsgj\",\n    $$css: true\n  },\n  itemPressedCurrent: {\n    kWkggS: \"xzpauq9\",\n    $$css: true\n  },\n  label: {\n    kMv6JI: \"xkknnkr\",\n    kGuDYH: \"x14zspaw\",\n    k63SB2: \"x1v9cpvo\",\n    kb6lSQ: \"x155f00i\",\n    kLWn49: \"x1lz68p4\",\n    $$css: true\n  },\n  labelCurrent: {\n    kMwMTN: \"x1sawysd\",\n    $$css: true\n  }\n};\nexport { barItemStyles, collapsedItemStyles, expandedItemStyles, navigationItemStyles };"],"mappings":"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"}

package/dist/row/styles.js

@@ -17,7 +17,7 @@ const rowStyles = {
 	},
 	disabled: {
 		kWkggS: "xjbqb8w",
-		kMwMTN: "x1xj74d8",
+		kMwMTN: "x1xj74d8 x1bhcspo",
 		kkrTdU: "x1h6gzvc",
 		kAXs8y: "xr5dkdi",
 		$$css: true

package/dist/row/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","names":["stylex","colors","radii","shadows","sizing","spacing","stateLayerOpacity","typography","HOVER_CAPABLE","FORCED_COLORS","rowStyles","base","kGNEyG","kWkggS","kMzoRj","kB7OPa","kMwMTN","k1xSpc","kOIVth","kzqmXN","k8WAf4","kg3NbH","kVAEAm","k9WMMc","$$css","disabled","kkrTdU","kAXs8y","dragging","kKwaWg","kGVxlE","kY2c9j","drawer","kaIpWk","kUOVxO","kAzted","dropTarget","kjBf7l","kInvED","k3XXqK","kMeerF","focusVisible","headlineEmphasis","k63SB2","headlineList","kMv6JI","kGuDYH","kb6lSQ","kLWn49","headlineMenu","hovered","interactive","kVVagm","interactiveLayers","list","main","kXwgrk","kzQI83","k7Eaqz","menu","overline","pressed","selectedDrawer","selectedList","selectedMenu","slot","kmuXW","supporting","supportingInherit","supportingSelectedDrawer","supportingSelectedList","supportingSelectedMenu","threeLine","twoLine"],"sources":["../../src/row/styles.ts"],"sourcesContent":["import * as stylex from '@stylexjs/stylex';\nimport '../tokens/design.tokens.stylex';\nimport { colors, radii, shadows, sizing, spacing, stateLayerOpacity, typography } from '../tokens/design.tokens.stylex';\n\n// The row every list draws: ListItem's, and from here on the item of every\n// collection the coverage plan adds — ListBox, Menu, List, Tree, the options\n// of Select and ComboBox. Apart from the RowContent component in ./index.tsx\n// so that file exports components alone, which is what keeps fast refresh\n// working for it.\n//\n// Three variants, because three spec pages draw three rows. The lists page\n// gives a list item a 56dp floor, a body-large headline and a body-medium\n// supporting line, and primary container when selected. The menus page gives\n// a menu item 48dp, a label-large label, and tertiary container when\n// selected. The navigation drawer page gives its row 56dp too, with a\n// label-large label like a menu's, and marks the current one with a\n// secondary-container pill held 12dp off each edge — 336dp of indicator in a\n// 360dp container, which is what that inset comes to. The layout, the\n// padding, the state layers and the disabled treatment are one row; `list`,\n// `menu` and `drawer` carry only what the three pages disagree on, and a\n// consumer applies one of them beside `base`.\n//\n// Laid out with flex rather than the grid the design draws. The design's\n// three columns are `auto 1fr auto`, which is what flex does natively — and\n// unlike a fixed three-column grid it stays correct when a row has no leading\n// or no trailing content, where the remaining children would otherwise slide\n// into the wrong columns.\n//\n// Rows align with each other through their leading content being the same\n// size, not through a fixed column width: a list of Avatars all at one size\n// lines up, and that is the same thing the design's 40px column achieves.\n//\n// The state layer composites over `transparent` rather than over a container\n// colour, because a row's own background is transparent and it therefore\n// tints whatever it happens to be sitting on — a card, a menu, or the page.\n// The two selected states are the ones that bring a container of their own.\n\n// A pointer that can hover, for `interactiveLayers` — a plain element with no\n// render state, so its hover layer is a pseudo-class, and Chromium leaves\n// `:hover` on whatever a touch last tapped. Inside this query a touch screen\n// draws no hover at all; a touchscreen laptop still matches it for its\n// trackpad.\nconst HOVER_CAPABLE = '@media (hover: hover)';\n\n// Windows High Contrast and the rest of the forced-colours modes. Spelled\n// here rather than imported, for the reason src/field/styles.ts records: the\n// StyleX compiler resolves a constant across files only out of a `.stylex.ts`\n// module, and the generated one holds design tokens rather than queries.\nconst FORCED_COLORS = '@media (forced-colors: active)';\nconst rowStyles = {\n  base: {\n    kGNEyG: \"x6s0dn4\",\n    kWkggS: \"xjbqb8w\",\n    kMzoRj: \"xc342km\",\n    kB7OPa: \"x9f619\",\n    kMwMTN: \"x139gbkf\",\n    k1xSpc: \"x78zum5\",\n    kOIVth: \"xxj4525\",\n    kzqmXN: \"xh8yej3\",\n    k8WAf4: \"x1uvvd8r\",\n    kg3NbH: \"x790zyz\",\n    kVAEAm: \"x1n2onr6\",\n    k9WMMc: \"x1yc453h\",\n    $$css: true\n  },\n  disabled: {\n    kWkggS: \"xjbqb8w\",\n    kMwMTN: \"x1xj74d8\",\n    kkrTdU: \"x1h6gzvc\",\n    kAXs8y: \"xr5dkdi\",\n    $$css: true\n  },\n  dragging: {\n    kWkggS: \"x14s9m32\",\n    kKwaWg: \"xdiex0u\",\n    kGVxlE: \"x4r79n0\",\n    kY2c9j: \"x1vjfegm\",\n    $$css: true\n  },\n  drawer: {\n    kaIpWk: \"x1dkaolv\",\n    kzqmXN: \"x14atkfc\",\n    kUOVxO: \"xd2r6sq\",\n    kAzted: \"xyax5pk\",\n    $$css: true\n  },\n  dropTarget: {\n    kKwaWg: \"xu73ib2\",\n    kjBf7l: \"xrgy624 x1x84bn5\",\n    kInvED: \"x2ssjo2\",\n    k3XXqK: \"xaatb59\",\n    kMeerF: \"x1de99jn\",\n    $$css: true\n  },\n  focusVisible: {\n    kKwaWg: \"x17vw94z\",\n    kjBf7l: \"xrgy624 x1v8yhc2\",\n    kInvED: \"x2ssjo2\",\n    k3XXqK: \"xaatb59\",\n    kMeerF: \"x1de99jn\",\n    $$css: true\n  },\n  headlineEmphasis: {\n    k63SB2: \"x1sfltvt\",\n    $$css: true\n  },\n  headlineList: {\n    kMv6JI: \"x16svsjw\",\n    kGuDYH: \"x1848etk\",\n    k63SB2: \"x1c52epr\",\n    kb6lSQ: \"x1qn8t5l\",\n    kLWn49: \"xh7dzej\",\n    $$css: true\n  },\n  headlineMenu: {\n    kMv6JI: \"xkknnkr\",\n    kGuDYH: \"x14zspaw\",\n    k63SB2: \"x1v9cpvo\",\n    kb6lSQ: \"x155f00i\",\n    kLWn49: \"x1lz68p4\",\n    $$css: true\n  },\n  hovered: {\n    kKwaWg: \"xbmfk57\",\n    kkrTdU: \"x1ypdohk\",\n    $$css: true\n  },\n  interactive: {\n    kkrTdU: \"x1ypdohk\",\n    kVVagm: \"xln7xf2\",\n    kjBf7l: \"xrgy624\",\n    kInvED: \"x2ssjo2\",\n    k3XXqK: \"x9v5kkp x1t137rt\",\n    kMeerF: \"x1de99jn\",\n    $$css: true\n  },\n  interactiveLayers: {\n    kWkggS: \"x83qkoq x1yl1wq7 xjqqt44 xjbqb8w\",\n    $$css: true\n  },\n  list: {\n    kAzted: \"xyax5pk\",\n    $$css: true\n  },\n  main: {\n    k1xSpc: \"x78zum5\",\n    kXwgrk: \"xdt5ytf\",\n    kzQI83: \"x1iyjqo2\",\n    kOIVth: \"x14qo01y\",\n    k7Eaqz: \"xeuugli\",\n    $$css: true\n  },\n  menu: {\n    kAzted: \"x1ddmzdj\",\n    $$css: true\n  },\n  overline: {\n    kMwMTN: \"x1w5n3ug\",\n    kMv6JI: \"xs1w0rn\",\n    kGuDYH: \"x1n35her\",\n    k63SB2: \"x1su64ma\",\n    kb6lSQ: \"xdlnduh\",\n    kLWn49: \"xaomhve\",\n    $$css: true\n  },\n  pressed: {\n    kKwaWg: \"xdiex0u\",\n    $$css: true\n  },\n  selectedDrawer: {\n    kWkggS: \"x15dekr4 x1jzqe4\",\n    kMwMTN: \"x1sawysd x1k5gbb1\",\n    kAXs8y: \"x1g12otp\",\n    $$css: true\n  },\n  selectedList: {\n    kWkggS: \"xp89om9 x1jzqe4\",\n    kMwMTN: \"xscdzaa x1k5gbb1\",\n    kAXs8y: \"x1g12otp\",\n    $$css: true\n  },\n  selectedMenu: {\n    kWkggS: \"xs6yvni x1jzqe4\",\n    kMwMTN: \"x3cbcwg x1k5gbb1\",\n    kAXs8y: \"x1g12otp\",\n    $$css: true\n  },\n  slot: {\n    kGNEyG: \"x6s0dn4\",\n    k1xSpc: \"x78zum5\",\n    kmuXW: \"x2lah0s\",\n    $$css: true\n  },\n  supporting: {\n    kMwMTN: \"x1w5n3ug\",\n    kMv6JI: \"xpo2rfv\",\n    kGuDYH: \"x193rfdd\",\n    k63SB2: \"x1hews6w\",\n    kb6lSQ: \"xn43zvd\",\n    kLWn49: \"xv61bfh\",\n    $$css: true\n  },\n  supportingInherit: {\n    kMwMTN: \"x1heor9g\",\n    $$css: true\n  },\n  supportingSelectedDrawer: {\n    kMwMTN: \"x1sawysd x1k5gbb1\",\n    $$css: true\n  },\n  supportingSelectedList: {\n    kMwMTN: \"xscdzaa x1k5gbb1\",\n    $$css: true\n  },\n  supportingSelectedMenu: {\n    kMwMTN: \"x3cbcwg x1k5gbb1\",\n    $$css: true\n  },\n  threeLine: {\n    kGNEyG: \"x1cy8zhl\",\n    kAzted: \"x1bt55z4\",\n    $$css: true\n  },\n  twoLine: {\n    kAzted: \"x304zwk\",\n    $$css: true\n  }\n};\nexport { rowStyles };"],"mappings":";AAiDA,MAAMU,YAAY;CAChBC,MAAM;EACJC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,OAAO;CACT;CACAC,UAAU;EACRZ,QAAQ;EACRG,QAAQ;EACRU,QAAQ;EACRC,QAAQ;EACRH,OAAO;CACT;CACAI,UAAU;EACRf,QAAQ;EACRgB,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRP,OAAO;CACT;CACAQ,QAAQ;EACNC,QAAQ;EACRd,QAAQ;EACRe,QAAQ;EACRC,QAAQ;EACRX,OAAO;CACT;CACAY,YAAY;EACVP,QAAQ;EACRQ,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRhB,OAAO;CACT;CACAiB,cAAc;EACZZ,QAAQ;EACRQ,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRhB,OAAO;CACT;CACAkB,kBAAkB;EAChBC,QAAQ;EACRnB,OAAO;CACT;CACAoB,cAAc;EACZC,QAAQ;EACRC,QAAQ;EACRH,QAAQ;EACRI,QAAQ;EACRC,QAAQ;EACRxB,OAAO;CACT;CACAyB,cAAc;EACZJ,QAAQ;EACRC,QAAQ;EACRH,QAAQ;EACRI,QAAQ;EACRC,QAAQ;EACRxB,OAAO;CACT;CACA0B,SAAS;EACPrB,QAAQ;EACRH,QAAQ;EACRF,OAAO;CACT;CACA2B,aAAa;EACXzB,QAAQ;EACR0B,QAAQ;EACRf,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRhB,OAAO;CACT;CACA6B,mBAAmB;EACjBxC,QAAQ;EACRW,OAAO;CACT;CACA8B,MAAM;EACJnB,QAAQ;EACRX,OAAO;CACT;CACA+B,MAAM;EACJtC,QAAQ;EACRuC,QAAQ;EACRC,QAAQ;EACRvC,QAAQ;EACRwC,QAAQ;EACRlC,OAAO;CACT;CACAmC,MAAM;EACJxB,QAAQ;EACRX,OAAO;CACT;CACAoC,UAAU;EACR5C,QAAQ;EACR6B,QAAQ;EACRC,QAAQ;EACRH,QAAQ;EACRI,QAAQ;EACRC,QAAQ;EACRxB,OAAO;CACT;CACAqC,SAAS;EACPhC,QAAQ;EACRL,OAAO;CACT;CACAsC,gBAAgB;EACdjD,QAAQ;EACRG,QAAQ;EACRW,QAAQ;EACRH,OAAO;CACT;CACAuC,cAAc;EACZlD,QAAQ;EACRG,QAAQ;EACRW,QAAQ;EACRH,OAAO;CACT;CACAwC,cAAc;EACZnD,QAAQ;EACRG,QAAQ;EACRW,QAAQ;EACRH,OAAO;CACT;CACAyC,MAAM;EACJrD,QAAQ;EACRK,QAAQ;EACRiD,OAAO;EACP1C,OAAO;CACT;CACA2C,YAAY;EACVnD,QAAQ;EACR6B,QAAQ;EACRC,QAAQ;EACRH,QAAQ;EACRI,QAAQ;EACRC,QAAQ;EACRxB,OAAO;CACT;CACA4C,mBAAmB;EACjBpD,QAAQ;EACRQ,OAAO;CACT;CACA6C,0BAA0B;EACxBrD,QAAQ;EACRQ,OAAO;CACT;CACA8C,wBAAwB;EACtBtD,QAAQ;EACRQ,OAAO;CACT;CACA+C,wBAAwB;EACtBvD,QAAQ;EACRQ,OAAO;CACT;CACAgD,WAAW;EACT5D,QAAQ;EACRuB,QAAQ;EACRX,OAAO;CACT;CACAiD,SAAS;EACPtC,QAAQ;EACRX,OAAO;CACT;AACF"}
+{"version":3,"file":"styles.js","names":["stylex","colors","radii","shadows","sizing","spacing","stateLayerOpacity","typography","HOVER_CAPABLE","FORCED_COLORS","rowStyles","base","kGNEyG","kWkggS","kMzoRj","kB7OPa","kMwMTN","k1xSpc","kOIVth","kzqmXN","k8WAf4","kg3NbH","kVAEAm","k9WMMc","$$css","disabled","kkrTdU","kAXs8y","dragging","kKwaWg","kGVxlE","kY2c9j","drawer","kaIpWk","kUOVxO","kAzted","dropTarget","kjBf7l","kInvED","k3XXqK","kMeerF","focusVisible","headlineEmphasis","k63SB2","headlineList","kMv6JI","kGuDYH","kb6lSQ","kLWn49","headlineMenu","hovered","interactive","kVVagm","interactiveLayers","list","main","kXwgrk","kzQI83","k7Eaqz","menu","overline","pressed","selectedDrawer","selectedList","selectedMenu","slot","kmuXW","supporting","supportingInherit","supportingSelectedDrawer","supportingSelectedList","supportingSelectedMenu","threeLine","twoLine"],"sources":["../../src/row/styles.ts"],"sourcesContent":["import * as stylex from '@stylexjs/stylex';\nimport '../tokens/design.tokens.stylex';\nimport { colors, radii, shadows, sizing, spacing, stateLayerOpacity, typography } from '../tokens/design.tokens.stylex';\n\n// The row every list draws: ListItem's, and from here on the item of every\n// collection the coverage plan adds — ListBox, Menu, List, Tree, the options\n// of Select and ComboBox. Apart from the RowContent component in ./index.tsx\n// so that file exports components alone, which is what keeps fast refresh\n// working for it.\n//\n// Three variants, because three spec pages draw three rows. The lists page\n// gives a list item a 56dp floor, a body-large headline and a body-medium\n// supporting line, and primary container when selected. The menus page gives\n// a menu item 48dp, a label-large label, and tertiary container when\n// selected. The navigation drawer page gives its row 56dp too, with a\n// label-large label like a menu's, and marks the current one with a\n// secondary-container pill held 12dp off each edge — 336dp of indicator in a\n// 360dp container, which is what that inset comes to. The layout, the\n// padding, the state layers and the disabled treatment are one row; `list`,\n// `menu` and `drawer` carry only what the three pages disagree on, and a\n// consumer applies one of them beside `base`.\n//\n// Laid out with flex rather than the grid the design draws. The design's\n// three columns are `auto 1fr auto`, which is what flex does natively — and\n// unlike a fixed three-column grid it stays correct when a row has no leading\n// or no trailing content, where the remaining children would otherwise slide\n// into the wrong columns.\n//\n// Rows align with each other through their leading content being the same\n// size, not through a fixed column width: a list of Avatars all at one size\n// lines up, and that is the same thing the design's 40px column achieves.\n//\n// The state layer composites over `transparent` rather than over a container\n// colour, because a row's own background is transparent and it therefore\n// tints whatever it happens to be sitting on — a card, a menu, or the page.\n// The two selected states are the ones that bring a container of their own.\n\n// A pointer that can hover, for `interactiveLayers` — a plain element with no\n// render state, so its hover layer is a pseudo-class, and Chromium leaves\n// `:hover` on whatever a touch last tapped. Inside this query a touch screen\n// draws no hover at all; a touchscreen laptop still matches it for its\n// trackpad.\nconst HOVER_CAPABLE = '@media (hover: hover)';\n\n// Windows High Contrast and the rest of the forced-colours modes. Spelled\n// here rather than imported, for the reason src/field/styles.ts records: the\n// StyleX compiler resolves a constant across files only out of a `.stylex.ts`\n// module, and the generated one holds design tokens rather than queries.\nconst FORCED_COLORS = '@media (forced-colors: active)';\nconst rowStyles = {\n  base: {\n    kGNEyG: \"x6s0dn4\",\n    kWkggS: \"xjbqb8w\",\n    kMzoRj: \"xc342km\",\n    kB7OPa: \"x9f619\",\n    kMwMTN: \"x139gbkf\",\n    k1xSpc: \"x78zum5\",\n    kOIVth: \"xxj4525\",\n    kzqmXN: \"xh8yej3\",\n    k8WAf4: \"x1uvvd8r\",\n    kg3NbH: \"x790zyz\",\n    kVAEAm: \"x1n2onr6\",\n    k9WMMc: \"x1yc453h\",\n    $$css: true\n  },\n  disabled: {\n    kWkggS: \"xjbqb8w\",\n    kMwMTN: \"x1xj74d8 x1bhcspo\",\n    kkrTdU: \"x1h6gzvc\",\n    kAXs8y: \"xr5dkdi\",\n    $$css: true\n  },\n  dragging: {\n    kWkggS: \"x14s9m32\",\n    kKwaWg: \"xdiex0u\",\n    kGVxlE: \"x4r79n0\",\n    kY2c9j: \"x1vjfegm\",\n    $$css: true\n  },\n  drawer: {\n    kaIpWk: \"x1dkaolv\",\n    kzqmXN: \"x14atkfc\",\n    kUOVxO: \"xd2r6sq\",\n    kAzted: \"xyax5pk\",\n    $$css: true\n  },\n  dropTarget: {\n    kKwaWg: \"xu73ib2\",\n    kjBf7l: \"xrgy624 x1x84bn5\",\n    kInvED: \"x2ssjo2\",\n    k3XXqK: \"xaatb59\",\n    kMeerF: \"x1de99jn\",\n    $$css: true\n  },\n  focusVisible: {\n    kKwaWg: \"x17vw94z\",\n    kjBf7l: \"xrgy624 x1v8yhc2\",\n    kInvED: \"x2ssjo2\",\n    k3XXqK: \"xaatb59\",\n    kMeerF: \"x1de99jn\",\n    $$css: true\n  },\n  headlineEmphasis: {\n    k63SB2: \"x1sfltvt\",\n    $$css: true\n  },\n  headlineList: {\n    kMv6JI: \"x16svsjw\",\n    kGuDYH: \"x1848etk\",\n    k63SB2: \"x1c52epr\",\n    kb6lSQ: \"x1qn8t5l\",\n    kLWn49: \"xh7dzej\",\n    $$css: true\n  },\n  headlineMenu: {\n    kMv6JI: \"xkknnkr\",\n    kGuDYH: \"x14zspaw\",\n    k63SB2: \"x1v9cpvo\",\n    kb6lSQ: \"x155f00i\",\n    kLWn49: \"x1lz68p4\",\n    $$css: true\n  },\n  hovered: {\n    kKwaWg: \"xbmfk57\",\n    kkrTdU: \"x1ypdohk\",\n    $$css: true\n  },\n  interactive: {\n    kkrTdU: \"x1ypdohk\",\n    kVVagm: \"xln7xf2\",\n    kjBf7l: \"xrgy624\",\n    kInvED: \"x2ssjo2\",\n    k3XXqK: \"x9v5kkp x1t137rt\",\n    kMeerF: \"x1de99jn\",\n    $$css: true\n  },\n  interactiveLayers: {\n    kWkggS: \"x83qkoq x1yl1wq7 xjqqt44 xjbqb8w\",\n    $$css: true\n  },\n  list: {\n    kAzted: \"xyax5pk\",\n    $$css: true\n  },\n  main: {\n    k1xSpc: \"x78zum5\",\n    kXwgrk: \"xdt5ytf\",\n    kzQI83: \"x1iyjqo2\",\n    kOIVth: \"x14qo01y\",\n    k7Eaqz: \"xeuugli\",\n    $$css: true\n  },\n  menu: {\n    kAzted: \"x1ddmzdj\",\n    $$css: true\n  },\n  overline: {\n    kMwMTN: \"x1w5n3ug\",\n    kMv6JI: \"xs1w0rn\",\n    kGuDYH: \"x1n35her\",\n    k63SB2: \"x1su64ma\",\n    kb6lSQ: \"xdlnduh\",\n    kLWn49: \"xaomhve\",\n    $$css: true\n  },\n  pressed: {\n    kKwaWg: \"xdiex0u\",\n    $$css: true\n  },\n  selectedDrawer: {\n    kWkggS: \"x15dekr4 x1jzqe4\",\n    kMwMTN: \"x1sawysd x1k5gbb1\",\n    kAXs8y: \"x1g12otp\",\n    $$css: true\n  },\n  selectedList: {\n    kWkggS: \"xp89om9 x1jzqe4\",\n    kMwMTN: \"xscdzaa x1k5gbb1\",\n    kAXs8y: \"x1g12otp\",\n    $$css: true\n  },\n  selectedMenu: {\n    kWkggS: \"xs6yvni x1jzqe4\",\n    kMwMTN: \"x3cbcwg x1k5gbb1\",\n    kAXs8y: \"x1g12otp\",\n    $$css: true\n  },\n  slot: {\n    kGNEyG: \"x6s0dn4\",\n    k1xSpc: \"x78zum5\",\n    kmuXW: \"x2lah0s\",\n    $$css: true\n  },\n  supporting: {\n    kMwMTN: \"x1w5n3ug\",\n    kMv6JI: \"xpo2rfv\",\n    kGuDYH: \"x193rfdd\",\n    k63SB2: \"x1hews6w\",\n    kb6lSQ: \"xn43zvd\",\n    kLWn49: \"xv61bfh\",\n    $$css: true\n  },\n  supportingInherit: {\n    kMwMTN: \"x1heor9g\",\n    $$css: true\n  },\n  supportingSelectedDrawer: {\n    kMwMTN: \"x1sawysd x1k5gbb1\",\n    $$css: true\n  },\n  supportingSelectedList: {\n    kMwMTN: \"xscdzaa x1k5gbb1\",\n    $$css: true\n  },\n  supportingSelectedMenu: {\n    kMwMTN: \"x3cbcwg x1k5gbb1\",\n    $$css: true\n  },\n  threeLine: {\n    kGNEyG: \"x1cy8zhl\",\n    kAzted: \"x1bt55z4\",\n    $$css: true\n  },\n  twoLine: {\n    kAzted: \"x304zwk\",\n    $$css: true\n  }\n};\nexport { rowStyles };"],"mappings":";AAiDA,MAAMU,YAAY;CAChBC,MAAM;EACJC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,OAAO;CACT;CACAC,UAAU;EACRZ,QAAQ;EACRG,QAAQ;EACRU,QAAQ;EACRC,QAAQ;EACRH,OAAO;CACT;CACAI,UAAU;EACRf,QAAQ;EACRgB,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRP,OAAO;CACT;CACAQ,QAAQ;EACNC,QAAQ;EACRd,QAAQ;EACRe,QAAQ;EACRC,QAAQ;EACRX,OAAO;CACT;CACAY,YAAY;EACVP,QAAQ;EACRQ,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRhB,OAAO;CACT;CACAiB,cAAc;EACZZ,QAAQ;EACRQ,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRhB,OAAO;CACT;CACAkB,kBAAkB;EAChBC,QAAQ;EACRnB,OAAO;CACT;CACAoB,cAAc;EACZC,QAAQ;EACRC,QAAQ;EACRH,QAAQ;EACRI,QAAQ;EACRC,QAAQ;EACRxB,OAAO;CACT;CACAyB,cAAc;EACZJ,QAAQ;EACRC,QAAQ;EACRH,QAAQ;EACRI,QAAQ;EACRC,QAAQ;EACRxB,OAAO;CACT;CACA0B,SAAS;EACPrB,QAAQ;EACRH,QAAQ;EACRF,OAAO;CACT;CACA2B,aAAa;EACXzB,QAAQ;EACR0B,QAAQ;EACRf,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRhB,OAAO;CACT;CACA6B,mBAAmB;EACjBxC,QAAQ;EACRW,OAAO;CACT;CACA8B,MAAM;EACJnB,QAAQ;EACRX,OAAO;CACT;CACA+B,MAAM;EACJtC,QAAQ;EACRuC,QAAQ;EACRC,QAAQ;EACRvC,QAAQ;EACRwC,QAAQ;EACRlC,OAAO;CACT;CACAmC,MAAM;EACJxB,QAAQ;EACRX,OAAO;CACT;CACAoC,UAAU;EACR5C,QAAQ;EACR6B,QAAQ;EACRC,QAAQ;EACRH,QAAQ;EACRI,QAAQ;EACRC,QAAQ;EACRxB,OAAO;CACT;CACAqC,SAAS;EACPhC,QAAQ;EACRL,OAAO;CACT;CACAsC,gBAAgB;EACdjD,QAAQ;EACRG,QAAQ;EACRW,QAAQ;EACRH,OAAO;CACT;CACAuC,cAAc;EACZlD,QAAQ;EACRG,QAAQ;EACRW,QAAQ;EACRH,OAAO;CACT;CACAwC,cAAc;EACZnD,QAAQ;EACRG,QAAQ;EACRW,QAAQ;EACRH,OAAO;CACT;CACAyC,MAAM;EACJrD,QAAQ;EACRK,QAAQ;EACRiD,OAAO;EACP1C,OAAO;CACT;CACA2C,YAAY;EACVnD,QAAQ;EACR6B,QAAQ;EACRC,QAAQ;EACRH,QAAQ;EACRI,QAAQ;EACRC,QAAQ;EACRxB,OAAO;CACT;CACA4C,mBAAmB;EACjBpD,QAAQ;EACRQ,OAAO;CACT;CACA6C,0BAA0B;EACxBrD,QAAQ;EACRQ,OAAO;CACT;CACA8C,wBAAwB;EACtBtD,QAAQ;EACRQ,OAAO;CACT;CACA+C,wBAAwB;EACtBvD,QAAQ;EACRQ,OAAO;CACT;CACAgD,WAAW;EACT5D,QAAQ;EACRuB,QAAQ;EACRX,OAAO;CACT;CACAiD,SAAS;EACPtC,QAAQ;EACRX,OAAO;CACT;AACF"}

package/dist/styles/overlay.js

@@ -63,6 +63,7 @@ const overlay = {
 		kB7OPa: "x9f619",
 		kpwlN0: "x10a8y8t",
 		kVAEAm: "xixxii4",
+		kY2c9j: "x125h2g0",
 		$$css: true
 	}
 };

package/dist/styles/overlay.js.map

@@ -1 +1 @@
-{"version":3,"file":"overlay.js","names":["PopoverRenderProps","stylex","colors","motion","radii","shadows","spacing","FORCED_COLORS","fadeIn","scaleIn","overlay","fromBottom","k3nNDw","$$css","fromLeft","fromRight","fromTop","modalBodyRing","kjBf7l","kInvED","k3XXqK","kMeerF","modalDialog","kZKoxP","kB7OPa","k1xSpc","kXwgrk","kAzted","popup","k44tkh","kKVMdj","kyAemX","kWkggS","kVAM5u","kaIpWk","ksu8eU","kMzoRj","kGVxlE","kMwMTN","kORKVm","kZeWKH","popupDialog","kOIVth","scrim","kpwlN0","kVAEAm","origins","bottom","center","left","right","top","OverlayAlign","OverlaySide","placementOf","side","align","const","popupOrigin","placement"],"sources":["../../src/styles/overlay.ts"],"sourcesContent":["import type { PopoverRenderProps } from 'react-aria-components';\nimport * as stylex from '@stylexjs/stylex';\nimport '../tokens/design.tokens.stylex';\nimport { colors, motion, radii, shadows, spacing } from '../tokens/design.tokens.stylex';\n\n// Windows High Contrast and the rest of the forced-colours modes. Spelled\n// here rather than imported, for the reason src/field/styles.ts records: the\n// StyleX compiler resolves a constant across files only out of a `.stylex.ts`\n// module, and the generated one holds design tokens rather than queries.\nconst FORCED_COLORS = '@media (forced-colors: active)';\n\n// What every overlay shares, drawn once. Popover's anchored surface and its\n// entry, Sheet's scrim, and the element that carries the dialog role inside\n// each of them; the coverage plan brings a dozen more overlays — Menu, Select,\n// ComboBox, Tooltip, the date pickers, Dialog — and each would otherwise have\n// written the same surface and the same scrim a second time. Geometry stays\n// with the component: how wide a popover is, which edge a sheet is pinned to,\n// where a dialog sits, are each overlay's own decision.\n//\n// Every one of these is portalled to the end of the body, which is why each\n// component takes a `container` prop and documents the same caveat: an app\n// that scopes its StyleX theme to a subtree has to point the portal inside it,\n// or the surface renders outside the theme and falls back to the tokens'\n// `prefers-color-scheme` default.\n//\n// Entry only, and no exit animation, for the same reason in every overlay:\n// React Aria keeps a closing surface mounted only while an animation is\n// running on it, and a popover in particular is dismissed far more often than\n// it is closed deliberately — usually by pressing something else, where a\n// lingering surface is in the way of whatever the press was for.\n\n// The scrim settles before the panel it sits behind arrives: shorter than\n// any panel's entry, so the two do not finish together.\nconst fadeIn = \"x18re5ia-B\";\n\n// An anchored surface grows from the edge it is anchored by rather than from\n// its own centre, which is what makes it read as coming out of the trigger.\n// The origin is a separate style, chosen from the placement React Aria\n// reports, so the same keyframes serve all four sides.\nconst scaleIn = \"x1k48ry3-B\";\nconst overlay = {\n  fromBottom: {\n    k3nNDw: \"x18ouj0k\",\n    $$css: true\n  },\n  fromLeft: {\n    k3nNDw: \"x1nf803f\",\n    $$css: true\n  },\n  fromRight: {\n    k3nNDw: \"xyibjs4\",\n    $$css: true\n  },\n  fromTop: {\n    k3nNDw: \"x1dp6rp6\",\n    $$css: true\n  },\n  modalBodyRing: {\n    kjBf7l: \"xrgy624\",\n    kInvED: \"x2ssjo2\",\n    k3XXqK: \"x9v5kkp x1t137rt\",\n    kMeerF: \"x1de99jn\",\n    $$css: true\n  },\n  modalDialog: {\n    kZKoxP: \"x5yr21d\",\n    kB7OPa: \"x9f619\",\n    k1xSpc: \"x78zum5\",\n    kXwgrk: \"xdt5ytf\",\n    kAzted: \"x2lwn1j\",\n    k3XXqK: \"x1t137rt\",\n    $$css: true\n  },\n  popup: {\n    k44tkh: \"xvhm28k x1u6grsq\",\n    kKVMdj: \"x97zbip\",\n    kyAemX: \"x16dv9tl\",\n    kWkggS: \"x1mjdul6\",\n    kVAM5u: \"x1w1tqly\",\n    kaIpWk: \"x62ce2h\",\n    ksu8eU: \"xx61lck\",\n    kMzoRj: \"x13rsnn2\",\n    kGVxlE: \"x1os83gw\",\n    kB7OPa: \"x9f619\",\n    kMwMTN: \"x139gbkf\",\n    kORKVm: \"x1odjw0f\",\n    kZeWKH: \"xish69e\",\n    $$css: true\n  },\n  popupDialog: {\n    kB7OPa: \"x9f619\",\n    k1xSpc: \"x78zum5\",\n    kXwgrk: \"xdt5ytf\",\n    kOIVth: \"x126z3so\",\n    $$css: true\n  },\n  scrim: {\n    k44tkh: \"x1vhuh8u\",\n    kKVMdj: \"xqcmdr3\",\n    kyAemX: \"x1yujl0p\",\n    kWkggS: \"x1iqbvzf\",\n    kB7OPa: \"x9f619\",\n    kpwlN0: \"x10a8y8t\",\n    kVAEAm: \"xixxii4\",\n    $$css: true\n  }\n};\n\n// Which side the surface opened on, and the origin its entry grows from.\n// Keyed on the placement React Aria reports rather than the one asked for,\n// since the surface flips to the opposite side when there is no room on its\n// own; `center` is the placement React Aria reports for an anchor it could\n// not place beside, and grows from the top like the default.\nconst origins = {\n  bottom: overlay.fromTop,\n  center: overlay.fromTop,\n  left: overlay.fromRight,\n  right: overlay.fromLeft,\n  top: overlay.fromBottom\n};\n\n/** Where along that side it lines up with the anchor. */\ntype OverlayAlign = 'center' | 'end' | 'start';\n\n/** Which side of the anchor a surface opens on. */\ntype OverlaySide = 'bottom' | 'left' | 'right' | 'top';\n\n/**\n * React Aria's placement, from the side and the alignment a call site names.\n * Its own vocabulary pairs a side with `top`/`bottom` on the inline sides and\n * `start`/`end` on the block ones; a call site should not have to know which\n * of the two it is asking for, so this maps one onto the other.\n *\n * Shared by every anchored overlay rather than kept in one, since which side\n * a surface opens on is the same question for a popover, a menu and a\n * tooltip.\n */\nfunction placementOf(side: OverlaySide, align: OverlayAlign) {\n  if (align === 'center') {\n    return side;\n  }\n  if (side === 'top' || side === 'bottom') {\n    return `${side} ${align}` as const;\n  }\n  return `${side} ${align === 'start' ? 'top' : 'bottom'}` as const;\n}\n\n/**\n * The origin an anchored surface grows from, for the placement React Aria\n * reports through its render state. `null`, before the surface has been\n * placed, grows from the top as `bottom` does.\n */\nfunction popupOrigin(placement: PopoverRenderProps['placement']) {\n  return origins[placement ?? 'bottom'];\n}\nexport type { OverlayAlign, OverlaySide };\nexport { overlay, placementOf, popupOrigin };"],"mappings":";AAwCA,MAAMU,UAAU;CACdC,YAAY;EACVC,QAAQ;EACRC,OAAO;CACT;CACAC,UAAU;EACRF,QAAQ;EACRC,OAAO;CACT;CACAE,WAAW;EACTH,QAAQ;EACRC,OAAO;CACT;CACAG,SAAS;EACPJ,QAAQ;EACRC,OAAO;CACT;CACAI,eAAe;EACbC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRR,OAAO;CACT;CACAS,aAAa;EACXC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRP,QAAQ;EACRP,OAAO;CACT;CACAe,OAAO;EACLC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRb,QAAQ;EACRc,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACR3B,OAAO;CACT;CACA4B,aAAa;EACXjB,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRgB,QAAQ;EACR7B,OAAO;CACT;CACA8B,OAAO;EACLd,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRR,QAAQ;EACRoB,QAAQ;EACRC,QAAQ;EACRhC,OAAO;CACT;AACF;AAOA,MAAMiC,UAAU;CACdC,QAAQrC,QAAQM;CAChBgC,QAAQtC,QAAQM;CAChBiC,MAAMvC,QAAQK;CACdmC,OAAOxC,QAAQI;CACfqC,KAAKzC,QAAQC;AACf;;;;;;;;;;;AAkBA,SAAS2C,YAAYC,MAAmBC,OAAqB;CAC3D,IAAIA,UAAU,UACZ,OAAOD;CAET,IAAIA,SAAS,SAASA,SAAS,UAC7B,OAAO,GAAGA,KAAI,GAAIC;CAEpB,OAAO,GAAGD,KAAI,GAAIC,UAAU,UAAU,QAAQ;AAChD;;;;;;AAOA,SAASE,YAAYC,WAA4C;CAC/D,OAAOb,QAAQa,aAAa;AAC9B"}
+{"version":3,"file":"overlay.js","names":["PopoverRenderProps","stylex","colors","motion","radii","shadows","spacing","layers","FORCED_COLORS","fadeIn","scaleIn","overlay","fromBottom","k3nNDw","$$css","fromLeft","fromRight","fromTop","modalBodyRing","kjBf7l","kInvED","k3XXqK","kMeerF","modalDialog","kZKoxP","kB7OPa","k1xSpc","kXwgrk","kAzted","popup","k44tkh","kKVMdj","kyAemX","kWkggS","kVAM5u","kaIpWk","ksu8eU","kMzoRj","kGVxlE","kMwMTN","kORKVm","kZeWKH","popupDialog","kOIVth","scrim","kpwlN0","kVAEAm","kY2c9j","origins","bottom","center","left","right","top","OverlayAlign","OverlaySide","placementOf","side","align","const","popupOrigin","placement"],"sources":["../../src/styles/overlay.ts"],"sourcesContent":["import type { PopoverRenderProps } from 'react-aria-components';\nimport * as stylex from '@stylexjs/stylex';\nimport '../tokens/design.tokens.stylex';\nimport { colors, motion, radii, shadows, spacing } from '../tokens/design.tokens.stylex';\nimport './layers.stylex';\nimport { layers } from './layers.stylex';\n\n// Windows High Contrast and the rest of the forced-colours modes. Spelled\n// here rather than imported, for the reason src/field/styles.ts records: the\n// StyleX compiler resolves a constant across files only out of a `.stylex.ts`\n// module, and the generated one holds design tokens rather than queries.\nconst FORCED_COLORS = '@media (forced-colors: active)';\n\n// What every overlay shares, drawn once. Popover's anchored surface and its\n// entry, Sheet's scrim, and the element that carries the dialog role inside\n// each of them; the coverage plan brings a dozen more overlays — Menu, Select,\n// ComboBox, Tooltip, the date pickers, Dialog — and each would otherwise have\n// written the same surface and the same scrim a second time. Geometry stays\n// with the component: how wide a popover is, which edge a sheet is pinned to,\n// where a dialog sits, are each overlay's own decision.\n//\n// Every one of these is portalled to the end of the body, which is why each\n// component takes a `container` prop and documents the same caveat: an app\n// that scopes its StyleX theme to a subtree has to point the portal inside it,\n// or the surface renders outside the theme and falls back to the tokens'\n// `prefers-color-scheme` default.\n//\n// Portalled to the end of the body, an element with no `z-index` paints level\n// with the page's own unlayered content, so a modal's scrim takes a layer\n// from src/styles/layers.stylex.ts, which sets the order every overlay\n// stacks in over the page.\n//\n// Entry only, and no exit animation, for the same reason in every overlay:\n// React Aria keeps a closing surface mounted only while an animation is\n// running on it, and a popover in particular is dismissed far more often than\n// it is closed deliberately — usually by pressing something else, where a\n// lingering surface is in the way of whatever the press was for.\n\n// The scrim settles before the panel it sits behind arrives: shorter than\n// any panel's entry, so the two do not finish together.\nconst fadeIn = \"x18re5ia-B\";\n\n// An anchored surface grows from the edge it is anchored by rather than from\n// its own centre, which is what makes it read as coming out of the trigger.\n// The origin is a separate style, chosen from the placement React Aria\n// reports, so the same keyframes serve all four sides.\nconst scaleIn = \"x1k48ry3-B\";\nconst overlay = {\n  fromBottom: {\n    k3nNDw: \"x18ouj0k\",\n    $$css: true\n  },\n  fromLeft: {\n    k3nNDw: \"x1nf803f\",\n    $$css: true\n  },\n  fromRight: {\n    k3nNDw: \"xyibjs4\",\n    $$css: true\n  },\n  fromTop: {\n    k3nNDw: \"x1dp6rp6\",\n    $$css: true\n  },\n  modalBodyRing: {\n    kjBf7l: \"xrgy624\",\n    kInvED: \"x2ssjo2\",\n    k3XXqK: \"x9v5kkp x1t137rt\",\n    kMeerF: \"x1de99jn\",\n    $$css: true\n  },\n  modalDialog: {\n    kZKoxP: \"x5yr21d\",\n    kB7OPa: \"x9f619\",\n    k1xSpc: \"x78zum5\",\n    kXwgrk: \"xdt5ytf\",\n    kAzted: \"x2lwn1j\",\n    k3XXqK: \"x1t137rt\",\n    $$css: true\n  },\n  popup: {\n    k44tkh: \"xvhm28k x1u6grsq\",\n    kKVMdj: \"x97zbip\",\n    kyAemX: \"x16dv9tl\",\n    kWkggS: \"x1mjdul6\",\n    kVAM5u: \"x1w1tqly\",\n    kaIpWk: \"x62ce2h\",\n    ksu8eU: \"xx61lck\",\n    kMzoRj: \"x13rsnn2\",\n    kGVxlE: \"x1os83gw\",\n    kB7OPa: \"x9f619\",\n    kMwMTN: \"x139gbkf\",\n    kORKVm: \"x1odjw0f\",\n    kZeWKH: \"xish69e\",\n    $$css: true\n  },\n  popupDialog: {\n    kB7OPa: \"x9f619\",\n    k1xSpc: \"x78zum5\",\n    kXwgrk: \"xdt5ytf\",\n    kOIVth: \"x126z3so\",\n    $$css: true\n  },\n  scrim: {\n    k44tkh: \"x1vhuh8u\",\n    kKVMdj: \"xqcmdr3\",\n    kyAemX: \"x1yujl0p\",\n    kWkggS: \"x1iqbvzf\",\n    kB7OPa: \"x9f619\",\n    kpwlN0: \"x10a8y8t\",\n    kVAEAm: \"xixxii4\",\n    kY2c9j: \"x125h2g0\",\n    $$css: true\n  }\n};\n\n// Which side the surface opened on, and the origin its entry grows from.\n// Keyed on the placement React Aria reports rather than the one asked for,\n// since the surface flips to the opposite side when there is no room on its\n// own; `center` is the placement React Aria reports for an anchor it could\n// not place beside, and grows from the top like the default.\nconst origins = {\n  bottom: overlay.fromTop,\n  center: overlay.fromTop,\n  left: overlay.fromRight,\n  right: overlay.fromLeft,\n  top: overlay.fromBottom\n};\n\n/** Where along that side it lines up with the anchor. */\ntype OverlayAlign = 'center' | 'end' | 'start';\n\n/** Which side of the anchor a surface opens on. */\ntype OverlaySide = 'bottom' | 'left' | 'right' | 'top';\n\n/**\n * React Aria's placement, from the side and the alignment a call site names.\n * Its own vocabulary pairs a side with `top`/`bottom` on the inline sides and\n * `start`/`end` on the block ones; a call site should not have to know which\n * of the two it is asking for, so this maps one onto the other.\n *\n * Shared by every anchored overlay rather than kept in one, since which side\n * a surface opens on is the same question for a popover, a menu and a\n * tooltip.\n */\nfunction placementOf(side: OverlaySide, align: OverlayAlign) {\n  if (align === 'center') {\n    return side;\n  }\n  if (side === 'top' || side === 'bottom') {\n    return `${side} ${align}` as const;\n  }\n  return `${side} ${align === 'start' ? 'top' : 'bottom'}` as const;\n}\n\n/**\n * The origin an anchored surface grows from, for the placement React Aria\n * reports through its render state. `null`, before the surface has been\n * placed, grows from the top as `bottom` does.\n */\nfunction popupOrigin(placement: PopoverRenderProps['placement']) {\n  return origins[placement ?? 'bottom'];\n}\nexport type { OverlayAlign, OverlaySide };\nexport { overlay, placementOf, popupOrigin };"],"mappings":";AA+CA,MAAMW,UAAU;CACdC,YAAY;EACVC,QAAQ;EACRC,OAAO;CACT;CACAC,UAAU;EACRF,QAAQ;EACRC,OAAO;CACT;CACAE,WAAW;EACTH,QAAQ;EACRC,OAAO;CACT;CACAG,SAAS;EACPJ,QAAQ;EACRC,OAAO;CACT;CACAI,eAAe;EACbC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRR,OAAO;CACT;CACAS,aAAa;EACXC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRP,QAAQ;EACRP,OAAO;CACT;CACAe,OAAO;EACLC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRb,QAAQ;EACRc,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACR3B,OAAO;CACT;CACA4B,aAAa;EACXjB,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRgB,QAAQ;EACR7B,OAAO;CACT;CACA8B,OAAO;EACLd,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRR,QAAQ;EACRoB,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRjC,OAAO;CACT;AACF;AAOA,MAAMkC,UAAU;CACdC,QAAQtC,QAAQM;CAChBiC,QAAQvC,QAAQM;CAChBkC,MAAMxC,QAAQK;CACdoC,OAAOzC,QAAQI;CACfsC,KAAK1C,QAAQC;AACf;;;;;;;;;;;AAkBA,SAAS4C,YAAYC,MAAmBC,OAAqB;CAC3D,IAAIA,UAAU,UACZ,OAAOD;CAET,IAAIA,SAAS,SAASA,SAAS,UAC7B,OAAO,GAAGA,KAAI,GAAIC;CAEpB,OAAO,GAAGD,KAAI,GAAIC,UAAU,UAAU,QAAQ;AAChD;;;;;;AAOA,SAASE,YAAYC,WAA4C;CAC/D,OAAOb,QAAQa,aAAa;AAC9B"}

package/dist/styles.css

@@ -1213,6 +1213,14 @@
     box-shadow: inset 0 -1px 0 var(--x7dbk6n);
   }
 
+  .xb0slzl {
+    box-shadow: inset 0 -2px 0 0 var(--x12p1wyw);
+  }
+
+  .xra6ydt {
+    box-shadow: inset 0 -2px 0 0 var(--x1cjupv7);
+  }
+
   .xbd69nm {
     box-shadow: inset 0 0 0 1px var(--x7dbk6n);
   }
@@ -2674,10 +2682,14 @@
     z-index: 1;
   }
 
-  .xfo81ep {
+  .x1bk8fjm {
     z-index: 1000;
   }
 
+  .x125h2g0 {
+    z-index: 900;
+  }
+
   .x1lxxh4i:focus-within {
     box-shadow: inset 0 -2px 0 0 var(--x12p1wyw);
   }
@@ -4016,6 +4028,10 @@
   }
 
   @media (forced-colors: active) {
+    .xszdk7l.xszdk7l {
+      border-bottom-color: canvastext;
+    }
+
     .x1fxan2a.x1fxan2a {
       border-bottom-color: graytext;
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kanso-labs/kanso-ui",
-  "version": "0.40.2",
+  "version": "0.40.3",
   "description": "A React component library built on React Aria Components primitives and styled with StyleX, with design tokens sourced from a single W3C DTCG file and compiled via Style Dictionary",
   "keywords": [
     "react",