@m3-baseui/react-vanilla-extract 1.0.4 → 1.2.0

package/dist/time-picker.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/time-picker.css.ts","../src/time-picker.ts"],"names":[],"mappings":";;;;;;;AACO,IAAI,KAAA,GAAQ,WAAA;AACZ,IAAI,IAAA,GAAO,WAAA;AACX,IAAI,UAAA,GAAa,WAAA;AACjB,IAAI,QAAA,GAAW,WAAA;AACf,IAAI,UAAA,GAAa,WAAA;AACjB,IAAI,KAAA,GAAQ,WAAA;AACZ,IAAI,MAAA,GAAS,WAAA;AACb,IAAI,QAAA,GAAW,WAAA;AACf,IAAI,YAAA,GAAe,WAAA;AACnB,IAAI,MAAA,GAAS,WAAA;AACb,IAAI,MAAA,GAAS,WAAA;AACb,IAAI,OAAA,GAAU,WAAA;AACd,IAAI,IAAA,GAAO,WAAA;;;ACSX,IAAM,UAAA,GAAa,iBAAiB,OAAO;AAAA,EAChD,IAAA;AAAA,EACA,MAAA;AAAA,EACA,KAAA;AAAA,EACA,KAAA;AAAA,EACA,OAAA;AAAA,EACA,MAAA;AAAA,EACA,IAAA;AAAA,EACA,UAAA;AAAA,EACA,QAAA;AAAA,EACA,UAAA;AAAA,EACA,MAAA;AAAA,EACA,QAAA;AAAA,EACA;AACF,CAAA,CAAE","file":"time-picker.js","sourcesContent":["import 'src/time-picker.css.ts.vanilla.css?source=#H4sIAAAAAAAAA-1YUW_jKBB-76_gpVKjKysnbbZZ9qecTidsxg5XDBaM06Sn_e8ng91gb9KapNJppX1pi803nhm--Wbol7-Xe7tqnnhG_r0hREjXKH5gRGolNdBSwf77DSHdbyqkhQKl0YwURrW17t5wJStNJULtGClAI9juccUbRjaNBzdcCKmrt3VhlLGM2Cq_23F7R2ktqDs46p9To6lrbckLWCy-3_y4-TJ4uBx7OLj2oQORidXJICsrhfdT8QJ-tvQiBW4Z-fY1eL8FWW2RkU0W1rmxAiy1XMjWMTKKyG15A9TVXKlFt9fswJbKvDCylUKADvg9dfLVJ6i3lZtgmRfPlTWtFmeT1WeKFkYjlxos3cpqCw4Xi9RME1IajbTktVSHSRx4aMAVXAHtc0cVtxXQDnGEvvSZmQUNm49gJ19hJrTb6oH-9LYpX40QwQIggqWu4YU_gFlG0PLiWeoqpLi1rstxY-RAGNNi9x1GtNFwpAgjy2ZPnFFSELRcu4Zb0Nht8EsZSut46uGYyDLLandPosWY038Kjpw6UFAgiL88xWdQp7Gy5vZwpM5MypzERf48eAd-bS4tP4kbSeXXyyQNqsTI40S8Hi9U6OsFasrecwEF3odogiw7UCUjDi1gse0e19xWUjOSjRqDX9VS97H3B5iNwl8HXinY9-dzLhNnGsI_rUNZBt6CxvjVNPPLVZD2zqOBEg998-q7wbrvBnN4jhIV0BqEbOs0mo-QSSwfIZMEc4S8UC9HNi4qCbrjVnI99LEEkc2mrXOktTGhLhROB4XR4hLpPIMckfwPMmF8X75omrQSjKx-9YYaM7QYC4qj3EHE59V6Mt68PQgVS3NliuefR7qzlTs9kA9FqGx7Dbp27IkCf5oEznNnVIvw1nNLY-ueIYoj3NF1dntPup-LUxIzb1J83IxTOawTcjBHVnIjLuqdES5JUiJckqBEuAvlJLJwRX-dIyKt69zxinCFsjxdN5KlDWITym_eobyCEhlZZ7ee_15QVrcxUx82t7EmBNq-FQo1VvrmnRtEU0fET42t15TgD132mhLOhcIONLoh_VFo35JC6__uY5mU5GYS2jsa8LnKNUrDhxHzGVdeP_g55BbPXntzb-YT77Hn76wIe6TeP5bGj9832f_7Jjvj2jpn8Ke1eaW8aYBbrgtgnhKlBCXGnGSlKVoXjThecN7_0GnJyxmjL5A_S6RSa5-EbmBpEY2-J6e2mRbH27wbw9vY-SEX0b0l-nIxrk8_I0X65nXoMe2fXuPBd_Yc4Gvzgjkg4NLngIBLnwMC7po5IFiImPvjPwaPofTEFAAA';\nexport var colon = '_1xr2p7a3';\nexport var dial = '_1xr2p7a6';\nexport var dialCenter = '_1xr2p7a9';\nexport var dialHand = '_1xr2p7a8';\nexport var dialNumber = '_1xr2p7a7';\nexport var field = '_1xr2p7a2';\nexport var header = '_1xr2p7a1';\nexport var inputBox = '_1xr2p7ab';\nexport var inputCaption = '_1xr2p7ac';\nexport var inputs = '_1xr2p7aa';\nexport var period = '_1xr2p7a5';\nexport var periods = '_1xr2p7a4';\nexport var root = '_1xr2p7a0';","/**\n * time-picker.ts — wires the VE styles into the shared component factory.\n */\nimport { createTimePicker } from '@m3-baseui/core';\n\nexport type { TimePickerVariant, TimeValue } from '@m3-baseui/core';\nimport {\n  root,\n  header,\n  field,\n  colon,\n  periods,\n  period,\n  dial,\n  dialNumber,\n  dialHand,\n  dialCenter,\n  inputs,\n  inputBox,\n  inputCaption,\n} from './time-picker.css';\n\nexport const TimePicker = createTimePicker(() => ({\n  root,\n  header,\n  field,\n  colon,\n  periods,\n  period,\n  dial,\n  dialNumber,\n  dialHand,\n  dialCenter,\n  inputs,\n  inputBox,\n  inputCaption,\n}));\n"]}

package/dist/toolbar.css

@@ -0,0 +1,37 @@
+/* vanilla-extract-css-ns:src/toolbar.css.ts.vanilla.css?source=Ll8xYThicXR0MCB7CiAgZGlzcGxheTogaW5saW5lLWZsZXg7CiAgYWxpZ24taXRlbXM6IGNlbnRlcjsKICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsKICBnYXA6IDRweDsKICBib3gtc2l6aW5nOiBib3JkZXItYm94OwogIGJvcmRlci1yYWRpdXM6IHZhcigtLW1kLXN5cy1zaGFwZS1mdWxsKTsKICBib3gtc2hhZG93OiB2YXIoLS1tZC1zeXMtZWxldmF0aW9uLWxldmVsMyk7Cn0KLl8xYThicXR0MSB7CiAgYmFja2dyb3VuZDogcmdiKHZhcigtLW1kLXN5cy1jb2xvci1zdXJmYWNlLWNvbnRhaW5lcikpOwogIGNvbG9yOiByZ2IodmFyKC0tbWQtc3lzLWNvbG9yLW9uLXN1cmZhY2UtdmFyaWFudCkpOwp9Ci5fMWE4YnF0dDIgewogIGJhY2tncm91bmQ6IHJnYih2YXIoLS1tZC1zeXMtY29sb3ItcHJpbWFyeS1jb250YWluZXIpKTsKICBjb2xvcjogcmdiKHZhcigtLW1kLXN5cy1jb2xvci1vbi1wcmltYXJ5LWNvbnRhaW5lcikpOwp9Ci5fMWE4YnF0dDMgewogIGZsZXgtZGlyZWN0aW9uOiByb3c7CiAgaGVpZ2h0OiA2NHB4OwogIHBhZGRpbmctaW5saW5lOiA4cHg7Cn0KLl8xYThicXR0NCB7CiAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjsKICB3aWR0aDogNjRweDsKICBwYWRkaW5nLWJsb2NrOiA4cHg7Cn0KW3JvbGU9InRvb2xiYXIiXVtkYXRhLXZhcmlhbnRdIHN2ZyB7CiAgd2lkdGg6IDI0cHg7CiAgaGVpZ2h0OiAyNHB4Owp9Cltyb2xlPSJ0b29sYmFyIl1bZGF0YS12YXJpYW50PSJ2aWJyYW50Il0gYnV0dG9uOm5vdCg6ZGlzYWJsZWQpOm5vdChbZGF0YS1kaXNhYmxlZF0pLCBbcm9sZT0idG9vbGJhciJdW2RhdGEtdmFyaWFudD0idmlicmFudCJdIGE6bm90KFtkYXRhLWRpc2FibGVkXSkgewogIGNvbG9yOiByZ2IodmFyKC0tbWQtc3lzLWNvbG9yLW9uLXByaW1hcnktY29udGFpbmVyKSk7Cn0 */
+._1a8bqtt0 {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 4px;
+  box-sizing: border-box;
+  border-radius: var(--md-sys-shape-full);
+  box-shadow: var(--md-sys-elevation-level3);
+}
+._1a8bqtt1 {
+  background: rgb(var(--md-sys-color-surface-container));
+  color: rgb(var(--md-sys-color-on-surface-variant));
+}
+._1a8bqtt2 {
+  background: rgb(var(--md-sys-color-primary-container));
+  color: rgb(var(--md-sys-color-on-primary-container));
+}
+._1a8bqtt3 {
+  flex-direction: row;
+  height: 64px;
+  padding-inline: 8px;
+}
+._1a8bqtt4 {
+  flex-direction: column;
+  width: 64px;
+  padding-block: 8px;
+}
+[role=toolbar][data-variant] svg {
+  width: 24px;
+  height: 24px;
+}
+[role=toolbar][data-variant=vibrant] button:not(:disabled):not([data-disabled]),
+[role=toolbar][data-variant=vibrant] a:not([data-disabled]) {
+  color: rgb(var(--md-sys-color-on-primary-container));
+}
+/*# sourceMappingURL=toolbar.css.map */

package/dist/toolbar.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["vanilla-extract-css-ns:src/toolbar.css.ts.vanilla.css?source=Ll8xYThicXR0MCB7CiAgZGlzcGxheTogaW5saW5lLWZsZXg7CiAgYWxpZ24taXRlbXM6IGNlbnRlcjsKICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsKICBnYXA6IDRweDsKICBib3gtc2l6aW5nOiBib3JkZXItYm94OwogIGJvcmRlci1yYWRpdXM6IHZhcigtLW1kLXN5cy1zaGFwZS1mdWxsKTsKICBib3gtc2hhZG93OiB2YXIoLS1tZC1zeXMtZWxldmF0aW9uLWxldmVsMyk7Cn0KLl8xYThicXR0MSB7CiAgYmFja2dyb3VuZDogcmdiKHZhcigtLW1kLXN5cy1jb2xvci1zdXJmYWNlLWNvbnRhaW5lcikpOwogIGNvbG9yOiByZ2IodmFyKC0tbWQtc3lzLWNvbG9yLW9uLXN1cmZhY2UtdmFyaWFudCkpOwp9Ci5fMWE4YnF0dDIgewogIGJhY2tncm91bmQ6IHJnYih2YXIoLS1tZC1zeXMtY29sb3ItcHJpbWFyeS1jb250YWluZXIpKTsKICBjb2xvcjogcmdiKHZhcigtLW1kLXN5cy1jb2xvci1vbi1wcmltYXJ5LWNvbnRhaW5lcikpOwp9Ci5fMWE4YnF0dDMgewogIGZsZXgtZGlyZWN0aW9uOiByb3c7CiAgaGVpZ2h0OiA2NHB4OwogIHBhZGRpbmctaW5saW5lOiA4cHg7Cn0KLl8xYThicXR0NCB7CiAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjsKICB3aWR0aDogNjRweDsKICBwYWRkaW5nLWJsb2NrOiA4cHg7Cn0KW3JvbGU9InRvb2xiYXIiXVtkYXRhLXZhcmlhbnRdIHN2ZyB7CiAgd2lkdGg6IDI0cHg7CiAgaGVpZ2h0OiAyNHB4Owp9Cltyb2xlPSJ0b29sYmFyIl1bZGF0YS12YXJpYW50PSJ2aWJyYW50Il0gYnV0dG9uOm5vdCg6ZGlzYWJsZWQpOm5vdChbZGF0YS1kaXNhYmxlZF0pLCBbcm9sZT0idG9vbGJhciJdW2RhdGEtdmFyaWFudD0idmlicmFudCJdIGE6bm90KFtkYXRhLWRpc2FibGVkXSkgewogIGNvbG9yOiByZ2IodmFyKC0tbWQtc3lzLWNvbG9yLW9uLXByaW1hcnktY29udGFpbmVyKSk7Cn0"],"sourcesContent":["._1a8bqtt0 {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: 4px;\n  box-sizing: border-box;\n  border-radius: var(--md-sys-shape-full);\n  box-shadow: var(--md-sys-elevation-level3);\n}\n._1a8bqtt1 {\n  background: rgb(var(--md-sys-color-surface-container));\n  color: rgb(var(--md-sys-color-on-surface-variant));\n}\n._1a8bqtt2 {\n  background: rgb(var(--md-sys-color-primary-container));\n  color: rgb(var(--md-sys-color-on-primary-container));\n}\n._1a8bqtt3 {\n  flex-direction: row;\n  height: 64px;\n  padding-inline: 8px;\n}\n._1a8bqtt4 {\n  flex-direction: column;\n  width: 64px;\n  padding-block: 8px;\n}\n[role=\"toolbar\"][data-variant] svg {\n  width: 24px;\n  height: 24px;\n}\n[role=\"toolbar\"][data-variant=\"vibrant\"] button:not(:disabled):not([data-disabled]), [role=\"toolbar\"][data-variant=\"vibrant\"] a:not([data-disabled]) {\n  color: rgb(var(--md-sys-color-on-primary-container));\n}"],"mappings":";AAAA,CAAC;AACC,WAAS;AACT,eAAa;AACb,mBAAiB;AACjB,OAAK;AACL,cAAY;AACZ,iBAAe,IAAI;AACnB,cAAY,IAAI;AAClB;AACA,CAAC;AACC,cAAY,IAAI,IAAI;AACpB,SAAO,IAAI,IAAI;AACjB;AACA,CAAC;AACC,cAAY,IAAI,IAAI;AACpB,SAAO,IAAI,IAAI;AACjB;AACA,CAAC;AACC,kBAAgB;AAChB,UAAQ;AACR,kBAAgB;AAClB;AACA,CAAC;AACC,kBAAgB;AAChB,SAAO;AACP,iBAAe;AACjB;AACA,CAAC,aAAe,CAAC,cAAc;AAC7B,SAAO;AACP,UAAQ;AACV;AACA,CAAC,aAAe,CAAC,sBAAwB,MAAM,KAAK,UAAU,KAAK,CAAC;AAAiB,CAAC,aAAe,CAAC,sBAAwB,CAAC,KAAK,CAAC;AACnI,SAAO,IAAI,IAAI;AACjB;","names":[]}

package/dist/toolbar.d.ts

@@ -0,0 +1,7 @@
+import * as react from 'react';
+import * as _m3_baseui_core from '@m3-baseui/core';
+export { ToolbarOrientation, ToolbarProps, ToolbarVariant } from '@m3-baseui/core';
+
+declare const Toolbar: react.ForwardRefExoticComponent<_m3_baseui_core.ToolbarOwnProps & react.HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
+
+export { Toolbar };

package/dist/toolbar.js

@@ -0,0 +1,16 @@
+"use client";
+import './toolbar.css';
+import { createToolbar } from '@m3-baseui/core';
+import { createRuntimeFn } from '@vanilla-extract/recipes/createRuntimeFn';
+
+// src/toolbar.ts
+var toolbar = createRuntimeFn({ defaultClassName: "_1a8bqtt0", variantClassNames: { variant: { standard: "_1a8bqtt1", vibrant: "_1a8bqtt2" }, orientation: { horizontal: "_1a8bqtt3", vertical: "_1a8bqtt4" } }, defaultVariants: { variant: "standard", orientation: "horizontal" }, compoundVariants: [] });
+
+// src/toolbar.ts
+var Toolbar = createToolbar(
+  ({ variant, orientation }) => toolbar({ variant, orientation })
+);
+
+export { Toolbar };
+//# sourceMappingURL=toolbar.js.map
+//# sourceMappingURL=toolbar.js.map

package/dist/toolbar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/toolbar.css.ts","../src/toolbar.ts"],"names":["_7a468"],"mappings":";;;;;;AAEO,IAAI,OAAA,GAAUA,eAAA,CAAO,EAAC,gBAAA,EAAiB,aAAY,iBAAA,EAAkB,EAAC,OAAA,EAAQ,EAAC,QAAA,EAAS,WAAA,EAAY,OAAA,EAAQ,WAAA,IAAa,WAAA,EAAY,EAAC,UAAA,EAAW,WAAA,EAAY,QAAA,EAAS,WAAA,EAAW,EAAC,EAAE,iBAAgB,EAAC,OAAA,EAAQ,UAAA,EAAW,WAAA,EAAY,YAAA,EAAY,EAAE,gBAAA,EAAiB,IAAG,CAAA;;;ACItQ,IAAM,OAAA,GAAU,aAAA;AAAA,EAAc,CAAC,EAAE,OAAA,EAAS,WAAA,OAC/C,OAAA,CAAQ,EAAE,OAAA,EAAS,WAAA,EAAa;AAClC","file":"toolbar.js","sourcesContent":["import 'src/toolbar.css.ts.vanilla.css?source=Ll8xYThicXR0MCB7CiAgZGlzcGxheTogaW5saW5lLWZsZXg7CiAgYWxpZ24taXRlbXM6IGNlbnRlcjsKICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsKICBnYXA6IDRweDsKICBib3gtc2l6aW5nOiBib3JkZXItYm94OwogIGJvcmRlci1yYWRpdXM6IHZhcigtLW1kLXN5cy1zaGFwZS1mdWxsKTsKICBib3gtc2hhZG93OiB2YXIoLS1tZC1zeXMtZWxldmF0aW9uLWxldmVsMyk7Cn0KLl8xYThicXR0MSB7CiAgYmFja2dyb3VuZDogcmdiKHZhcigtLW1kLXN5cy1jb2xvci1zdXJmYWNlLWNvbnRhaW5lcikpOwogIGNvbG9yOiByZ2IodmFyKC0tbWQtc3lzLWNvbG9yLW9uLXN1cmZhY2UtdmFyaWFudCkpOwp9Ci5fMWE4YnF0dDIgewogIGJhY2tncm91bmQ6IHJnYih2YXIoLS1tZC1zeXMtY29sb3ItcHJpbWFyeS1jb250YWluZXIpKTsKICBjb2xvcjogcmdiKHZhcigtLW1kLXN5cy1jb2xvci1vbi1wcmltYXJ5LWNvbnRhaW5lcikpOwp9Ci5fMWE4YnF0dDMgewogIGZsZXgtZGlyZWN0aW9uOiByb3c7CiAgaGVpZ2h0OiA2NHB4OwogIHBhZGRpbmctaW5saW5lOiA4cHg7Cn0KLl8xYThicXR0NCB7CiAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjsKICB3aWR0aDogNjRweDsKICBwYWRkaW5nLWJsb2NrOiA4cHg7Cn0KW3JvbGU9InRvb2xiYXIiXVtkYXRhLXZhcmlhbnRdIHN2ZyB7CiAgd2lkdGg6IDI0cHg7CiAgaGVpZ2h0OiAyNHB4Owp9Cltyb2xlPSJ0b29sYmFyIl1bZGF0YS12YXJpYW50PSJ2aWJyYW50Il0gYnV0dG9uOm5vdCg6ZGlzYWJsZWQpOm5vdChbZGF0YS1kaXNhYmxlZF0pLCBbcm9sZT0idG9vbGJhciJdW2RhdGEtdmFyaWFudD0idmlicmFudCJdIGE6bm90KFtkYXRhLWRpc2FibGVkXSkgewogIGNvbG9yOiByZ2IodmFyKC0tbWQtc3lzLWNvbG9yLW9uLXByaW1hcnktY29udGFpbmVyKSk7Cn0';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var toolbar = _7a468({defaultClassName:'_1a8bqtt0',variantClassNames:{variant:{standard:'_1a8bqtt1',vibrant:'_1a8bqtt2'},orientation:{horizontal:'_1a8bqtt3',vertical:'_1a8bqtt4'}},defaultVariants:{variant:'standard',orientation:'horizontal'},compoundVariants:[]});","/**\n * toolbar.ts — wires the VE styles into the shared Toolbar factory.\n */\nimport { createToolbar } from '@m3-baseui/core';\nimport { toolbar } from './toolbar.css';\n\nexport const Toolbar = createToolbar(({ variant, orientation }) =>\n  toolbar({ variant, orientation }),\n);\nexport type { ToolbarProps, ToolbarVariant, ToolbarOrientation } from '@m3-baseui/core';\n"]}

package/dist/top-app-bar.css

@@ -0,0 +1,89 @@
+/* vanilla-extract-css-ns:src/top-app-bar.css.ts.vanilla.css?source=#H4sIAAAAAAAAA-2V246bMBCG7_MUc1Npc-EVye7Srfs0xh7MND4g2zlt1XevcGgSaCoBe9srZOb_5_DZ4Ocfrn0piwJ-rgAUxdaIM4fa4On7CvKTKQooE3nHQXqzt66LHEmlhsOmKL50y8qfWKQPcppD5YPCwCqfUzRIukkcytc2ryshdzr4vVMcgq6eDiI8MWYVi-fIpDc-sLgPtZC4Xnf6_OqfUu_u1b9Wz5dxXvI4f0pvNtuu9jX6Ooy-DaNvj1EIQ9oxSmgjB4kuYehea9Fy6Ecbj9oKpchpRs6Qw152rVPOqpN3IjaB3I5DsRhMCfGgc-F-A7ej3rfDJr9mrSXHen0u7Q8YauOPHBpSCvOBSHhK7BZAY6iNFPNZaSghi62QyMH5YxDt4gHec0MdDQ6bR5Avew1Qe5dYLSyZM4dB_nRuMUphkCVKBpkRQSPr9Our8djjmGC8SG_WSB84ydgJs61rnDXTK97pL35MCUMGnD_ACSlSEHJHTt-j_TYVbd7qfE4HJ_Q_8JnARQb-F-Vy-PeofEre3r7UKZwbFCo3Ha0wZh7qkXcW7ZF3FvCRdyHzUZZH2Kt52N8XYLeoaG8Xcu_Ny8D35mXke_Nn0fdpHrGXiy_X5RcgO4hAwqX1sJFpF-Fvgh0T7iAJAAA */
+.jnp3600 {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  box-sizing: border-box;
+  height: 64px;
+  background: rgb(var(--md-sys-color-surface));
+  color: rgb(var(--md-sys-color-on-surface));
+}
+.jnp3603 {
+  height: 112px;
+}
+.jnp3604 {
+  height: 152px;
+}
+.jnp3605 {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  height: 64px;
+  padding-inline: 4px;
+}
+.jnp3606 {
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+  color: rgb(var(--md-sys-color-on-surface));
+}
+.jnp3606 svg {
+  width: 24px;
+  height: 24px;
+}
+.jnp3607 {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  color: rgb(var(--md-sys-color-on-surface));
+}
+.jnp3608 {
+  flex: 1;
+  padding-inline: 12px;
+  font-family: var(--md-sys-typescale-title-large-font);
+  font-weight: var(--md-sys-typescale-title-large-weight);
+  font-size: var(--md-sys-typescale-title-large-size);
+  line-height: var(--md-sys-typescale-title-large-line-height);
+  letter-spacing: var(--md-sys-typescale-title-large-tracking);
+}
+.jnp3609 {
+  flex: 1;
+  padding-inline: 12px;
+  text-align: center;
+  font-family: var(--md-sys-typescale-title-large-font);
+  font-weight: var(--md-sys-typescale-title-large-weight);
+  font-size: var(--md-sys-typescale-title-large-size);
+  line-height: var(--md-sys-typescale-title-large-line-height);
+  letter-spacing: var(--md-sys-typescale-title-large-tracking);
+}
+.jnp360a {
+  padding-inline: 16px;
+  padding-bottom: 24px;
+  font-family: var(--md-sys-typescale-headline-small-font);
+  font-weight: var(--md-sys-typescale-headline-small-weight);
+  font-size: var(--md-sys-typescale-headline-small-size);
+  line-height: var(--md-sys-typescale-headline-small-line-height);
+  letter-spacing: var(--md-sys-typescale-headline-small-tracking);
+}
+.jnp360b {
+  padding-inline: 16px;
+  padding-bottom: 28px;
+  font-family: var(--md-sys-typescale-headline-medium-font);
+  font-weight: var(--md-sys-typescale-headline-medium-weight);
+  font-size: var(--md-sys-typescale-headline-medium-size);
+  line-height: var(--md-sys-typescale-headline-medium-line-height);
+  letter-spacing: var(--md-sys-typescale-headline-medium-tracking);
+}
+.jnp360c {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  flex-shrink: 0;
+  color: rgb(var(--md-sys-color-on-surface-variant));
+}
+.jnp360c svg {
+  width: 24px;
+  height: 24px;
+}
+/*# sourceMappingURL=top-app-bar.css.map */

package/dist/top-app-bar.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["vanilla-extract-css-ns:src/top-app-bar.css.ts.vanilla.css?source=#H4sIAAAAAAAAA-2V246bMBCG7_MUc1Npc-EVye7Srfs0xh7MND4g2zlt1XevcGgSaCoBe9srZOb_5_DZ4Ocfrn0piwJ-rgAUxdaIM4fa4On7CvKTKQooE3nHQXqzt66LHEmlhsOmKL50y8qfWKQPcppD5YPCwCqfUzRIukkcytc2ryshdzr4vVMcgq6eDiI8MWYVi-fIpDc-sLgPtZC4Xnf6_OqfUu_u1b9Wz5dxXvI4f0pvNtuu9jX6Ooy-DaNvj1EIQ9oxSmgjB4kuYehea9Fy6Ecbj9oKpchpRs6Qw152rVPOqpN3IjaB3I5DsRhMCfGgc-F-A7ej3rfDJr9mrSXHen0u7Q8YauOPHBpSCvOBSHhK7BZAY6iNFPNZaSghi62QyMH5YxDt4gHec0MdDQ6bR5Avew1Qe5dYLSyZM4dB_nRuMUphkCVKBpkRQSPr9Our8djjmGC8SG_WSB84ydgJs61rnDXTK97pL35MCUMGnD_ACSlSEHJHTt-j_TYVbd7qfE4HJ_Q_8JnARQb-F-Vy-PeofEre3r7UKZwbFCo3Ha0wZh7qkXcW7ZF3FvCRdyHzUZZH2Kt52N8XYLeoaG8Xcu_Ny8D35mXke_Nn0fdpHrGXiy_X5RcgO4hAwqX1sJFpF-Fvgh0T7iAJAAA"],"sourcesContent":[".jnp3600 {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  box-sizing: border-box;\n  height: 64px;\n  background: rgb(var(--md-sys-color-surface));\n  color: rgb(var(--md-sys-color-on-surface));\n}\n.jnp3603 {\n  height: 112px;\n}\n.jnp3604 {\n  height: 152px;\n}\n.jnp3605 {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n  height: 64px;\n  padding-inline: 4px;\n}\n.jnp3606 {\n  display: flex;\n  align-items: center;\n  flex-shrink: 0;\n  color: rgb(var(--md-sys-color-on-surface));\n}\n.jnp3606 svg {\n  width: 24px;\n  height: 24px;\n}\n.jnp3607 {\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  color: rgb(var(--md-sys-color-on-surface));\n}\n.jnp3608 {\n  flex: 1;\n  padding-inline: 12px;\n  font-family: var(--md-sys-typescale-title-large-font);\n  font-weight: var(--md-sys-typescale-title-large-weight);\n  font-size: var(--md-sys-typescale-title-large-size);\n  line-height: var(--md-sys-typescale-title-large-line-height);\n  letter-spacing: var(--md-sys-typescale-title-large-tracking);\n}\n.jnp3609 {\n  flex: 1;\n  padding-inline: 12px;\n  text-align: center;\n  font-family: var(--md-sys-typescale-title-large-font);\n  font-weight: var(--md-sys-typescale-title-large-weight);\n  font-size: var(--md-sys-typescale-title-large-size);\n  line-height: var(--md-sys-typescale-title-large-line-height);\n  letter-spacing: var(--md-sys-typescale-title-large-tracking);\n}\n.jnp360a {\n  padding-inline: 16px;\n  padding-bottom: 24px;\n  font-family: var(--md-sys-typescale-headline-small-font);\n  font-weight: var(--md-sys-typescale-headline-small-weight);\n  font-size: var(--md-sys-typescale-headline-small-size);\n  line-height: var(--md-sys-typescale-headline-small-line-height);\n  letter-spacing: var(--md-sys-typescale-headline-small-tracking);\n}\n.jnp360b {\n  padding-inline: 16px;\n  padding-bottom: 28px;\n  font-family: var(--md-sys-typescale-headline-medium-font);\n  font-weight: var(--md-sys-typescale-headline-medium-weight);\n  font-size: var(--md-sys-typescale-headline-medium-size);\n  line-height: var(--md-sys-typescale-headline-medium-line-height);\n  letter-spacing: var(--md-sys-typescale-headline-medium-tracking);\n}\n.jnp360c {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n  flex-shrink: 0;\n  color: rgb(var(--md-sys-color-on-surface-variant));\n}\n.jnp360c svg {\n  width: 24px;\n  height: 24px;\n}"],"mappings":";AAAA,CAAC;AACC,WAAS;AACT,kBAAgB;AAChB,SAAO;AACP,cAAY;AACZ,UAAQ;AACR,cAAY,IAAI,IAAI;AACpB,SAAO,IAAI,IAAI;AACjB;AACA,CAAC;AACC,UAAQ;AACV;AACA,CAAC;AACC,UAAQ;AACV;AACA,CAAC;AACC,WAAS;AACT,eAAa;AACb,OAAK;AACL,UAAQ;AACR,kBAAgB;AAClB;AACA,CAAC;AACC,WAAS;AACT,eAAa;AACb,eAAa;AACb,SAAO,IAAI,IAAI;AACjB;AACA,CANC,QAMQ;AACP,SAAO;AACP,UAAQ;AACV;AACA,CAAC;AACC,aAAW;AACX,YAAU;AACV,iBAAe;AACf,eAAa;AACb,SAAO,IAAI,IAAI;AACjB;AACA,CAAC;AACC,QAAM;AACN,kBAAgB;AAChB,eAAa,IAAI;AACjB,eAAa,IAAI;AACjB,aAAW,IAAI;AACf,eAAa,IAAI;AACjB,kBAAgB,IAAI;AACtB;AACA,CAAC;AACC,QAAM;AACN,kBAAgB;AAChB,cAAY;AACZ,eAAa,IAAI;AACjB,eAAa,IAAI;AACjB,aAAW,IAAI;AACf,eAAa,IAAI;AACjB,kBAAgB,IAAI;AACtB;AACA,CAAC;AACC,kBAAgB;AAChB,kBAAgB;AAChB,eAAa,IAAI;AACjB,eAAa,IAAI;AACjB,aAAW,IAAI;AACf,eAAa,IAAI;AACjB,kBAAgB,IAAI;AACtB;AACA,CAAC;AACC,kBAAgB;AAChB,kBAAgB;AAChB,eAAa,IAAI;AACjB,eAAa,IAAI;AACjB,aAAW,IAAI;AACf,eAAa,IAAI;AACjB,kBAAgB,IAAI;AACtB;AACA,CAAC;AACC,WAAS;AACT,eAAa;AACb,OAAK;AACL,eAAa;AACb,SAAO,IAAI,IAAI;AACjB;AACA,CAPC,QAOQ;AACP,SAAO;AACP,UAAQ;AACV;","names":[]}

package/dist/top-app-bar.d.ts

@@ -0,0 +1,7 @@
+import * as react from 'react';
+import * as _m3_baseui_core from '@m3-baseui/core';
+export { TopAppBarProps, TopAppBarVariant } from '@m3-baseui/core';
+
+declare const TopAppBar: react.ForwardRefExoticComponent<_m3_baseui_core.TopAppBarOwnProps & Omit<react.HTMLAttributes<HTMLElement>, "title"> & react.RefAttributes<HTMLElement>>;
+
+export { TopAppBar };

package/dist/top-app-bar.js

@@ -0,0 +1,24 @@
+"use client";
+import './top-app-bar.css';
+import { createTopAppBar } from '@m3-baseui/core';
+import { createRuntimeFn } from '@vanilla-extract/recipes/createRuntimeFn';
+
+// src/top-app-bar.ts
+var headline = createRuntimeFn({ defaultClassName: "jnp3607", variantClassNames: { variant: { small: "jnp3608", center: "jnp3609", medium: "jnp360a", large: "jnp360b" } }, defaultVariants: { variant: "small" }, compoundVariants: [] });
+var leading = "jnp3606";
+var root = createRuntimeFn({ defaultClassName: "jnp3600", variantClassNames: { variant: { small: "jnp3601", center: "jnp3602", medium: "jnp3603", large: "jnp3604" } }, defaultVariants: { variant: "small" }, compoundVariants: [] });
+var row = "jnp3605";
+var trailing = "jnp360c";
+
+// src/top-app-bar.ts
+var TopAppBar = createTopAppBar(({ variant }) => ({
+  root: root({ variant }),
+  row,
+  leading,
+  headline: headline({ variant }),
+  trailing
+}));
+
+export { TopAppBar };
+//# sourceMappingURL=top-app-bar.js.map
+//# sourceMappingURL=top-app-bar.js.map

package/dist/top-app-bar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/top-app-bar.css.ts","../src/top-app-bar.ts"],"names":["_7a468"],"mappings":";;;;;;AAEO,IAAI,QAAA,GAAWA,eAAA,CAAO,EAAC,gBAAA,EAAiB,SAAA,EAAU,iBAAA,EAAkB,EAAC,OAAA,EAAQ,EAAC,KAAA,EAAM,SAAA,EAAU,MAAA,EAAO,SAAA,EAAU,MAAA,EAAO,SAAA,EAAU,KAAA,EAAM,SAAA,EAAS,EAAC,EAAE,eAAA,EAAgB,EAAC,OAAA,EAAQ,OAAA,EAAO,EAAE,gBAAA,EAAiB,EAAC,EAAE,CAAA;AACxM,IAAI,OAAA,GAAU,SAAA;AACd,IAAI,IAAA,GAAOA,eAAA,CAAO,EAAC,gBAAA,EAAiB,SAAA,EAAU,iBAAA,EAAkB,EAAC,OAAA,EAAQ,EAAC,KAAA,EAAM,SAAA,EAAU,MAAA,EAAO,SAAA,EAAU,MAAA,EAAO,SAAA,EAAU,KAAA,EAAM,SAAA,EAAS,EAAC,EAAE,eAAA,EAAgB,EAAC,OAAA,EAAQ,OAAA,EAAO,EAAE,gBAAA,EAAiB,EAAC,EAAE,CAAA;AACpM,IAAI,GAAA,GAAM,SAAA;AACV,IAAI,QAAA,GAAW,SAAA;;;ACAf,IAAM,SAAA,GAAY,eAAA,CAAgB,CAAC,EAAE,SAAQ,MAAO;AAAA,EACzD,IAAA,EAAM,IAAA,CAAK,EAAE,OAAA,EAAS,CAAA;AAAA,EACtB,GAAA;AAAA,EACA,OAAA;AAAA,EACA,QAAA,EAAU,QAAA,CAAS,EAAE,OAAA,EAAS,CAAA;AAAA,EAC9B;AACF,CAAA,CAAE","file":"top-app-bar.js","sourcesContent":["import 'src/top-app-bar.css.ts.vanilla.css?source=#H4sIAAAAAAAAA-2V246bMBCG7_MUc1Npc-EVye7Srfs0xh7MND4g2zlt1XevcGgSaCoBe9srZOb_5_DZ4Ocfrn0piwJ-rgAUxdaIM4fa4On7CvKTKQooE3nHQXqzt66LHEmlhsOmKL50y8qfWKQPcppD5YPCwCqfUzRIukkcytc2ryshdzr4vVMcgq6eDiI8MWYVi-fIpDc-sLgPtZC4Xnf6_OqfUu_u1b9Wz5dxXvI4f0pvNtuu9jX6Ooy-DaNvj1EIQ9oxSmgjB4kuYehea9Fy6Ecbj9oKpchpRs6Qw152rVPOqpN3IjaB3I5DsRhMCfGgc-F-A7ej3rfDJr9mrSXHen0u7Q8YauOPHBpSCvOBSHhK7BZAY6iNFPNZaSghi62QyMH5YxDt4gHec0MdDQ6bR5Avew1Qe5dYLSyZM4dB_nRuMUphkCVKBpkRQSPr9Our8djjmGC8SG_WSB84ydgJs61rnDXTK97pL35MCUMGnD_ACSlSEHJHTt-j_TYVbd7qfE4HJ_Q_8JnARQb-F-Vy-PeofEre3r7UKZwbFCo3Ha0wZh7qkXcW7ZF3FvCRdyHzUZZH2Kt52N8XYLeoaG8Xcu_Ny8D35mXke_Nn0fdpHrGXiy_X5RcgO4hAwqX1sJFpF-Fvgh0T7iAJAAA';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var headline = _7a468({defaultClassName:'jnp3607',variantClassNames:{variant:{small:'jnp3608',center:'jnp3609',medium:'jnp360a',large:'jnp360b'}},defaultVariants:{variant:'small'},compoundVariants:[]});\nexport var leading = 'jnp3606';\nexport var root = _7a468({defaultClassName:'jnp3600',variantClassNames:{variant:{small:'jnp3601',center:'jnp3602',medium:'jnp3603',large:'jnp3604'}},defaultVariants:{variant:'small'},compoundVariants:[]});\nexport var row = 'jnp3605';\nexport var trailing = 'jnp360c';","/**\n * top-app-bar.ts — wires the VE styles into the shared TopAppBar factory.\n */\nimport { createTopAppBar } from '@m3-baseui/core';\nimport { root, row, leading, headline, trailing } from './top-app-bar.css';\n\nexport const TopAppBar = createTopAppBar(({ variant }) => ({\n  root: root({ variant }),\n  row,\n  leading,\n  headline: headline({ variant }),\n  trailing,\n}));\nexport type { TopAppBarProps, TopAppBarVariant } from '@m3-baseui/core';\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@m3-baseui/react-vanilla-extract",
-  "version": "1.0.4",
+  "version": "1.2.0",
   "description": "M3 components implemented with vanilla-extract recipes over the shared @m3-baseui/core factories.",
   "type": "module",
   "license": "MIT",
@@ -97,6 +97,11 @@
       "types": "./dist/fab.d.ts",
       "default": "./dist/fab.js"
     },
+    "./fab-menu": {
+      "@m3/source": "./src/fab-menu.ts",
+      "types": "./dist/fab-menu.d.ts",
+      "default": "./dist/fab-menu.js"
+    },
     "./divider": {
       "@m3/source": "./src/divider.ts",
       "types": "./dist/divider.d.ts",
@@ -107,6 +112,11 @@
       "types": "./dist/progress.d.ts",
       "default": "./dist/progress.js"
     },
+    "./loading-indicator": {
+      "@m3/source": "./src/loading-indicator.ts",
+      "types": "./dist/loading-indicator.d.ts",
+      "default": "./dist/loading-indicator.js"
+    },
     "./list": {
       "@m3/source": "./src/list.ts",
       "types": "./dist/list.d.ts",
@@ -137,10 +147,70 @@
       "types": "./dist/segmented-button.d.ts",
       "default": "./dist/segmented-button.js"
     },
+    "./button-group": {
+      "@m3/source": "./src/button-group.ts",
+      "types": "./dist/button-group.d.ts",
+      "default": "./dist/button-group.js"
+    },
+    "./split-button": {
+      "@m3/source": "./src/split-button.ts",
+      "types": "./dist/split-button.d.ts",
+      "default": "./dist/split-button.js"
+    },
     "./navigation-drawer": {
       "@m3/source": "./src/navigation-drawer.ts",
       "types": "./dist/navigation-drawer.d.ts",
       "default": "./dist/navigation-drawer.js"
+    },
+    "./top-app-bar": {
+      "@m3/source": "./src/top-app-bar.ts",
+      "types": "./dist/top-app-bar.d.ts",
+      "default": "./dist/top-app-bar.js"
+    },
+    "./bottom-app-bar": {
+      "@m3/source": "./src/bottom-app-bar.ts",
+      "types": "./dist/bottom-app-bar.d.ts",
+      "default": "./dist/bottom-app-bar.js"
+    },
+    "./navigation-rail": {
+      "@m3/source": "./src/navigation-rail.ts",
+      "types": "./dist/navigation-rail.d.ts",
+      "default": "./dist/navigation-rail.js"
+    },
+    "./bottom-sheet": {
+      "@m3/source": "./src/bottom-sheet.ts",
+      "types": "./dist/bottom-sheet.d.ts",
+      "default": "./dist/bottom-sheet.js"
+    },
+    "./side-sheet": {
+      "@m3/source": "./src/side-sheet.ts",
+      "types": "./dist/side-sheet.d.ts",
+      "default": "./dist/side-sheet.js"
+    },
+    "./search": {
+      "@m3/source": "./src/search.ts",
+      "types": "./dist/search.d.ts",
+      "default": "./dist/search.js"
+    },
+    "./date-picker": {
+      "@m3/source": "./src/date-picker.ts",
+      "types": "./dist/date-picker.d.ts",
+      "default": "./dist/date-picker.js"
+    },
+    "./time-picker": {
+      "@m3/source": "./src/time-picker.ts",
+      "types": "./dist/time-picker.d.ts",
+      "default": "./dist/time-picker.js"
+    },
+    "./toolbar": {
+      "@m3/source": "./src/toolbar.ts",
+      "types": "./dist/toolbar.d.ts",
+      "default": "./dist/toolbar.js"
+    },
+    "./carousel": {
+      "@m3/source": "./src/carousel.ts",
+      "types": "./dist/carousel.d.ts",
+      "default": "./dist/carousel.js"
     }
   },
   "files": [