npm - @yamada-ui/react - Versions diffs - 2.0.10-dev-20260301101758 → 2.1.0-dev-20260302125757 - Mend

@yamada-ui/react 2.0.10-dev-20260301101758 → 2.1.0-dev-20260302125757

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (683) hide show

package/dist/cjs/index.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.cjs","names":[],"sources":["../../src/index.ts"],"sourcesContent":["export * from \"./core\"\nexport * from \"./theme\"\nexport * from \"./utils\"\n\nexport * from \"./components/accordion\"\nexport * from \"./components/airy\"\nexport * from \"./components/alert\"\nexport * from \"./components/alpha-slider\"\nexport * from \"./components/aspect-ratio\"\nexport * from \"./components/autocomplete\"\nexport * from \"./components/avatar\"\nexport * from \"./components/badge\"\nexport * from \"./components/bleed\"\nexport * from \"./components/blockquote\"\nexport * from \"./components/box\"\nexport * from \"./components/breadcrumb\"\nexport * from \"./components/button\"\nexport * from \"./components/calendar\"\nexport * from \"./components/card\"\nexport * from \"./components/carousel\"\nexport * from \"./components/center\"\nexport * from \"./components/checkbox\"\nexport * from \"./components/checkbox-card\"\nexport * from \"./components/circle-progress\"\nexport * from \"./components/client-only\"\nexport * from \"./components/close-button\"\nexport * from \"./components/code\"\nexport * from \"./components/collapse\"\nexport * from \"./components/color-picker\"\nexport * from \"./components/color-selector\"\nexport * from \"./components/color-swatch\"\nexport * from \"./components/container\"\nexport * from \"./components/data-list\"\nexport * from \"./components/date-picker\"\nexport * from \"./components/drawer\"\nexport * from \"./components/dropzone\"\nexport * from \"./components/editable\"\nexport * from \"./components/em\"\nexport * from \"./components/empty-state\"\nexport * from \"./components/fade\"\nexport * from \"./components/fade-scale\"\nexport * from \"./components/field\"\nexport * from \"./components/fieldset\"\nexport * from \"./components/file-button\"\nexport * from \"./components/file-input\"\nexport * from \"./components/flex\"\nexport * from \"./components/flip\"\nexport * from \"./components/float\"\nexport * from \"./components/focus-lock\"\nexport * from \"./components/for\"\nexport * from \"./components/format\"\nexport * from \"./components/grid\"\nexport * from \"./components/group\"\nexport * from \"./components/heading\"\nexport * from \"./components/highlight\"\nexport * from \"./components/hue-slider\"\nexport * from \"./components/icon\"\nexport * from \"./components/image\"\nexport * from \"./components/indicator\"\nexport * from \"./components/infinite-scroll-area\"\nexport * from \"./components/input\"\nexport * from \"./components/kbd\"\nexport * from \"./components/link\"\nexport * from \"./components/link-box\"\nexport * from \"./components/list\"\nexport * from \"./components/loading\"\nexport * from \"./components/mark\"\nexport * from \"./components/menu\"\nexport * from \"./components/modal\"\nexport * from \"./components/motion\"\nexport * from \"./components/native-select\"\nexport * from \"./components/native-table\"\nexport * from \"./components/notice\"\nexport * from \"./components/number-input\"\nexport * from \"./components/pagination\"\nexport * from \"./components/password-input\"\nexport * from \"./components/picture\"\nexport * from \"./components/pin-input\"\nexport * from \"./components/popover\"\nexport * from \"./components/portal\"\nexport * from \"./components/progress\"\nexport * from \"./components/radio\"\nexport * from \"./components/radio-card\"\nexport * from \"./components/rating\"\nexport * from \"./components/reorder\"\nexport * from \"./components/resizable\"\nexport * from \"./components/ripple\"\nexport * from \"./components/rotate\"\nexport * from \"./components/saturation-slider\"\nexport * from \"./components/scroll-area\"\nexport * from \"./components/segmented-control\"\nexport * from \"./components/select\"\nexport * from \"./components/separator\"\nexport * from \"./components/show\"\nexport * from \"./components/simple-grid\"\nexport * from \"./components/skeleton\"\nexport * from \"./components/slide\"\nexport * from \"./components/slide-fade\"\nexport * from \"./components/slider\"\nexport * from \"./components/slot\"\nexport * from \"./components/snacks\"\nexport * from \"./components/stack\"\nexport * from \"./components/stat\"\nexport * from \"./components/status\"\nexport * from \"./components/steps\"\nexport * from \"./components/switch\"\nexport * from \"./components/table\"\nexport * from \"./components/tabs\"\nexport * from \"./components/tag\"\nexport * from \"./components/text\"\nexport * from \"./components/textarea\"\nexport * from \"./components/timeline\"\nexport * from \"./components/toggle\"\nexport * from \"./components/tooltip\"\nexport * from \"./components/visually-hidden\"\nexport * from \"./components/wrap\"\n\nexport * from \"./hooks/use-animation\"\nexport * from \"./hooks/use-async\"\nexport * from \"./hooks/use-async-callback\"\nexport * from \"./hooks/use-boolean\"\nexport * from \"./hooks/use-breakpoint\"\nexport * from \"./hooks/use-clickable\"\nexport * from \"./hooks/use-clipboard\"\nexport * from \"./hooks/use-combobox\"\nexport * from \"./hooks/use-controllable-state\"\nexport * from \"./hooks/use-counter\"\nexport * from \"./hooks/use-descendants\"\nexport * from \"./hooks/use-disclosure\"\nexport * from \"./hooks/use-event-listener\"\nexport * from \"./hooks/use-eye-dropper\"\nexport * from \"./hooks/use-field-sizing\"\nexport * from \"./hooks/use-focus\"\nexport * from \"./hooks/use-hover\"\nexport * from \"./hooks/use-idle\"\nexport * from \"./hooks/use-interval\"\nexport * from \"./hooks/use-lazy-mount\"\nexport * from \"./hooks/use-local-storage\"\nexport * from \"./hooks/use-media-query\"\nexport * from \"./hooks/use-mounted\"\nexport * from \"./hooks/use-online\"\nexport * from \"./hooks/use-os\"\nexport * from \"./hooks/use-outside-click\"\nexport * from \"./hooks/use-pan-event\"\nexport * from \"./hooks/use-popper\"\nexport * from \"./hooks/use-previous\"\nexport * from \"./hooks/use-processing\"\nexport * from \"./hooks/use-resize-observer\"\nexport * from \"./hooks/use-timeout\"\nexport * from \"./hooks/use-value\"\nexport * from \"./hooks/use-window-event\"\n\nexport * from \"./providers/i18n-provider\"\nexport * from \"./providers/ui-provider\"\n"],"mappings":""}
1	+ {"version":3,"file":"index.cjs","names":[],"sources":["../../src/index.ts"],"sourcesContent":["export * from \"./core\"\nexport * from \"./theme\"\nexport * from \"./utils\"\n\nexport * from \"./components/accordion\"\nexport * from \"./components/airy\"\nexport * from \"./components/alert\"\nexport * from \"./components/alpha-slider\"\nexport * from \"./components/aspect-ratio\"\nexport * from \"./components/autocomplete\"\nexport * from \"./components/avatar\"\nexport * from \"./components/badge\"\nexport * from \"./components/bleed\"\nexport * from \"./components/blockquote\"\nexport * from \"./components/box\"\nexport * from \"./components/breadcrumb\"\nexport * from \"./components/button\"\nexport * from \"./components/calendar\"\nexport * from \"./components/card\"\nexport * from \"./components/carousel\"\nexport * from \"./components/center\"\nexport * from \"./components/chart\"\nexport * from \"./components/checkbox\"\nexport * from \"./components/checkbox-card\"\nexport * from \"./components/circle-progress\"\nexport * from \"./components/client-only\"\nexport * from \"./components/close-button\"\nexport * from \"./components/code\"\nexport * from \"./components/collapse\"\nexport * from \"./components/color-picker\"\nexport * from \"./components/color-selector\"\nexport * from \"./components/color-swatch\"\nexport * from \"./components/container\"\nexport * from \"./components/data-list\"\nexport * from \"./components/date-picker\"\nexport * from \"./components/drawer\"\nexport * from \"./components/dropzone\"\nexport * from \"./components/editable\"\nexport * from \"./components/em\"\nexport * from \"./components/empty-state\"\nexport * from \"./components/fade\"\nexport * from \"./components/fade-scale\"\nexport * from \"./components/field\"\nexport * from \"./components/fieldset\"\nexport * from \"./components/file-button\"\nexport * from \"./components/file-input\"\nexport * from \"./components/flex\"\nexport * from \"./components/flip\"\nexport * from \"./components/float\"\nexport * from \"./components/focus-lock\"\nexport * from \"./components/for\"\nexport * from \"./components/form\"\nexport * from \"./components/format\"\nexport * from \"./components/grid\"\nexport * from \"./components/group\"\nexport * from \"./components/heading\"\nexport * from \"./components/highlight\"\nexport * from \"./components/hue-slider\"\nexport * from \"./components/icon\"\nexport * from \"./components/image\"\nexport * from \"./components/indicator\"\nexport * from \"./components/infinite-scroll-area\"\nexport * from \"./components/input\"\nexport * from \"./components/kbd\"\nexport * from \"./components/link\"\nexport * from \"./components/link-box\"\nexport * from \"./components/list\"\nexport * from \"./components/loading\"\nexport * from \"./components/mark\"\nexport * from \"./components/menu\"\nexport * from \"./components/modal\"\nexport * from \"./components/motion\"\nexport * from \"./components/native-accordion\"\nexport * from \"./components/native-popover\"\nexport * from \"./components/native-select\"\nexport * from \"./components/native-table\"\nexport * from \"./components/notice\"\nexport * from \"./components/number-input\"\nexport * from \"./components/pagination\"\nexport * from \"./components/password-input\"\nexport * from \"./components/picture\"\nexport * from \"./components/pin-input\"\nexport * from \"./components/popover\"\nexport * from \"./components/portal\"\nexport * from \"./components/progress\"\nexport * from \"./components/qr-code\"\nexport * from \"./components/radio\"\nexport * from \"./components/radio-card\"\nexport * from \"./components/rating\"\nexport * from \"./components/reorder\"\nexport * from \"./components/resizable\"\nexport * from \"./components/ripple\"\nexport * from \"./components/rotate\"\nexport * from \"./components/saturation-slider\"\nexport * from \"./components/scroll-area\"\nexport * from \"./components/segmented-control\"\nexport * from \"./components/select\"\nexport * from \"./components/separator\"\nexport * from \"./components/show\"\nexport * from \"./components/simple-grid\"\nexport * from \"./components/skeleton\"\nexport * from \"./components/slide\"\nexport * from \"./components/slide-fade\"\nexport * from \"./components/slider\"\nexport * from \"./components/slot\"\nexport * from \"./components/snacks\"\nexport * from \"./components/stack\"\nexport * from \"./components/stat\"\nexport * from \"./components/status\"\nexport * from \"./components/steps\"\nexport * from \"./components/switch\"\nexport * from \"./components/table\"\nexport * from \"./components/tabs\"\nexport * from \"./components/tag\"\nexport * from \"./components/text\"\nexport * from \"./components/textarea\"\nexport * from \"./components/timeline\"\nexport * from \"./components/tip\"\nexport * from \"./components/toggle\"\nexport * from \"./components/tooltip\"\nexport * from \"./components/visually-hidden\"\nexport * from \"./components/wrap\"\n\nexport * from \"./hooks/use-animation\"\nexport * from \"./hooks/use-async\"\nexport * from \"./hooks/use-async-callback\"\nexport * from \"./hooks/use-boolean\"\nexport * from \"./hooks/use-breakpoint\"\nexport * from \"./hooks/use-clickable\"\nexport * from \"./hooks/use-clipboard\"\nexport * from \"./hooks/use-combobox\"\nexport * from \"./hooks/use-controllable-state\"\nexport * from \"./hooks/use-counter\"\nexport * from \"./hooks/use-descendants\"\nexport * from \"./hooks/use-disclosure\"\nexport * from \"./hooks/use-event-listener\"\nexport * from \"./hooks/use-eye-dropper\"\nexport * from \"./hooks/use-field-sizing\"\nexport * from \"./hooks/use-focus\"\nexport * from \"./hooks/use-hover\"\nexport * from \"./hooks/use-idle\"\nexport * from \"./hooks/use-interval\"\nexport * from \"./hooks/use-lazy-mount\"\nexport * from \"./hooks/use-local-storage\"\nexport * from \"./hooks/use-media-query\"\nexport * from \"./hooks/use-mounted\"\nexport * from \"./hooks/use-online\"\nexport * from \"./hooks/use-os\"\nexport * from \"./hooks/use-outside-click\"\nexport * from \"./hooks/use-pan-event\"\nexport * from \"./hooks/use-popper\"\nexport * from \"./hooks/use-previous\"\nexport * from \"./hooks/use-processing\"\nexport * from \"./hooks/use-resize-observer\"\nexport * from \"./hooks/use-timeout\"\nexport * from \"./hooks/use-value\"\nexport * from \"./hooks/use-window-event\"\n\nexport * from \"./providers/i18n-provider\"\nexport * from \"./providers/ui-provider\"\n"],"mappings":""}

package/dist/cjs/theme/styles/reset-style.cjs CHANGED Viewed

@@ -16,6 +16,7 @@ const resetStyle = require_config.defineStyles.resetStyle({
 	"[contenteditable]": { outline: "none" },
 	"[hidden]:where(:not([hidden='until-found']))": { display: "none !important" },
 	"[type='time']::-webkit-calendar-picker-indicator": { display: "none" },
+	"::-webkit-details-marker": { display: "none" },
 	a: {
 		color: "inherit",
 		textDecoration: "none"

package/dist/cjs/theme/styles/reset-style.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"reset-style.cjs","names":["defineStyles"],"sources":["../../../../src/theme/styles/reset-style.ts"],"sourcesContent":["import { defineStyles } from \"../../core\"\n\nexport const resetStyle = defineStyles.resetStyle({\n \", ::before, *::after\": {\n boxSizing: \"border-box\",\n margin: 0,\n padding: 0,\n },\n\n \"::-webkit-file-upload-button\": {\n font: \"inherit\",\n WebkitAppearance: \"button\",\n },\n\n \"::-webkit-search-cancel-button, ::-webkit-search-decoration\": {\n WebkitAppearance: \"none\",\n },\n\n \"[contenteditable]\": {\n outline: \"none\",\n },\n\n \"[hidden]:where(:not([hidden='until-found']))\": {\n display: \"none !important\",\n },\n\n \"[type='time']::-webkit-calendar-picker-indicator\": {\n display: \"none\",\n },\n\n a: {\n color: \"inherit\",\n textDecoration: \"none\",\n },\n\n \"abbr[title]\": {\n textDecoration: \"underline dotted\",\n },\n\n \"b, strong\": {\n fontWeight: \"bolder\",\n },\n\n \"button, input, optgroup, select, textarea\": {\n appearance: \"none\",\n backgroundColor: \"transparent\",\n border: 0,\n borderRadius: 0,\n color: \"inherit\",\n font: \"inherit\",\n fontFeatureSettings: \"inherit\",\n fontVariationSettings: \"inherit\",\n letterSpacing: \"inherit\",\n outline: 0,\n WebkitAppearance: \"none\",\n },\n\n \"code, kbd, samp, pre\": {\n fontFamily: \"inherit\",\n fontSize: \"1em\",\n },\n\n fieldset: {\n border: 0,\n minWidth: 0,\n },\n\n \"h1, h2, h3, h4, h5, h6\": {\n fontSize: \"inherit\",\n fontWeight: \"inherit\",\n },\n\n hr: {\n blockSize: 0,\n border: \"none\",\n borderBlockStart: \"1px solid\",\n color: \"inherit\",\n overflow: \"visible\",\n },\n\n html: {\n fontFamily:\n \"system-ui, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji'\",\n lineHeight: 1.5,\n WebkitTapHighlightColor: \"transparent\",\n WebkitTextSizeAdjust: \"100%\",\n },\n\n \"img, svg, video, canvas, audio, iframe, embed, object\": {\n display: \"block\",\n },\n\n \"input[type='number']::-webkit-inner-spin-button, input[type='number']::-webkit-outer-spin-button\":\n {\n display: \"none\",\n },\n\n \"input[type='search']\": {\n outlineOffset: \"-2px\",\n },\n\n legend: {\n display: \"table\",\n float: \"left\",\n width: \"100%\",\n },\n\n mark: {\n backgroundColor: \"inherit\",\n color: \"inherit\",\n },\n\n progress: {\n verticalAlign: \"baseline\",\n },\n\n small: {\n fontSize: \"80%\",\n },\n\n sub: {\n bottom: \"-0.25em\",\n },\n\n \"sub, sup\": {\n fontSize: \"75%\",\n lineHeight: 0,\n position: \"relative\",\n verticalAlign: \"baseline\",\n },\n\n summary: {\n display: \"list-item\",\n },\n\n sup: {\n top: \"-0.5em\",\n },\n\n \"ul, ol\": {\n listStyle: \"none\",\n },\n\n \"@media (prefers-reduced-motion: no-preference)\": {\n \":where(html:focus-within)\": {\n scrollBehavior: \"smooth\",\n },\n },\n\n \":where(html:has(dialog:modal[open]))\": {\n overflow: \"clip\",\n },\n\n \":where(dialog, [popover])\": {\n background: \"none\",\n border: \"none\",\n color: \"inherit\",\n inset: \"unset\",\n maxHeight: \"unset\",\n maxWidth: \"unset\",\n overflow: \"unset\",\n },\n\n \":where(dialog:not([open], [popover]), [popover]:not(:popover-open))\": {\n display: \"none !important\",\n },\n})\n"],"mappings":";;;;AAEA,MAAa,aAAaA,4BAAa,WAAW;CAChD,0BAA0B;EACxB,WAAW;EACX,QAAQ;EACR,SAAS;EACV;CAED,gCAAgC;EAC9B,MAAM;EACN,kBAAkB;EACnB;CAED,+DAA+D,EAC7D,kBAAkB,QACnB;CAED,qBAAqB,EACnB,SAAS,QACV;CAED,gDAAgD,EAC9C,SAAS,mBACV;CAED,oDAAoD,EAClD,SAAS,QACV;CAED,GAAG;EACD,OAAO;EACP,gBAAgB;EACjB;CAED,eAAe,EACb,gBAAgB,oBACjB;CAED,aAAa,EACX,YAAY,UACb;CAED,6CAA6C;EAC3C,YAAY;EACZ,iBAAiB;EACjB,QAAQ;EACR,cAAc;EACd,OAAO;EACP,MAAM;EACN,qBAAqB;EACrB,uBAAuB;EACvB,eAAe;EACf,SAAS;EACT,kBAAkB;EACnB;CAED,wBAAwB;EACtB,YAAY;EACZ,UAAU;EACX;CAED,UAAU;EACR,QAAQ;EACR,UAAU;EACX;CAED,0BAA0B;EACxB,UAAU;EACV,YAAY;EACb;CAED,IAAI;EACF,WAAW;EACX,QAAQ;EACR,kBAAkB;EAClB,OAAO;EACP,UAAU;EACX;CAED,MAAM;EACJ,YACE;EACF,YAAY;EACZ,yBAAyB;EACzB,sBAAsB;EACvB;CAED,yDAAyD,EACvD,SAAS,SACV;CAED,oGACE,EACE,SAAS,QACV;CAEH,wBAAwB,EACtB,eAAe,QAChB;CAED,QAAQ;EACN,SAAS;EACT,OAAO;EACP,OAAO;EACR;CAED,MAAM;EACJ,iBAAiB;EACjB,OAAO;EACR;CAED,UAAU,EACR,eAAe,YAChB;CAED,OAAO,EACL,UAAU,OACX;CAED,KAAK,EACH,QAAQ,WACT;CAED,YAAY;EACV,UAAU;EACV,YAAY;EACZ,UAAU;EACV,eAAe;EAChB;CAED,SAAS,EACP,SAAS,aACV;CAED,KAAK,EACH,KAAK,UACN;CAED,UAAU,EACR,WAAW,QACZ;CAED,kDAAkD,EAChD,6BAA6B,EAC3B,gBAAgB,UACjB,EACF;CAED,wCAAwC,EACtC,UAAU,QACX;CAED,6BAA6B;EAC3B,YAAY;EACZ,QAAQ;EACR,OAAO;EACP,OAAO;EACP,WAAW;EACX,UAAU;EACV,UAAU;EACX;CAED,uEAAuE,EACrE,SAAS,mBACV;CACF,CAAC"}
1	+ {"version":3,"file":"reset-style.cjs","names":["defineStyles"],"sources":["../../../../src/theme/styles/reset-style.ts"],"sourcesContent":["import { defineStyles } from \"../../core\"\n\nexport const resetStyle = defineStyles.resetStyle({\n \", ::before, *::after\": {\n boxSizing: \"border-box\",\n margin: 0,\n padding: 0,\n },\n\n \"::-webkit-file-upload-button\": {\n font: \"inherit\",\n WebkitAppearance: \"button\",\n },\n\n \"::-webkit-search-cancel-button, ::-webkit-search-decoration\": {\n WebkitAppearance: \"none\",\n },\n\n \"[contenteditable]\": {\n outline: \"none\",\n },\n\n \"[hidden]:where(:not([hidden='until-found']))\": {\n display: \"none !important\",\n },\n\n \"[type='time']::-webkit-calendar-picker-indicator\": {\n display: \"none\",\n },\n\n \"::-webkit-details-marker\": {\n display: \"none\",\n },\n\n a: {\n color: \"inherit\",\n textDecoration: \"none\",\n },\n\n \"abbr[title]\": {\n textDecoration: \"underline dotted\",\n },\n\n \"b, strong\": {\n fontWeight: \"bolder\",\n },\n\n \"button, input, optgroup, select, textarea\": {\n appearance: \"none\",\n backgroundColor: \"transparent\",\n border: 0,\n borderRadius: 0,\n color: \"inherit\",\n font: \"inherit\",\n fontFeatureSettings: \"inherit\",\n fontVariationSettings: \"inherit\",\n letterSpacing: \"inherit\",\n outline: 0,\n WebkitAppearance: \"none\",\n },\n\n \"code, kbd, samp, pre\": {\n fontFamily: \"inherit\",\n fontSize: \"1em\",\n },\n\n fieldset: {\n border: 0,\n minWidth: 0,\n },\n\n \"h1, h2, h3, h4, h5, h6\": {\n fontSize: \"inherit\",\n fontWeight: \"inherit\",\n },\n\n hr: {\n blockSize: 0,\n border: \"none\",\n borderBlockStart: \"1px solid\",\n color: \"inherit\",\n overflow: \"visible\",\n },\n\n html: {\n fontFamily:\n \"system-ui, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji'\",\n lineHeight: 1.5,\n WebkitTapHighlightColor: \"transparent\",\n WebkitTextSizeAdjust: \"100%\",\n },\n\n \"img, svg, video, canvas, audio, iframe, embed, object\": {\n display: \"block\",\n },\n\n \"input[type='number']::-webkit-inner-spin-button, input[type='number']::-webkit-outer-spin-button\":\n {\n display: \"none\",\n },\n\n \"input[type='search']\": {\n outlineOffset: \"-2px\",\n },\n\n legend: {\n display: \"table\",\n float: \"left\",\n width: \"100%\",\n },\n\n mark: {\n backgroundColor: \"inherit\",\n color: \"inherit\",\n },\n\n progress: {\n verticalAlign: \"baseline\",\n },\n\n small: {\n fontSize: \"80%\",\n },\n\n sub: {\n bottom: \"-0.25em\",\n },\n\n \"sub, sup\": {\n fontSize: \"75%\",\n lineHeight: 0,\n position: \"relative\",\n verticalAlign: \"baseline\",\n },\n\n summary: {\n display: \"list-item\",\n },\n\n sup: {\n top: \"-0.5em\",\n },\n\n \"ul, ol\": {\n listStyle: \"none\",\n },\n\n \"@media (prefers-reduced-motion: no-preference)\": {\n \":where(html:focus-within)\": {\n scrollBehavior: \"smooth\",\n },\n },\n\n \":where(html:has(dialog:modal[open]))\": {\n overflow: \"clip\",\n },\n\n \":where(dialog, [popover])\": {\n background: \"none\",\n border: \"none\",\n color: \"inherit\",\n inset: \"unset\",\n maxHeight: \"unset\",\n maxWidth: \"unset\",\n overflow: \"unset\",\n },\n\n \":where(dialog:not([open], [popover]), [popover]:not(:popover-open))\": {\n display: \"none !important\",\n },\n})\n"],"mappings":";;;;AAEA,MAAa,aAAaA,4BAAa,WAAW;CAChD,0BAA0B;EACxB,WAAW;EACX,QAAQ;EACR,SAAS;EACV;CAED,gCAAgC;EAC9B,MAAM;EACN,kBAAkB;EACnB;CAED,+DAA+D,EAC7D,kBAAkB,QACnB;CAED,qBAAqB,EACnB,SAAS,QACV;CAED,gDAAgD,EAC9C,SAAS,mBACV;CAED,oDAAoD,EAClD,SAAS,QACV;CAED,4BAA4B,EAC1B,SAAS,QACV;CAED,GAAG;EACD,OAAO;EACP,gBAAgB;EACjB;CAED,eAAe,EACb,gBAAgB,oBACjB;CAED,aAAa,EACX,YAAY,UACb;CAED,6CAA6C;EAC3C,YAAY;EACZ,iBAAiB;EACjB,QAAQ;EACR,cAAc;EACd,OAAO;EACP,MAAM;EACN,qBAAqB;EACrB,uBAAuB;EACvB,eAAe;EACf,SAAS;EACT,kBAAkB;EACnB;CAED,wBAAwB;EACtB,YAAY;EACZ,UAAU;EACX;CAED,UAAU;EACR,QAAQ;EACR,UAAU;EACX;CAED,0BAA0B;EACxB,UAAU;EACV,YAAY;EACb;CAED,IAAI;EACF,WAAW;EACX,QAAQ;EACR,kBAAkB;EAClB,OAAO;EACP,UAAU;EACX;CAED,MAAM;EACJ,YACE;EACF,YAAY;EACZ,yBAAyB;EACzB,sBAAsB;EACvB;CAED,yDAAyD,EACvD,SAAS,SACV;CAED,oGACE,EACE,SAAS,QACV;CAEH,wBAAwB,EACtB,eAAe,QAChB;CAED,QAAQ;EACN,SAAS;EACT,OAAO;EACP,OAAO;EACR;CAED,MAAM;EACJ,iBAAiB;EACjB,OAAO;EACR;CAED,UAAU,EACR,eAAe,YAChB;CAED,OAAO,EACL,UAAU,OACX;CAED,KAAK,EACH,QAAQ,WACT;CAED,YAAY;EACV,UAAU;EACV,YAAY;EACZ,UAAU;EACV,eAAe;EAChB;CAED,SAAS,EACP,SAAS,aACV;CAED,KAAK,EACH,KAAK,UACN;CAED,UAAU,EACR,WAAW,QACZ;CAED,kDAAkD,EAChD,6BAA6B,EAC3B,gBAAgB,UACjB,EACF;CAED,wCAAwC,EACtC,UAAU,QACX;CAED,6BAA6B;EAC3B,YAAY;EACZ,QAAQ;EACR,OAAO;EACP,OAAO;EACP,WAAW;EACX,UAAU;EACV,UAAU;EACX;CAED,uEAAuE,EACrE,SAAS,mBACV;CACF,CAAC"}

package/dist/cjs/utils/children.cjs CHANGED Viewed

@@ -84,7 +84,15 @@ function usePickChildren(children, ...types) {
 function splitChildren(children, ...types) {
 	const validChildren = getValidChildren(children);
 	if ((0, _yamada_ui_utils.isEmpty)(validChildren)) return [children];
-	const pickedChildren = types.map((types$1) => (0, _yamada_ui_utils.isArray)(types$1) ? findChild(validChildren, ...types$1) : findChild(validChildren, types$1));
+	const pickedChildren = types.map((types$1) => {
+		if ((0, _yamada_ui_utils.isArray)(types$1)) {
+			const pickedChildren$1 = pickChildren(validChildren, ...types$1);
+			return !(0, _yamada_ui_utils.isEmpty)(pickedChildren$1) ? pickedChildren$1 : void 0;
+		} else {
+			const pickedChildren$1 = pickChildren(validChildren, types$1);
+			return !(0, _yamada_ui_utils.isEmpty)(pickedChildren$1) ? pickedChildren$1 : void 0;
+		}
+	});
 	return [omitChildren(validChildren, ...types.flat()), ...pickedChildren];
 }
 function useSplitChildren(children, ...types) {

package/dist/cjs/utils/children.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"children.cjs","names":["React","children","types"],"sources":["../../../src/utils/children.tsx"],"sourcesContent":["import {\n isArray,\n isEmpty,\n isNumber,\n isString,\n isUndefined,\n} from \"@yamada-ui/utils\"\nimport * as React from \"react\"\n\nexport function getValidChildren(\n children: React.ReactNode,\n): React.ReactElement<any>[] {\n return React.Children.toArray(children).filter((child) =>\n React.isValidElement(child),\n )\n}\n\nexport function useValidChildren(children: React.ReactNode) {\n return React.useMemo(() => getValidChildren(children), [children])\n}\n\nexport function isValidElement(child: any): child is React.ReactNode {\n return React.isValidElement(child) \|\| isString(child) \|\| isNumber(child)\n}\n\nexport function isSomeDisplayName(a: any, b: any): boolean {\n if (isUndefined(a) \|\| isUndefined(b)) return false\n\n if (isArray(a)) {\n if (a.includes(b)) return true\n if (!!b.displayName && a.includes(b.displayName)) return true\n if (!!b.name && a.includes(b.name)) return true\n } else {\n if (a === b) return true\n if (!!a.displayName && !!b.displayName && a.displayName === b.displayName)\n return true\n if (!!a.name && !!b.name && a.name === b.name) return true\n if (!!a.displayName && !!b.name && a.displayName === b.name) return true\n if (!!a.name && !!b.displayName && a.name === b.displayName) return true\n }\n\n return false\n}\n\nexport function isSomeElement(a: any, b: any): boolean {\n if (isUndefined(a) \|\| isUndefined(b)) return false\n if (a === b) return true\n if (isSomeDisplayName(a, b)) return true\n\n a = a._payload?.value\n\n if (isUndefined(a)) return false\n if (isSomeDisplayName(a, b)) return true\n\n return false\n}\n\nexport function findChild<Y = any>(\n children: React.ReactElement[],\n ...types: (React.JSXElementConstructor<any> \| string)[]\n): React.ReactElement<Y> \| undefined {\n const child = children.find((child) =>\n types.some((type) => isSomeElement(child.type, type)),\n )\n\n return child as React.ReactElement<Y> \| undefined\n}\n\nexport function useFindChild<Y = any>(\n children: React.ReactElement[],\n ...types: (React.JSXElementConstructor<any> \| string)[]\n): React.ReactElement<Y> \| undefined {\n const typesRef = React.useRef(types)\n\n return React.useMemo(\n () => findChild<Y>(children, ...typesRef.current),\n [children],\n )\n}\n\nexport function findChildren<Y = any, M = any>(\n children: React.ReactElement[],\n ...types: (React.JSXElementConstructor<any> \| string)[]\n): [React.ReactElement<Y> \| undefined, ...React.ReactElement<M>[]] {\n const child = findChild(children, ...types)\n\n if (child) {\n return children.sort((a, b) => {\n if (types.some((type) => isSomeElement(a.type, type))) {\n return -1\n } else if (types.some((type) => isSomeElement(b.type, type))) {\n return 1\n } else {\n return 0\n }\n }) as [React.ReactElement<Y> \| undefined, ...React.ReactElement<M>[]]\n } else {\n return [undefined, ...(children as React.ReactElement<M>[])]\n }\n}\n\nexport function useFindChildren<Y = any, M = any>(\n children: React.ReactElement<M>[],\n ...types: (React.JSXElementConstructor<any> \| string)[]\n): [React.ReactElement<Y> \| undefined, ...React.ReactElement<M>[]] {\n const typesRef = React.useRef(types)\n\n return React.useMemo(\n () => findChildren<Y, M>(children, ...typesRef.current),\n [children],\n )\n}\n\nexport function includesChildren(\n children: React.ReactElement<any>[],\n ...types: (React.JSXElementConstructor<any> \| string)[]\n): boolean {\n return children.some((child) => {\n if (types.some((type) => isSomeElement(child.type, type))) return true\n\n const children = getValidChildren(child.props.children)\n\n return children.length ? includesChildren(children, ...types) : false\n })\n}\n\nexport function useIncludesChildren(\n children: React.ReactElement<any>[],\n ...types: (React.JSXElementConstructor<any> \| string)[]\n): boolean {\n return React.useMemo(\n () => includesChildren(children, ...types),\n [children, types],\n )\n}\n\nexport function omitChildren<Y = any>(\n children: React.ReactElement[],\n ...types: (React.JSXElementConstructor<any> \| string)[]\n): React.ReactElement<Y>[] {\n return children.filter((child) =>\n types.every((type) => !isSomeElement(child.type, type)),\n ) as React.ReactElement<Y>[]\n}\n\nexport function useOmitChildren<Y = any>(\n children: React.ReactElement<any>[],\n ...types: (React.JSXElementConstructor<any> \| string)[]\n): React.ReactElement<Y>[] {\n const typesRef = React.useRef(types)\n\n return React.useMemo(\n () => omitChildren<Y>(children, ...typesRef.current),\n [children],\n )\n}\n\nexport function pickChildren<Y = any>(\n children: React.ReactElement[],\n ...types: (React.JSXElementConstructor<any> \| string)[]\n): React.ReactElement<Y>[] {\n return children.filter((child) =>\n types.some((type) => isSomeElement(child.type, type)),\n ) as React.ReactElement<Y>[]\n}\n\nexport function usePickChildren<Y = any>(\n children: React.ReactElement<any>[],\n ...types: (React.JSXElementConstructor<any> \| string)[]\n): React.ReactElement<Y>[] {\n const typesRef = React.useRef(types)\n\n return React.useMemo(\n () => pickChildren<Y>(children, ...typesRef.current),\n [children],\n )\n}\n\nexport function splitChildren<Y = any, M = any>(\n children: React.ReactNode,\n ...types: (\n \| (React.JSXElementConstructor<any> \| string)[]\n \| React.JSXElementConstructor<any>\n \| string\n )[]\n): [\n React.ReactElement<M>[] \| React.ReactNode,\n ...(React.ReactElement<Y> \| undefined)[],\n] {\n const validChildren = getValidChildren(children)\n\n if (isEmpty(validChildren)) return [children]\n\n const pickedChildren = types.map((types) =>\n isArray(types)\n ? findChild(validChildren, ...types)\n : findChild(validChildren, types),\n )\n\n const omittedChildren = omitChildren(validChildren, ...types.flat())\n\n return [omittedChildren, ...pickedChildren] as const\n}\n\nexport function useSplitChildren<Y = any, M = any>(\n children: React.ReactNode,\n ...types: (\n \| (React.JSXElementConstructor<any> \| string)[]\n \| React.JSXElementConstructor<any>\n \| string\n )[]\n): [\n React.ReactElement<M>[] \| React.ReactNode,\n ...(React.ReactElement<Y> \| undefined)[],\n] {\n const typesRef = React.useRef(types)\n\n return React.useMemo(\n () => splitChildren<Y, M>(children, ...typesRef.current),\n [children],\n )\n}\n\nexport const wrapOrPassProps = <Y extends React.PropsWithChildren>(\n Component: React.FC<Y>,\n nodeOrProps: React.ReactNode \| Y,\n additionalProps?: Y,\n) => {\n if (isUndefined(nodeOrProps)) {\n return null\n } else if (isValidElement(nodeOrProps)) {\n additionalProps ??= {} as Y\n additionalProps.children = nodeOrProps\n\n return <Component {...additionalProps} />\n } else {\n return <Component {...additionalProps} {...nodeOrProps} />\n }\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"children.cjs","names":["React","children","types","pickedChildren"],"sources":["../../../src/utils/children.tsx"],"sourcesContent":["import {\n isArray,\n isEmpty,\n isNumber,\n isString,\n isUndefined,\n} from \"@yamada-ui/utils\"\nimport * as React from \"react\"\n\nexport function getValidChildren(\n children: React.ReactNode,\n): React.ReactElement<any>[] {\n return React.Children.toArray(children).filter((child) =>\n React.isValidElement(child),\n )\n}\n\nexport function useValidChildren(children: React.ReactNode) {\n return React.useMemo(() => getValidChildren(children), [children])\n}\n\nexport function isValidElement(child: any): child is React.ReactNode {\n return React.isValidElement(child) \|\| isString(child) \|\| isNumber(child)\n}\n\nexport function isSomeDisplayName(a: any, b: any): boolean {\n if (isUndefined(a) \|\| isUndefined(b)) return false\n\n if (isArray(a)) {\n if (a.includes(b)) return true\n if (!!b.displayName && a.includes(b.displayName)) return true\n if (!!b.name && a.includes(b.name)) return true\n } else {\n if (a === b) return true\n if (!!a.displayName && !!b.displayName && a.displayName === b.displayName)\n return true\n if (!!a.name && !!b.name && a.name === b.name) return true\n if (!!a.displayName && !!b.name && a.displayName === b.name) return true\n if (!!a.name && !!b.displayName && a.name === b.displayName) return true\n }\n\n return false\n}\n\nexport function isSomeElement(a: any, b: any): boolean {\n if (isUndefined(a) \|\| isUndefined(b)) return false\n if (a === b) return true\n if (isSomeDisplayName(a, b)) return true\n\n a = a._payload?.value\n\n if (isUndefined(a)) return false\n if (isSomeDisplayName(a, b)) return true\n\n return false\n}\n\nexport function findChild<Y = any>(\n children: React.ReactElement[],\n ...types: (React.JSXElementConstructor<any> \| string)[]\n): React.ReactElement<Y> \| undefined {\n const child = children.find((child) =>\n types.some((type) => isSomeElement(child.type, type)),\n )\n\n return child as React.ReactElement<Y> \| undefined\n}\n\nexport function useFindChild<Y = any>(\n children: React.ReactElement[],\n ...types: (React.JSXElementConstructor<any> \| string)[]\n): React.ReactElement<Y> \| undefined {\n const typesRef = React.useRef(types)\n\n return React.useMemo(\n () => findChild<Y>(children, ...typesRef.current),\n [children],\n )\n}\n\nexport function findChildren<Y = any, M = any>(\n children: React.ReactElement[],\n ...types: (React.JSXElementConstructor<any> \| string)[]\n): [React.ReactElement<Y> \| undefined, ...React.ReactElement<M>[]] {\n const child = findChild(children, ...types)\n\n if (child) {\n return children.sort((a, b) => {\n if (types.some((type) => isSomeElement(a.type, type))) {\n return -1\n } else if (types.some((type) => isSomeElement(b.type, type))) {\n return 1\n } else {\n return 0\n }\n }) as [React.ReactElement<Y> \| undefined, ...React.ReactElement<M>[]]\n } else {\n return [undefined, ...(children as React.ReactElement<M>[])]\n }\n}\n\nexport function useFindChildren<Y = any, M = any>(\n children: React.ReactElement<M>[],\n ...types: (React.JSXElementConstructor<any> \| string)[]\n): [React.ReactElement<Y> \| undefined, ...React.ReactElement<M>[]] {\n const typesRef = React.useRef(types)\n\n return React.useMemo(\n () => findChildren<Y, M>(children, ...typesRef.current),\n [children],\n )\n}\n\nexport function includesChildren(\n children: React.ReactElement<any>[],\n ...types: (React.JSXElementConstructor<any> \| string)[]\n): boolean {\n return children.some((child) => {\n if (types.some((type) => isSomeElement(child.type, type))) return true\n\n const children = getValidChildren(child.props.children)\n\n return children.length ? includesChildren(children, ...types) : false\n })\n}\n\nexport function useIncludesChildren(\n children: React.ReactElement<any>[],\n ...types: (React.JSXElementConstructor<any> \| string)[]\n): boolean {\n return React.useMemo(\n () => includesChildren(children, ...types),\n [children, types],\n )\n}\n\nexport function omitChildren<Y = any>(\n children: React.ReactElement[],\n ...types: (React.JSXElementConstructor<any> \| string)[]\n): React.ReactElement<Y>[] {\n return children.filter((child) =>\n types.every((type) => !isSomeElement(child.type, type)),\n ) as React.ReactElement<Y>[]\n}\n\nexport function useOmitChildren<Y = any>(\n children: React.ReactElement<any>[],\n ...types: (React.JSXElementConstructor<any> \| string)[]\n): React.ReactElement<Y>[] {\n const typesRef = React.useRef(types)\n\n return React.useMemo(\n () => omitChildren<Y>(children, ...typesRef.current),\n [children],\n )\n}\n\nexport function pickChildren<Y = any>(\n children: React.ReactElement[],\n ...types: (React.JSXElementConstructor<any> \| string)[]\n): React.ReactElement<Y>[] {\n return children.filter((child) =>\n types.some((type) => isSomeElement(child.type, type)),\n ) as React.ReactElement<Y>[]\n}\n\nexport function usePickChildren<Y = any>(\n children: React.ReactElement<any>[],\n ...types: (React.JSXElementConstructor<any> \| string)[]\n): React.ReactElement<Y>[] {\n const typesRef = React.useRef(types)\n\n return React.useMemo(\n () => pickChildren<Y>(children, ...typesRef.current),\n [children],\n )\n}\n\nexport function splitChildren<Y = any, M = any>(\n children: React.ReactNode,\n ...types: (\n \| (React.JSXElementConstructor<any> \| string)[]\n \| React.JSXElementConstructor<any>\n \| string\n )[]\n): [\n React.ReactElement<M>[] \| React.ReactNode,\n ...(React.ReactElement<Y>[] \| undefined)[],\n] {\n const validChildren = getValidChildren(children)\n\n if (isEmpty(validChildren)) return [children]\n\n const pickedChildren = types.map((types) => {\n if (isArray(types)) {\n const pickedChildren = pickChildren(validChildren, ...types)\n\n return !isEmpty(pickedChildren) ? pickedChildren : undefined\n } else {\n const pickedChildren = pickChildren(validChildren, types)\n\n return !isEmpty(pickedChildren) ? pickedChildren : undefined\n }\n })\n\n const omittedChildren = omitChildren(validChildren, ...types.flat())\n\n return [omittedChildren, ...pickedChildren] as const\n}\n\nexport function useSplitChildren<Y = any, M = any>(\n children: React.ReactNode,\n ...types: (\n \| (React.JSXElementConstructor<any> \| string)[]\n \| React.JSXElementConstructor<any>\n \| string\n )[]\n): [\n React.ReactElement<M>[] \| React.ReactNode,\n ...(React.ReactElement<Y>[] \| undefined)[],\n] {\n const typesRef = React.useRef(types)\n\n return React.useMemo(\n () => splitChildren<Y, M>(children, ...typesRef.current),\n [children],\n )\n}\n\nexport const wrapOrPassProps = <Y extends React.PropsWithChildren>(\n Component: React.FC<Y>,\n nodeOrProps: React.ReactNode \| Y,\n additionalProps?: Y,\n) => {\n if (isUndefined(nodeOrProps)) {\n return null\n } else if (isValidElement(nodeOrProps)) {\n additionalProps ??= {} as Y\n additionalProps.children = nodeOrProps\n\n return <Component {...additionalProps} />\n } else {\n return <Component {...additionalProps} {...nodeOrProps} />\n }\n}\n"],"mappings":"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"}

package/dist/esm/components/accordion/accordion.js CHANGED Viewed

@@ -6,17 +6,17 @@ import { utils_exports } from "../../utils/index.js";
 import { styled } from "../../core/system/factory.js";
 import { createSlotComponent } from "../../core/components/create-component.js";
 import "../../core/index.js";
+import { ChevronDownIcon } from "../icon/icons/chevron-down-icon.js";
+import "../icon/index.js";
 import { accordionStyle } from "./accordion.style.js";
 import { Collapse } from "../collapse/collapse.js";
 import "../collapse/index.js";
-import { ChevronDownIcon } from "../icon/icons/chevron-down-icon.js";
-import "../icon/index.js";
 import { AccordionContext, AccordionDescendantsContext, AccordionItemContext, useAccordion, useAccordionItem, useAccordionItemContext } from "./use-accordion.js";
 import { Children, cloneElement, isValidElement, useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/accordion/accordion.tsx
-const [AccordionItemComponentContext, useAccordionItemComponentContext] = createContext$1({ name: "AccordionItemComponentContext" });
+const [ItemComponentContext, useItemComponentContext] = createContext$1({ name: "ItemComponentContext" });
 const { ComponentContext, PropsContext: AccordionPropsContext, useComponentContext, usePropsContext: useAccordionPropsContext, withContext, withProvider } = createSlotComponent("accordion", accordionStyle);
 /**
 * `Accordion` is a component for a list that displays information in an expandable or collapsible manner.
@@ -69,15 +69,14 @@ const AccordionRoot = withProvider(({ children, icon, iconHidden, items, ...prop
 }, "root")();
 const AccordionItem = withContext(({ button, children, icon, ...rest }) => {
 	const { disabled, open, getButtonProps, getIconProps, getItemProps, getPanelProps } = useAccordionItem(rest);
-	children = useMemo(() => (0, utils_exports.runIfFn)(children, {
+	const [omittedChildren, customAccordionButton, customAccordionPanel] = useSplitChildren(useMemo(() => (0, utils_exports.runIfFn)(children, {
 		disabled,
 		expanded: open
 	}), [
 		children,
 		disabled,
 		open
-	]);
-	const [omittedChildren, customAccordionButton, customAccordionPanel] = useSplitChildren(children, AccordionButton, AccordionPanel);
+	]), AccordionButton, AccordionPanel);
 	return /* @__PURE__ */ jsx(AccordionItemContext, {
 		value: useMemo(() => ({
 			disabled,
@@ -94,7 +93,7 @@ const AccordionItem = withContext(({ button, children, icon, ...rest }) => {
 			icon,
 			open
 		]),
-		children: /* @__PURE__ */ jsx(AccordionItemComponentContext, {
+		children: /* @__PURE__ */ jsx(ItemComponentContext, {
 			value: useMemo(() => ({ icon }), [icon]),
 			children: /* @__PURE__ */ jsxs(styled.div, {
 				...getItemProps(),
@@ -108,7 +107,7 @@ const AccordionItem = withContext(({ button, children, icon, ...rest }) => {
 }, "item")();
 const AccordionButton = withContext(({ children, icon: customIcon, containerProps, ...rest }) => {
 	const { icon: rootIcon } = useComponentContext();
-	const { icon: itemIcon } = useAccordionItemComponentContext();
+	const { icon: itemIcon } = useItemComponentContext();
 	const { disabled, open, getButtonProps } = useAccordionItemContext();
 	const props = {
 		disabled,
@@ -118,7 +117,7 @@ const AccordionButton = withContext(({ children, icon: customIcon, containerProp
 		...containerProps,
 		children: /* @__PURE__ */ jsxs(styled.button, {
 			...getButtonProps(rest),
-			children: [children, /* @__PURE__ */ jsx(AccordionIcon, { children: (0, utils_exports.runIfFn)(itemIcon, props) ?? (0, utils_exports.runIfFn)(rootIcon, props) ?? (0, utils_exports.runIfFn)(customIcon, props) })]
+			children: [children, /* @__PURE__ */ jsx(AccordionIcon, { children: (0, utils_exports.runIfFn)(customIcon, props) ?? (0, utils_exports.runIfFn)(itemIcon, props) ?? (0, utils_exports.runIfFn)(rootIcon, props) })]
 		})
 	});
 }, "button")();

package/dist/esm/components/accordion/accordion.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"accordion.js","names":["createContext","index","props"],"sources":["../../../../src/components/accordion/accordion.tsx"],"sourcesContent":["\"use client\"\n\nimport type { HTMLProps, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { ReactNodeOrFunction } from \"../../utils\"\nimport type { CollapseProps } from \"../collapse\"\nimport type { WithTransitionProps } from \"../motion\"\nimport type { AccordionStyle } from \"./accordion.style\"\nimport type { UseAccordionItemProps, UseAccordionProps } from \"./use-accordion\"\nimport { Children, cloneElement, isValidElement, useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { createContext, isString, runIfFn, useSplitChildren } from \"../../utils\"\nimport { Collapse } from \"../collapse\"\nimport { ChevronDownIcon } from \"../icon\"\nimport { accordionStyle } from \"./accordion.style\"\nimport {\n AccordionContext,\n AccordionDescendantsContext,\n AccordionItemContext,\n useAccordion,\n useAccordionItem,\n useAccordionItemContext,\n} from \"./use-accordion\"\n\ninterface AccordionCallBackProps {\n disabled?: boolean\n expanded?: boolean\n}\n\nexport interface AccordionItem extends Omit<AccordionItemProps, \"index\"> {}\n\ninterface AccordionComponentContext extends Pick<\n AccordionRootProps,\n \"icon\" \| \"iconHidden\"\n> {}\n\nexport interface AccordionRootProps\n extends\n Omit<HTMLStyledProps, \"onChange\">,\n ThemeProps<AccordionStyle>,\n UseAccordionProps {\n /*\n The accordion icon for all items to use.\n /\n icon?: ReactNodeOrFunction<AccordionCallBackProps>\n /\n If `true`, hide the accordion icon for all items.\n \n @default false\n /\n iconHidden?: boolean\n /\n If provided, generate elements based on items.\n /\n items?: AccordionItem[]\n}\n\ninterface AccordionItemComponentContext extends Pick<\n AccordionItemProps,\n \"icon\"\n> {}\n\nconst [AccordionItemComponentContext, useAccordionItemComponentContext] =\n createContext<AccordionItemComponentContext>({\n name: \"AccordionItemComponentContext\",\n })\n\nconst {\n ComponentContext,\n PropsContext: AccordionPropsContext,\n useComponentContext,\n usePropsContext: useAccordionPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<\n AccordionRootProps,\n AccordionStyle,\n AccordionComponentContext\n>(\"accordion\", accordionStyle)\n\nexport { AccordionPropsContext, useAccordionPropsContext }\n\n/\n `Accordion` is a component for a list that displays information in an expandable or collapsible manner.\n \n @see https://yamada-ui.com/docs/components/accordion\n /\nexport const AccordionRoot = withProvider<\"div\", AccordionRootProps>(\n ({ children, icon, iconHidden, items, ...props }) => {\n const {\n descendants,\n focusedIndex,\n index,\n multiple,\n setFocusedIndex,\n setIndex,\n toggle,\n getRootProps,\n } = useAccordion(props)\n const computedChildren = useMemo(() => {\n if (children) return children\n\n return items?.map((props, index) => (\n <AccordionItem key={index} index={index} {...props} />\n ))\n }, [children, items])\n const context = useMemo(\n () => ({\n focusedIndex,\n icon,\n iconHidden,\n index,\n multiple,\n setFocusedIndex,\n setIndex,\n toggle,\n }),\n [\n focusedIndex,\n icon,\n iconHidden,\n index,\n multiple,\n setFocusedIndex,\n setIndex,\n toggle,\n ],\n )\n const componentContext = useMemo(\n () => ({ icon, iconHidden }),\n [icon, iconHidden],\n )\n\n return (\n <AccordionDescendantsContext value={descendants}>\n <AccordionContext value={context}>\n <ComponentContext value={componentContext}>\n <styled.div {...getRootProps()}>{computedChildren}</styled.div>\n </ComponentContext>\n </AccordionContext>\n </AccordionDescendantsContext>\n )\n },\n \"root\",\n)()\n\nexport interface AccordionItemProps\n extends\n Omit<HTMLStyledProps, \"children\">,\n Omit<UseAccordionItemProps, \"children\"> {\n /\n The accordion button to use.\n /\n button?: ReactNodeOrFunction<AccordionCallBackProps>\n /\n The accordion children to use.\n /\n children?: ReactNodeOrFunction<AccordionCallBackProps>\n /\n The accordion icon to use.\n /\n icon?: ReactNodeOrFunction<AccordionCallBackProps>\n}\n\nexport const AccordionItem = withContext<\"div\", AccordionItemProps>(\n ({ button, children, icon, ...rest }) => {\n const {\n disabled,\n open,\n getButtonProps,\n getIconProps,\n getItemProps,\n getPanelProps,\n } = useAccordionItem(rest)\n\n children = useMemo(\n () => runIfFn(children, { disabled, expanded: open }),\n [children, disabled, open],\n )\n\n const [omittedChildren, customAccordionButton, customAccordionPanel] =\n useSplitChildren(children, AccordionButton, AccordionPanel)\n\n const context = useMemo(\n () => ({\n disabled,\n icon,\n open,\n getButtonProps,\n getIconProps,\n getPanelProps,\n }),\n [disabled, getButtonProps, getPanelProps, getIconProps, icon, open],\n )\n const componentContext = useMemo(() => ({ icon }), [icon])\n\n return (\n <AccordionItemContext value={context}>\n <AccordionItemComponentContext value={componentContext}>\n <styled.div {...getItemProps()}>\n {customAccordionButton ?? (\n <AccordionButton>\n {runIfFn(button, { disabled, expanded: open })}\n </AccordionButton>\n )}\n {customAccordionPanel ?? (\n <AccordionPanel>{omittedChildren}</AccordionPanel>\n )}\n </styled.div>\n </AccordionItemComponentContext>\n </AccordionItemContext>\n )\n },\n \"item\",\n)()\n\nexport interface AccordionButtonProps extends HTMLStyledProps<\"button\"> {\n /\n The accordion icon to use.\n /\n icon?: ReactNodeOrFunction<{ disabled?: boolean; expanded?: boolean }>\n /\n Props the container element.\n */\n containerProps?: HTMLStyledProps\n}\n\nexport const AccordionButton = withContext<\"button\", AccordionButtonProps>(\n ({ children, icon: customIcon, containerProps, ...rest }) => {\n const { icon: rootIcon } = useComponentContext()\n const { icon: itemIcon } = useAccordionItemComponentContext()\n const { disabled, open, getButtonProps } = useAccordionItemContext()\n const props = { disabled, expanded: open }\n\n return (\n <styled.h3 {...containerProps}>\n <styled.button {...getButtonProps(rest)}>\n {children}\n\n <AccordionIcon>\n {runIfFn(itemIcon, props) ??\n runIfFn(rootIcon, props) ??\n runIfFn(customIcon, props)}\n </AccordionIcon>\n </styled.button>\n </styled.h3>\n )\n },\n \"button\",\n)()\n\ninterface AccordionIconProps extends HTMLStyledProps<\"svg\"> {}\n\nexport const AccordionIcon = withContext<\"svg\", AccordionIconProps>(\n ({ children = <ChevronDownIcon />, ...rest }) => {\n const { iconHidden } = useComponentContext()\n const { getIconProps } = useAccordionItemContext()\n\n if (iconHidden) return null\n\n if (isValidElement<HTMLProps<\"svg\">>(children))\n return cloneElement(\n children,\n getIconProps({\n ...rest,\n ...children.props,\n }),\n )\n\n return Children.count(children) > 1 ? Children.only(null) : null\n },\n \"icon\",\n)()\n\nexport interface AccordionPanelProps\n extends\n Omit<HTMLStyledProps, \"transition\">,\n Pick<\n CollapseProps,\n \| \"animationOpacity\"\n \| \"endingHeight\"\n \| \"startingHeight\"\n \| keyof WithTransitionProps\n > {}\n\nexport const AccordionPanel = withContext<\"div\", AccordionPanelProps>(\n ({\n animationOpacity,\n children,\n delay,\n duration,\n endingHeight,\n startingHeight,\n transition,\n transitionEnd,\n unmountOnExit,\n ...rest\n }) => {\n const { open, getPanelProps } = useAccordionItemContext()\n\n return (\n <Collapse\n {...{\n animationOpacity,\n delay,\n duration,\n endingHeight,\n open,\n startingHeight,\n transition,\n transitionEnd,\n unmountOnExit,\n }}\n >\n <styled.div {...getPanelProps(rest)}>\n {isString(children) ? <styled.p>{children}</styled.p> : children}\n </styled.div>\n </Collapse>\n )\n },\n \"panel\",\n)()\n"],"mappings":"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"}
1	+ {"version":3,"file":"accordion.js","names":["createContext","index","props"],"sources":["../../../../src/components/accordion/accordion.tsx"],"sourcesContent":["\"use client\"\n\nimport type { HTMLProps, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { ReactNodeOrFunction } from \"../../utils\"\nimport type { CollapseProps } from \"../collapse\"\nimport type { WithTransitionProps } from \"../motion\"\nimport type { AccordionStyle } from \"./accordion.style\"\nimport type { UseAccordionItemProps, UseAccordionProps } from \"./use-accordion\"\nimport { Children, cloneElement, isValidElement, useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { createContext, isString, runIfFn, useSplitChildren } from \"../../utils\"\nimport { Collapse } from \"../collapse\"\nimport { ChevronDownIcon } from \"../icon\"\nimport { accordionStyle } from \"./accordion.style\"\nimport {\n AccordionContext,\n AccordionDescendantsContext,\n AccordionItemContext,\n useAccordion,\n useAccordionItem,\n useAccordionItemContext,\n} from \"./use-accordion\"\n\ninterface AccordionCallBackProps {\n disabled?: boolean\n expanded?: boolean\n}\n\nexport interface AccordionItem extends Omit<AccordionItemProps, \"index\"> {}\n\ninterface ComponentContext extends Pick<\n AccordionRootProps,\n \"icon\" \| \"iconHidden\"\n> {}\n\nexport interface AccordionRootProps\n extends\n Omit<HTMLStyledProps, \"onChange\">,\n ThemeProps<AccordionStyle>,\n UseAccordionProps {\n /*\n The accordion icon for all items to use.\n /\n icon?: ReactNodeOrFunction<AccordionCallBackProps>\n /\n If `true`, hide the accordion icon for all items.\n \n @default false\n /\n iconHidden?: boolean\n /\n If provided, generate elements based on items.\n /\n items?: AccordionItem[]\n}\n\ninterface ItemComponentContext extends Pick<AccordionItemProps, \"icon\"> {}\n\nconst [ItemComponentContext, useItemComponentContext] =\n createContext<ItemComponentContext>({\n name: \"ItemComponentContext\",\n })\n\nconst {\n ComponentContext,\n PropsContext: AccordionPropsContext,\n useComponentContext,\n usePropsContext: useAccordionPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<AccordionRootProps, AccordionStyle, ComponentContext>(\n \"accordion\",\n accordionStyle,\n)\n\nexport { AccordionPropsContext, useAccordionPropsContext }\n\n/\n `Accordion` is a component for a list that displays information in an expandable or collapsible manner.\n \n @see https://yamada-ui.com/docs/components/accordion\n /\nexport const AccordionRoot = withProvider<\"div\", AccordionRootProps>(\n ({ children, icon, iconHidden, items, ...props }) => {\n const {\n descendants,\n focusedIndex,\n index,\n multiple,\n setFocusedIndex,\n setIndex,\n toggle,\n getRootProps,\n } = useAccordion(props)\n const computedChildren = useMemo(() => {\n if (children) return children\n\n return items?.map((props, index) => (\n <AccordionItem key={index} index={index} {...props} />\n ))\n }, [children, items])\n const context = useMemo(\n () => ({\n focusedIndex,\n icon,\n iconHidden,\n index,\n multiple,\n setFocusedIndex,\n setIndex,\n toggle,\n }),\n [\n focusedIndex,\n icon,\n iconHidden,\n index,\n multiple,\n setFocusedIndex,\n setIndex,\n toggle,\n ],\n )\n const componentContext = useMemo(\n () => ({ icon, iconHidden }),\n [icon, iconHidden],\n )\n\n return (\n <AccordionDescendantsContext value={descendants}>\n <AccordionContext value={context}>\n <ComponentContext value={componentContext}>\n <styled.div {...getRootProps()}>{computedChildren}</styled.div>\n </ComponentContext>\n </AccordionContext>\n </AccordionDescendantsContext>\n )\n },\n \"root\",\n)()\n\nexport interface AccordionItemProps\n extends\n Omit<HTMLStyledProps, \"children\">,\n Omit<UseAccordionItemProps, \"children\"> {\n /\n The accordion button to use.\n /\n button?: ReactNodeOrFunction<AccordionCallBackProps>\n /\n The accordion children to use.\n /\n children?: ReactNodeOrFunction<AccordionCallBackProps>\n /\n The accordion icon to use.\n /\n icon?: ReactNodeOrFunction<AccordionCallBackProps>\n}\n\nexport const AccordionItem = withContext<\"div\", AccordionItemProps>(\n ({ button, children, icon, ...rest }) => {\n const {\n disabled,\n open,\n getButtonProps,\n getIconProps,\n getItemProps,\n getPanelProps,\n } = useAccordionItem(rest)\n const computedChildren = useMemo(\n () => runIfFn(children, { disabled, expanded: open }),\n [children, disabled, open],\n )\n const [omittedChildren, customAccordionButton, customAccordionPanel] =\n useSplitChildren(computedChildren, AccordionButton, AccordionPanel)\n const context = useMemo(\n () => ({\n disabled,\n icon,\n open,\n getButtonProps,\n getIconProps,\n getPanelProps,\n }),\n [disabled, getButtonProps, getPanelProps, getIconProps, icon, open],\n )\n const componentContext = useMemo(() => ({ icon }), [icon])\n\n return (\n <AccordionItemContext value={context}>\n <ItemComponentContext value={componentContext}>\n <styled.div {...getItemProps()}>\n {customAccordionButton ?? (\n <AccordionButton>\n {runIfFn(button, { disabled, expanded: open })}\n </AccordionButton>\n )}\n {customAccordionPanel ?? (\n <AccordionPanel>{omittedChildren}</AccordionPanel>\n )}\n </styled.div>\n </ItemComponentContext>\n </AccordionItemContext>\n )\n },\n \"item\",\n)()\n\nexport interface AccordionButtonProps extends HTMLStyledProps<\"button\"> {\n /\n The accordion icon to use.\n /\n icon?: ReactNodeOrFunction<AccordionCallBackProps>\n /\n Props the container element.\n */\n containerProps?: HTMLStyledProps\n}\n\nexport const AccordionButton = withContext<\"button\", AccordionButtonProps>(\n ({ children, icon: customIcon, containerProps, ...rest }) => {\n const { icon: rootIcon } = useComponentContext()\n const { icon: itemIcon } = useItemComponentContext()\n const { disabled, open, getButtonProps } = useAccordionItemContext()\n const props = { disabled, expanded: open }\n\n return (\n <styled.h3 {...containerProps}>\n <styled.button {...getButtonProps(rest)}>\n {children}\n\n <AccordionIcon>\n {runIfFn(customIcon, props) ??\n runIfFn(itemIcon, props) ??\n runIfFn(rootIcon, props)}\n </AccordionIcon>\n </styled.button>\n </styled.h3>\n )\n },\n \"button\",\n)()\n\ninterface AccordionIconProps extends HTMLStyledProps<\"svg\"> {}\n\nexport const AccordionIcon = withContext<\"svg\", AccordionIconProps>(\n ({ children = <ChevronDownIcon />, ...rest }) => {\n const { iconHidden } = useComponentContext()\n const { getIconProps } = useAccordionItemContext()\n\n if (iconHidden) return null\n\n if (isValidElement<HTMLProps<\"svg\">>(children))\n return cloneElement(\n children,\n getIconProps({\n ...rest,\n ...children.props,\n }),\n )\n\n return Children.count(children) > 1 ? Children.only(null) : null\n },\n \"icon\",\n)()\n\nexport interface AccordionPanelProps\n extends\n Omit<HTMLStyledProps, \"transition\">,\n Pick<\n CollapseProps,\n \| \"animationOpacity\"\n \| \"endingHeight\"\n \| \"startingHeight\"\n \| keyof WithTransitionProps\n > {}\n\nexport const AccordionPanel = withContext<\"div\", AccordionPanelProps>(\n ({\n animationOpacity,\n children,\n delay,\n duration,\n endingHeight,\n startingHeight,\n transition,\n transitionEnd,\n unmountOnExit,\n ...rest\n }) => {\n const { open, getPanelProps } = useAccordionItemContext()\n\n return (\n <Collapse\n {...{\n animationOpacity,\n delay,\n duration,\n endingHeight,\n open,\n startingHeight,\n transition,\n transitionEnd,\n unmountOnExit,\n }}\n >\n <styled.div {...getPanelProps(rest)}>\n {isString(children) ? <styled.p>{children}</styled.p> : children}\n </styled.div>\n </Collapse>\n )\n },\n \"panel\",\n)()\n"],"mappings":"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"}

package/dist/esm/components/accordion/accordion.style.js CHANGED Viewed

@@ -1,52 +1,26 @@
 import { defineComponentSlotStyle } from "../../core/system/config.js";
 import "../../core/index.js";
+import { nativeAccordionStyle } from "../native-accordion/native-accordion.style.js";
+import "../native-accordion/index.js";
 //#region src/components/accordion/accordion.style.ts
 const accordionStyle = defineComponentSlotStyle({
 	base: {
+		...nativeAccordionStyle.base,
 		button: {
-			"&[aria-disabled=true]": { cursor: "default" },
-			alignItems: "center",
-			display: "inline-flex",
-			focusVisibleRing: "inside",
-			px: "4",
-			py: "3",
-			transitionDuration: "moderate",
-			transitionProperty: "common",
-			w: "100%",
-			_nativeDisabled: { layerStyle: "disabled" }
+			...nativeAccordionStyle.base?.button,
+			"&[aria-disabled=true]": { cursor: "default" }
 		},
 		icon: {
-			color: "fg.subtle",
-			fontSize: "xl",
-			ml: "auto",
-			transformOrigin: "center",
-			transitionDuration: "moderate",
-			transitionProperty: "transform",
-			_expanded: { transform: "rotate(180deg)" },
-			_disabled: { layerStyle: "disabled" }
+			...nativeAccordionStyle.base?.icon,
+			_expanded: { transform: "rotate(180deg)" }
 		},
-		item: { overflowAnchor: "none" },
 		panel: {
-			pb: "3",
-			px: "4"
-		},
-		root: { w: "full" }
-	},
-	variants: {
-		panel: {
-			button: { rounded: "l2" },
-			item: {
-				layerStyle: "panel",
-				rounded: "l2",
-				_notFirst: { mt: "md" }
-			}
-		},
-		plain: { item: {
-			borderTopWidth: "1px",
-			_last: { borderBottomWidth: "1px" }
-		} }
+			...nativeAccordionStyle.base?.panel,
+			pb: "3"
+		}
 	},
+	variants: nativeAccordionStyle.variants,
 	defaultProps: { variant: "plain" }
 });

package/dist/esm/components/accordion/accordion.style.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"accordion.style.js","names":[],"sources":["../../../../src/components/accordion/accordion.style.ts"],"sourcesContent":["import { defineComponentSlotStyle } from \"../../core\"\n\nexport const accordionStyle = defineComponentSlotStyle({\n base: {\n button: {\n \"&[aria-disabled=true]\": {\n cursor: \"default\"~~,\n },\n alignItems:~~ \"center\",\n display: \"inline-flex\",\n focusVisibleRing: \"inside\",\n px: \"4\",\n py: \"3\",\n transitionDuration: \"moderate\",\n transitionProperty: \"common\",\n w: \"100%\",\n _nativeDisabled: {\n layerStyle: \"disabled\",\n },\n },\n icon: {\n ~~color: \"fg~~.~~subtle\"~~,\n ~~fontSize: \"xl\",\n ml: \"auto\",\n transformOrigin: \"center\",\n transitionDuration: \"moderate\",\n transitionProperty: \"transform\",\n~~ _expanded: {\n transform: \"rotate(180deg)\"~~,\n },\n _disabled:~~ ~~{\n layerStyle: \"disabled\",\n~~ },\n },\n ~~item~~: {~~\n overflowAnchor:~~ ~~\"none\",\n },\n~~ panel: ~~{\n~~ pb: \"3\"~~,\n px:~~ ~~\"4\",\n~~ },\n ~~root: {\n w: \"full\",\n },\n~~ },\n\n variants: ~~{\n panel: {\n button: {\n rounded: \"l2\"~~,\n ~~},\n item: {~~\n layerStyle: \"panel\",\n rounded: \"l2\",\n _notFirst: {\n mt: \"md\",\n },\n },\n },\n plain: {\n item: {\n borderTopWidth: \"1px\",\n _last: {\n borderBottomWidth: \"1px\",\n },\n },\n },\n ~~},\n\n~~ defaultProps: {\n variant: \"plain\",\n },\n})\n\nexport type AccordionStyle = typeof accordionStyle\n"],"mappings":"~~;;;;AAEA~~,MAAa,iBAAiB,yBAAyB;CACrD,MAAM;EACJ,~~QAAQ~~;~~GACN~~,~~yBAAyB,EACvB,~~QAAQ~~,WACT~~;~~GACD~~,~~YAAY;GACZ~~,~~SAAS;GACT~~,~~kBAAkB~~;~~GAClB~~,~~IAAI;GACJ~~,~~IAAI;GACJ~~,~~oBAAoB;GACpB~~,~~oBAAoB~~;~~GACpB,GAAG~~;~~GACH,iBAAiB,EACf,YAAY,YACb;GACF;~~EACD,MAAM;GACJ,~~OAAO;GACP~~,~~UAAU;GACV~~,~~IAAI~~;~~GACJ~~,~~iBAAiB;GACjB,oBAAoB;GACpB,oBAAoB;GACpB,~~WAAW,~~EACT~~,WAAW,~~kBACZ~~;~~GACD,WAAW,EACT,YAAY,YACb~~;~~GACF;~~EACD,~~MAAM,EACJ,gBAAgB,QACjB;EACD,~~OAAO;~~GACL~~,~~IAAI;GACJ,IAAI;GACL;EACD,MAAM,EACJ,~~GAAG,~~QACJ;EACF;CAED~~,~~UAAU;EACR,OAAO;GACL,QAAQ,EACN,SAAS,MACV;GACD,~~MAAM;~~IACJ~~,~~YAAY;IACZ,SAAS;IACT,WAAW,EACT,~~IAAI~~,MACL~~;~~IACF~~;~~GACF~~;~~EACD~~,~~OAAO~~,~~EACL,MAAM~~;~~GACJ~~,~~gBAAgB;GAChB,OAAO,EACL,mBAAmB,OACpB;GACF,EACF;EACF;CAED,~~cAAc,EACZ,SAAS,SACV;CACF,CAAC"}
1	+ {"version":3,"file":"accordion.style.js","names":[],"sources":["../../../../src/components/accordion/accordion.style.ts"],"sourcesContent":["import { defineComponentSlotStyle } from \"../../core\"\nimport { nativeAccordionStyle } from \"../native-accordion\"\n\nexport const accordionStyle = defineComponentSlotStyle({\n base: {\n ...nativeAccordionStyle.base,\n button: {\n ...nativeAccordionStyle.base?.button,\n \"&[aria-disabled=true]\": { cursor: \"default\" },\n },\n icon: {\n ...nativeAccordionStyle.base?.icon,\n _expanded: { transform: \"rotate(180deg)\" },\n },\n panel: { ...nativeAccordionStyle.base?.panel, pb: \"3\" },\n },\n\n variants: nativeAccordionStyle.variants,\n\n defaultProps: {\n variant: \"plain\",\n },\n})\n\nexport type AccordionStyle = typeof accordionStyle\n"],"mappings":";;;;;;AAGA,MAAa,iBAAiB,yBAAyB;CACrD,MAAM;EACJ,GAAG,qBAAqB;EACxB,QAAQ;GACN,GAAG,qBAAqB,MAAM;GAC9B,yBAAyB,EAAE,QAAQ,WAAW;GAC/C;EACD,MAAM;GACJ,GAAG,qBAAqB,MAAM;GAC9B,WAAW,EAAE,WAAW,kBAAkB;GAC3C;EACD,OAAO;GAAE,GAAG,qBAAqB,MAAM;GAAO,IAAI;GAAK;EACxD;CAED,UAAU,qBAAqB;CAE/B,cAAc,EACZ,SAAS,SACV;CACF,CAAC"}

package/dist/esm/components/accordion/use-accordion.js CHANGED Viewed

@@ -129,12 +129,17 @@ const useAccordionItem = ({ disabled, index, ...rest }) => {
 		open,
 		getButtonProps,
 		getIconProps: useCallback((props) => ({
-			"aria-disabled": (0, utils_exports.ariaAttr)(disabled),
+			"aria-disabled": (0, utils_exports.ariaAttr)(!multiple && !toggle && open || disabled),
 			"aria-expanded": open,
 			"aria-hidden": true,
 			role: "presentation",
 			...props
-		}), [open, disabled]),
+		}), [
+			multiple,
+			toggle,
+			open,
+			disabled
+		]),
 		getItemProps,
 		getPanelProps
 	};

package/dist/esm/components/accordion/use-accordion.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"use-accordion.js","names":["createContext","getRootProps: PropGetter","open","getItemProps: PropGetter","getButtonProps: PropGetter<\"button\">","getPanelProps: PropGetter"],"sources":["../../../../src/components/accordion/use-accordion.ts"],"sourcesContent":["\"use client\"\n\nimport type { KeyboardEvent } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport { useCallback, useEffect, useId, useState } from \"react\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { createDescendants } from \"../../hooks/use-descendants\"\nimport {\n ariaAttr,\n createContext,\n cx,\n dataAttr,\n handlerAll,\n isArray,\n mergeRefs,\n runKeyAction,\n} from \"../../utils\"\n\nconst {\n DescendantsContext: AccordionDescendantsContext,\n useDescendant: useAccordionDescendant,\n useDescendants: useAccordionDescendants,\n} = createDescendants<HTMLButtonElement>()\n\nexport {\n AccordionDescendantsContext,\n useAccordionDescendant,\n useAccordionDescendants,\n}\n\ninterface AccordionContext extends Omit<\n UseAccordionReturn,\n \"descendants\" \| \"getRootProps\"\n> {}\n\nconst [AccordionContext, useAccordionContext] = createContext<AccordionContext>(\n {\n name: \"AccordionContext\",\n },\n)\n\nexport { AccordionContext, useAccordionContext }\n\ninterface AccordionItemContext extends Omit<\n UseAccordionItemReturn,\n \"getItemProps\"\n> {}\n\nconst [AccordionItemContext, useAccordionItemContext] =\n createContext<AccordionItemContext>({\n name: \"AccordionItemContext\",\n })\n\nexport { AccordionItemContext, useAccordionItemContext }\n\nexport interface UseAccordionProps extends Omit<HTMLProps, \"onChange\"> {\n /*\n The initial index(es) of the accordion item to expand.\n /\n defaultIndex?: number \| number[]\n /\n The index(es) of the accordion item to expand.\n /\n index?: number \| number[]\n /\n If `true`, multiple accordion items can be expanded at once.\n \n @default false\n /\n multiple?: boolean\n /\n If `true`, any expanded accordion item can be collapsed again.\n \n @default false\n /\n toggle?: boolean\n /\n The callback invoked when accordion items are expanded or collapsed.\n /\n onChange?: (index: number \| number[]) => void\n}\n\nexport const useAccordion = ({\n defaultIndex: defaultIndexProp,\n index: indexProp,\n multiple,\n toggle,\n onChange,\n ...rest\n}: UseAccordionProps = {}) => {\n if (\n (indexProp \|\| defaultIndexProp) != null &&\n !isArray(indexProp \|\| defaultIndexProp) &&\n multiple\n ) {\n console.warn(\n `Accordion: If 'multiple' is passed, then 'index' or 'defaultIndex' must be an array.`,\n )\n }\n\n if (multiple && toggle) {\n console.warn(\n `Accordion: If 'multiple' is passed, 'toggle' will be ignored. Either remove 'toggle' or 'multiple' depending on whether you want multiple accordions visible or not`,\n )\n }\n\n const descendants = useAccordionDescendants()\n\n const [focusedIndex, setFocusedIndex] = useState<number>(-1)\n\n const [index, setIndex] = useControllableState({\n defaultValue: () =>\n multiple ? (defaultIndexProp ?? []) : (defaultIndexProp ?? -1),\n value: indexProp,\n onChange,\n })\n\n const getRootProps: PropGetter = useCallback(\n ({ ref, ...props } = {}) => ({\n ...props,\n ...rest,\n ref: mergeRefs(ref, rest.ref),\n }),\n [rest],\n )\n\n useEffect(() => {\n return () => setFocusedIndex(-1)\n }, [])\n\n return {\n descendants,\n focusedIndex,\n index,\n multiple,\n setFocusedIndex,\n setIndex,\n toggle,\n getRootProps,\n }\n}\n\nexport type UseAccordionReturn = ReturnType<typeof useAccordion>\n\nexport interface UseAccordionItemProps extends HTMLProps {\n /\n The index of the accordion item.\n /\n index: number\n /\n If `true`, the accordion item will be disabled.\n \n @default false\n */\n disabled?: boolean\n}\n\nexport const useAccordionItem = ({\n disabled,\n index,\n ...rest\n}: UseAccordionItemProps) => {\n const itemId = useId()\n const panelId = useId()\n const {\n index: selectedIndex,\n multiple,\n setFocusedIndex,\n setIndex,\n toggle,\n } = useAccordionContext()\n const { descendants, register } = useAccordionDescendant({ disabled })\n const open =\n index !== -1\n ? isArray(selectedIndex)\n ? selectedIndex.includes(index)\n : selectedIndex === index\n : false\n\n if (open && disabled)\n console.warn(`Accordion: Cannot open a disabled accordion item`)\n\n const onChange = useCallback(\n (open: boolean) => {\n if (index === -1) return\n\n if (multiple && isArray(selectedIndex)) {\n setIndex(\n open\n ? selectedIndex.concat(index)\n : selectedIndex.filter((i) => i !== index),\n )\n } else if (open) {\n setIndex(index)\n } else if (toggle) {\n setIndex(-1)\n }\n },\n [multiple, toggle, index, selectedIndex, setIndex],\n )\n\n const onFocus = useCallback(() => {\n setFocusedIndex(index)\n }, [setFocusedIndex, index])\n\n const onClick = useCallback(() => {\n onChange(!open)\n setFocusedIndex(index)\n }, [index, setFocusedIndex, open, onChange])\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent<HTMLButtonElement>) => {\n runKeyAction(ev, {\n ArrowDown: () => {\n const next = descendants.enabledNextValue(index)\n\n next?.node.focus()\n },\n ArrowUp: () => {\n const prev = descendants.enabledPrevValue(index)\n\n prev?.node.focus()\n },\n End: () => {\n const last = descendants.enabledLastValue()\n\n last?.node.focus()\n },\n Home: () => {\n const first = descendants.enabledFirstValue()\n\n first?.node.focus()\n },\n })\n },\n [descendants, index],\n )\n\n const getItemProps: PropGetter = useCallback(\n ({ ref, ...props } = {}) => ({\n \"data-expanded\": dataAttr(open),\n ...props,\n ...rest,\n ref: mergeRefs(ref, rest.ref),\n }),\n [open, rest],\n )\n\n const getButtonProps: PropGetter<\"button\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n id: itemId,\n type: \"button\",\n \"aria-controls\": panelId,\n \"aria-disabled\": ariaAttr((!multiple && !toggle && open) \|\| disabled),\n \"aria-expanded\": open,\n ...props,\n ref: mergeRefs(register, ref),\n disabled,\n onClick: handlerAll(props.onClick, onClick),\n onFocus: handlerAll(props.onFocus, onFocus),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n }),\n [\n itemId,\n open,\n panelId,\n multiple,\n toggle,\n disabled,\n register,\n onClick,\n onFocus,\n onKeyDown,\n ],\n )\n\n const getPanelProps: PropGetter = useCallback(\n ({ \"aria-labelledby\": ariaLabelledby, ...props } = {}) => ({\n id: panelId,\n \"aria-labelledby\": cx(ariaLabelledby, itemId),\n role: \"region\",\n ...props,\n }),\n [itemId, panelId],\n )\n\n const getIconProps: PropGetter<\"svg\"> = useCallback(\n (props) => ({\n \"aria-disabled\": ariaAttr(disabled),\n \"aria-expanded\": open,\n \"aria-hidden\": true,\n role: \"presentation\",\n ...props,\n }),\n [open, disabled],\n )\n\n return {\n disabled,\n open,\n getButtonProps,\n getIconProps,\n getItemProps,\n getPanelProps,\n }\n}\n\nexport type UseAccordionItemReturn = ReturnType<typeof useAccordionItem>\n"],"mappings":"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"}
1	+ {"version":3,"file":"use-accordion.js","names":["createContext","getRootProps: PropGetter","open","getItemProps: PropGetter","getButtonProps: PropGetter<\"button\">","getPanelProps: PropGetter"],"sources":["../../../../src/components/accordion/use-accordion.ts"],"sourcesContent":["\"use client\"\n\nimport type { KeyboardEvent } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport { useCallback, useEffect, useId, useState } from \"react\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { createDescendants } from \"../../hooks/use-descendants\"\nimport {\n ariaAttr,\n createContext,\n cx,\n dataAttr,\n handlerAll,\n isArray,\n mergeRefs,\n runKeyAction,\n} from \"../../utils\"\n\nconst {\n DescendantsContext: AccordionDescendantsContext,\n useDescendant: useAccordionDescendant,\n useDescendants: useAccordionDescendants,\n} = createDescendants<HTMLButtonElement>()\n\nexport {\n AccordionDescendantsContext,\n useAccordionDescendant,\n useAccordionDescendants,\n}\n\ninterface AccordionContext extends Omit<\n UseAccordionReturn,\n \"descendants\" \| \"getRootProps\"\n> {}\n\nconst [AccordionContext, useAccordionContext] = createContext<AccordionContext>(\n {\n name: \"AccordionContext\",\n },\n)\n\nexport { AccordionContext, useAccordionContext }\n\ninterface AccordionItemContext extends Omit<\n UseAccordionItemReturn,\n \"getItemProps\"\n> {}\n\nconst [AccordionItemContext, useAccordionItemContext] =\n createContext<AccordionItemContext>({\n name: \"AccordionItemContext\",\n })\n\nexport { AccordionItemContext, useAccordionItemContext }\n\nexport interface UseAccordionProps extends Omit<HTMLProps, \"onChange\"> {\n /*\n The initial index(es) of the accordion item to expand.\n /\n defaultIndex?: number \| number[]\n /\n The index(es) of the accordion item to expand.\n /\n index?: number \| number[]\n /\n If `true`, multiple accordion items can be expanded at once.\n \n @default false\n /\n multiple?: boolean\n /\n If `true`, any expanded accordion item can be collapsed again.\n \n @default false\n /\n toggle?: boolean\n /\n The callback invoked when accordion items are expanded or collapsed.\n /\n onChange?: (index: number \| number[]) => void\n}\n\nexport const useAccordion = ({\n defaultIndex: defaultIndexProp,\n index: indexProp,\n multiple,\n toggle,\n onChange,\n ...rest\n}: UseAccordionProps = {}) => {\n if (\n (indexProp \|\| defaultIndexProp) != null &&\n !isArray(indexProp \|\| defaultIndexProp) &&\n multiple\n ) {\n console.warn(\n `Accordion: If 'multiple' is passed, then 'index' or 'defaultIndex' must be an array.`,\n )\n }\n\n if (multiple && toggle) {\n console.warn(\n `Accordion: If 'multiple' is passed, 'toggle' will be ignored. Either remove 'toggle' or 'multiple' depending on whether you want multiple accordions visible or not`,\n )\n }\n\n const descendants = useAccordionDescendants()\n\n const [focusedIndex, setFocusedIndex] = useState<number>(-1)\n\n const [index, setIndex] = useControllableState({\n defaultValue: () =>\n multiple ? (defaultIndexProp ?? []) : (defaultIndexProp ?? -1),\n value: indexProp,\n onChange,\n })\n\n const getRootProps: PropGetter = useCallback(\n ({ ref, ...props } = {}) => ({\n ...props,\n ...rest,\n ref: mergeRefs(ref, rest.ref),\n }),\n [rest],\n )\n\n useEffect(() => {\n return () => setFocusedIndex(-1)\n }, [])\n\n return {\n descendants,\n focusedIndex,\n index,\n multiple,\n setFocusedIndex,\n setIndex,\n toggle,\n getRootProps,\n }\n}\n\nexport type UseAccordionReturn = ReturnType<typeof useAccordion>\n\nexport interface UseAccordionItemProps extends HTMLProps {\n /\n The index of the accordion item.\n /\n index: number\n /\n If `true`, the accordion item will be disabled.\n \n @default false\n */\n disabled?: boolean\n}\n\nexport const useAccordionItem = ({\n disabled,\n index,\n ...rest\n}: UseAccordionItemProps) => {\n const itemId = useId()\n const panelId = useId()\n const {\n index: selectedIndex,\n multiple,\n setFocusedIndex,\n setIndex,\n toggle,\n } = useAccordionContext()\n const { descendants, register } = useAccordionDescendant({ disabled })\n const open =\n index !== -1\n ? isArray(selectedIndex)\n ? selectedIndex.includes(index)\n : selectedIndex === index\n : false\n\n if (open && disabled)\n console.warn(`Accordion: Cannot open a disabled accordion item`)\n\n const onChange = useCallback(\n (open: boolean) => {\n if (index === -1) return\n\n if (multiple && isArray(selectedIndex)) {\n setIndex(\n open\n ? selectedIndex.concat(index)\n : selectedIndex.filter((i) => i !== index),\n )\n } else if (open) {\n setIndex(index)\n } else if (toggle) {\n setIndex(-1)\n }\n },\n [multiple, toggle, index, selectedIndex, setIndex],\n )\n\n const onFocus = useCallback(() => {\n setFocusedIndex(index)\n }, [setFocusedIndex, index])\n\n const onClick = useCallback(() => {\n onChange(!open)\n setFocusedIndex(index)\n }, [index, setFocusedIndex, open, onChange])\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent<HTMLButtonElement>) => {\n runKeyAction(ev, {\n ArrowDown: () => {\n const next = descendants.enabledNextValue(index)\n\n next?.node.focus()\n },\n ArrowUp: () => {\n const prev = descendants.enabledPrevValue(index)\n\n prev?.node.focus()\n },\n End: () => {\n const last = descendants.enabledLastValue()\n\n last?.node.focus()\n },\n Home: () => {\n const first = descendants.enabledFirstValue()\n\n first?.node.focus()\n },\n })\n },\n [descendants, index],\n )\n\n const getItemProps: PropGetter = useCallback(\n ({ ref, ...props } = {}) => ({\n \"data-expanded\": dataAttr(open),\n ...props,\n ...rest,\n ref: mergeRefs(ref, rest.ref),\n }),\n [open, rest],\n )\n\n const getButtonProps: PropGetter<\"button\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n id: itemId,\n type: \"button\",\n \"aria-controls\": panelId,\n \"aria-disabled\": ariaAttr((!multiple && !toggle && open) \|\| disabled),\n \"aria-expanded\": open,\n ...props,\n ref: mergeRefs(register, ref),\n disabled,\n onClick: handlerAll(props.onClick, onClick),\n onFocus: handlerAll(props.onFocus, onFocus),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n }),\n [\n itemId,\n open,\n panelId,\n multiple,\n toggle,\n disabled,\n register,\n onClick,\n onFocus,\n onKeyDown,\n ],\n )\n\n const getPanelProps: PropGetter = useCallback(\n ({ \"aria-labelledby\": ariaLabelledby, ...props } = {}) => ({\n id: panelId,\n \"aria-labelledby\": cx(ariaLabelledby, itemId),\n role: \"region\",\n ...props,\n }),\n [itemId, panelId],\n )\n\n const getIconProps: PropGetter<\"svg\"> = useCallback(\n (props) => ({\n \"aria-disabled\": ariaAttr((!multiple && !toggle && open) \|\| disabled),\n \"aria-expanded\": open,\n \"aria-hidden\": true,\n role: \"presentation\",\n ...props,\n }),\n [multiple, toggle, open, disabled],\n )\n\n return {\n disabled,\n open,\n getButtonProps,\n getIconProps,\n getItemProps,\n getPanelProps,\n }\n}\n\nexport type UseAccordionItemReturn = ReturnType<typeof useAccordionItem>\n"],"mappings":"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"}

package/dist/esm/components/autocomplete/autocomplete.js CHANGED Viewed

@@ -9,13 +9,13 @@ import { ChevronDownIcon } from "../icon/icons/chevron-down-icon.js";
 import { MinusIcon } from "../icon/icons/minus-icon.js";
 import { XIcon } from "../icon/icons/x-icon.js";
 import "../icon/index.js";
+import { useGroupItemProps } from "../group/use-group.js";
+import "../group/index.js";
 import { PopoverContent, PopoverRoot, PopoverTrigger } from "../popover/popover.js";
 import "../popover/index.js";
 import { useInputBorder } from "../input/use-input-border.js";
 import { useInputPropsContext } from "../input/input.js";
 import { InputElement } from "../input/input-element.js";
-import { useGroupItemProps } from "../group/use-group.js";
-import "../group/index.js";
 import { InputGroupRoot } from "../input/input-group.js";
 import "../input/index.js";
 import { ComboboxContext, ComboboxDescendantsContext, ComboboxGroupContext, createComboboxChildren, createComboboxItem, useComboboxGroup, useComboboxGroupContext } from "../../hooks/use-combobox/index.js";

package/dist/esm/components/button/button-group.js CHANGED Viewed

@@ -1,8 +1,8 @@
 "use client";
+import { ButtonPropsContext } from "./button.js";
 import { Group } from "../group/group.js";
 import "../group/index.js";
-import { ButtonPropsContext } from "./button.js";
 import { IconButtonPropsContext } from "./icon-button.js";
 import { useMemo } from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/esm/components/chart/area-chart.js ADDED Viewed

@@ -0,0 +1,38 @@
+"use client";
+import { createComponent } from "../../core/components/create-component.js";
+import "../../core/index.js";
+import { areaChartStyle } from "./area-chart.style.js";
+import { CartesianChart, ChartArea } from "./cartesian-chart.js";
+import { useAreaChart } from "./use-area-chart.js";
+import { useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+import { AreaChart } from "recharts";
+//#region src/components/chart/area-chart.tsx
+const { PropsContext: AreaChartPropsContext, usePropsContext: useAreaChartPropsContext, withContext } = createComponent("area-chart", areaChartStyle);
+/**
+* `AreaChart` is a component for drawing area charts to compare multiple sets of data.
+*
+* @see https://yamada-ui.com/docs/components/area-chart
+*/
+const AreaChart$1 = withContext(({ children, series = [], chartProps, ...rest }) => {
+	const { getChartProps, getRootProps } = useAreaChart(rest);
+	return /* @__PURE__ */ jsx(CartesianChart, {
+		components: useMemo(() => [{
+			component: ChartArea,
+			fallback: series.map((props, index) => /* @__PURE__ */ jsx(ChartArea, { ...props }, index))
+		}], [series]),
+		render: (props) => /* @__PURE__ */ jsx(AreaChart, { ...getChartProps({
+			...props,
+			...chartProps
+		}) }),
+		series,
+		...getRootProps(),
+		children
+	});
+})();
+//#endregion
+export { AreaChart$1 as AreaChart, AreaChartPropsContext, useAreaChartPropsContext };
+//# sourceMappingURL=area-chart.js.map

package/dist/esm/components/chart/area-chart.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"area-chart.js","names":["AreaChart","OriginalAreaChart"],"sources":["../../../../src/components/chart/area-chart.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactElement } from \"react\"\nimport type { CartesianChartProps as OriginalCartesianChartProps } from \"recharts/types/util/types\"\nimport type { GenericsComponent, ThemeProps } from \"../../core\"\nimport type { Dict } from \"../../utils\"\nimport type { AreaChartStyle } from \"./area-chart.style\"\nimport type { CartesianChartProps, ChartAreaProps } from \"./cartesian-chart\"\nimport type { UseAreaChartProps } from \"./use-area-chart\"\nimport { useMemo } from \"react\"\nimport { AreaChart as OriginalAreaChart } from \"recharts\"\nimport { createComponent } from \"../../core\"\nimport { areaChartStyle } from \"./area-chart.style\"\nimport { CartesianChart, ChartArea } from \"./cartesian-chart\"\nimport { useAreaChart } from \"./use-area-chart\"\n\nexport interface AreaChartProps<Y extends Dict = Dict>\n extends\n Omit<\n CartesianChartProps<Y>,\n \"barProps\" | \"components\" | \"lineProps\" | \"render\" | \"series\"\n >,\n UseAreaChartProps<Y>,\n ThemeProps<AreaChartStyle> {\n /***\n * If provided, generate areas based on series.\n */\n series?: ChartAreaProps<Y>[]\n /**\n * Props for the area chart component.\n */\n chartProps?: Omit<OriginalCartesianChartProps, \"data\">\n}\n\nconst {\n PropsContext: AreaChartPropsContext,\n usePropsContext: useAreaChartPropsContext,\n withContext,\n} = createComponent<AreaChartProps, AreaChartStyle>(\n \"area-chart\",\n areaChartStyle,\n)\n\nexport { AreaChartPropsContext, useAreaChartPropsContext }\n\n/**\n * `AreaChart` is a component for drawing area charts to compare multiple sets of data.\n *\n * @see https://yamada-ui.com/docs/components/area-chart\n */\nexport const AreaChart = withContext<\"div\", AreaChartProps>(\n <Y extends Dict>({\n children,\n series = [],\n chartProps,\n ...rest\n }: AreaChartProps<Y>) => {\n const { getChartProps, getRootProps } = useAreaChart(rest)\n const components = useMemo(\n () => [\n {\n component: ChartArea,\n fallback: series.map((props, index) => (\n <ChartArea key={index} {...props} />\n )),\n },\n ],\n [series],\n )\n\n return (\n <CartesianChart\n components={components}\n render={(props) => (\n <OriginalAreaChart {...getChartProps({ ...props, ...chartProps })} />\n )}\n series={series}\n {...getRootProps()}\n >\n {children}\n </CartesianChart>\n )\n },\n)() as GenericsComponent<{\n <Y extends Dict>(props: AreaChartProps<Y>): ReactElement\n}>\n"],"mappings":";;;;;;;;;;;;AAkCA,MAAM,EACJ,cAAc,uBACd,iBAAiB,0BACjB,gBACE,gBACF,cACA,eACD;;;;;;AASD,MAAaA,cAAY,aACN,EACf,UACA,SAAS,EAAE,EACX,YACA,GAAG,WACoB;CACvB,MAAM,EAAE,eAAe,iBAAiB,aAAa,KAAK;AAa1D,QACE,oBAAC;EACC,YAde,cACX,CACJ;GACE,WAAW;GACX,UAAU,OAAO,KAAK,OAAO,UAC3B,oBAAC,aAAsB,GAAI,SAAX,MAAoB,CACpC;GACH,CACF,EACD,CAAC,OAAO,CACT;EAKG,SAAS,UACP,oBAACC,aAAkB,GAAI,cAAc;GAAE,GAAG;GAAO,GAAG;GAAY,CAAC,GAAI;EAE/D;EACR,GAAI,cAAc;EAEjB;GACc;EAGtB,EAAE"}

package/dist/esm/components/chart/area-chart.namespace.js ADDED Viewed

@@ -0,0 +1,26 @@
+import { __exportAll } from "../../_virtual/rolldown_runtime.js";
+import { ChartLabel, ChartLabelList, ChartLegend, ChartTooltip, gradients, mergeSeries } from "./chart.js";
+import { ChartArea, ChartGrid, ChartReferenceLine, ChartXAxis, ChartYAxis } from "./cartesian-chart.js";
+import { AreaChart, AreaChartPropsContext, useAreaChartPropsContext } from "./area-chart.js";
+//#region src/components/chart/area-chart.namespace.ts
+var area_chart_namespace_exports = /* @__PURE__ */ __exportAll({
+	Area: () => ChartArea,
+	Grid: () => ChartGrid,
+	Label: () => ChartLabel,
+	LabelList: () => ChartLabelList,
+	Legend: () => ChartLegend,
+	PropsContext: () => AreaChartPropsContext,
+	ReferenceLine: () => ChartReferenceLine,
+	Root: () => AreaChart,
+	Tooltip: () => ChartTooltip,
+	XAxis: () => ChartXAxis,
+	YAxis: () => ChartYAxis,
+	gradients: () => gradients,
+	mergeSeries: () => mergeSeries,
+	usePropsContext: () => useAreaChartPropsContext
+});
+//#endregion
+export { area_chart_namespace_exports };
+//# sourceMappingURL=area-chart.namespace.js.map

package/dist/esm/components/chart/area-chart.namespace.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"area-chart.namespace.js","names":[],"sources":["../../../../src/components/chart/area-chart.namespace.ts"],"sourcesContent":["export type { AreaChartProps as RootProps } from \"./area-chart\"\nexport {\n AreaChartPropsContext as PropsContext,\n AreaChart as Root,\n useAreaChartPropsContext as usePropsContext,\n} from \"./area-chart\"\nexport type {\n ChartAreaProps as AreaProps,\n ChartGridProps as GridProps,\n ChartReferenceLineProps as ReferenceLineProps,\n ChartXAxisProps as XAxisProps,\n ChartXAxisTick as XAxisTick,\n ChartYAxisProps as YAxisProps,\n ChartYAxisTick as YAxisTick,\n} from \"./cartesian-chart\"\nexport {\n ChartArea as Area,\n ChartGrid as Grid,\n ChartReferenceLine as ReferenceLine,\n ChartXAxis as XAxis,\n ChartYAxis as YAxis,\n} from \"./cartesian-chart\"\nexport type {\n ChartActiveDot as ActiveDot,\n ChartLabel as AreaLabel,\n ChartLabelList as AreaLabelList,\n ChartDot as Dot,\n ChartLabelListProps as LabelListProps,\n ChartLabelProps as LabelProps,\n ChartLegendProps as LegendProps,\n ChartTickLine as TickLine,\n ChartTooltipProps as TooltipProps,\n} from \"./chart\"\nexport {\n gradients,\n ChartLabel as Label,\n ChartLabelList as LabelList,\n ChartLegend as Legend,\n mergeSeries,\n ChartTooltip as Tooltip,\n} from \"./chart\"\n"],"mappings":""}

package/dist/esm/components/chart/area-chart.style.js ADDED Viewed

@@ -0,0 +1,12 @@
+import { defineComponentStyle } from "../../core/system/config.js";
+import "../../core/index.js";
+//#region src/components/chart/area-chart.style.ts
+const areaChartStyle = defineComponentStyle({ base: {
+	"--legend-swatch-color": "{line-stroke}",
+	"--tooltip-swatch-color": "{line-stroke}"
+} });
+//#endregion
+export { areaChartStyle };
+//# sourceMappingURL=area-chart.style.js.map

package/dist/esm/components/chart/area-chart.style.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"area-chart.style.js","names":[],"sources":["../../../../src/components/chart/area-chart.style.ts"],"sourcesContent":["import { defineComponentStyle } from \"../../core\"\n\nexport const areaChartStyle = defineComponentStyle({\n base: {\n \"--legend-swatch-color\": \"{line-stroke}\",\n \"--tooltip-swatch-color\": \"{line-stroke}\",\n },\n})\n\nexport type AreaChartStyle = typeof areaChartStyle\n"],"mappings":";;;;AAEA,MAAa,iBAAiB,qBAAqB,EACjD,MAAM;CACJ,yBAAyB;CACzB,0BAA0B;CAC3B,EACF,CAAC"}

package/dist/esm/components/chart/bar-chart.js ADDED Viewed

@@ -0,0 +1,38 @@
+"use client";
+import { createComponent } from "../../core/components/create-component.js";
+import "../../core/index.js";
+import { barChartStyle } from "./bar-chart.style.js";
+import { CartesianChart, ChartBar } from "./cartesian-chart.js";
+import { useBarChart } from "./use-bar-chart.js";
+import { useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+import { BarChart } from "recharts";
+//#region src/components/chart/bar-chart.tsx
+const { PropsContext: BarChartPropsContext, usePropsContext: useBarChartPropsContext, withContext } = createComponent("bar-chart", barChartStyle);
+/**
+* `BarChart` is a component for drawing bar charts to compare multiple sets of data.
+*
+* @see https://yamada-ui.com/docs/components/bar-chart
+*/
+const BarChart$1 = withContext(({ children, series = [], chartProps, ...rest }) => {
+	const { getChartProps, getRootProps } = useBarChart(rest);
+	return /* @__PURE__ */ jsx(CartesianChart, {
+		components: useMemo(() => [{
+			component: ChartBar,
+			fallback: series.map((props, index) => /* @__PURE__ */ jsx(ChartBar, { ...props }, index))
+		}], [series]),
+		render: (props) => /* @__PURE__ */ jsx(BarChart, { ...getChartProps({
+			...props,
+			...chartProps
+		}) }),
+		series,
+		...getRootProps(),
+		children
+	});
+})();
+//#endregion
+export { BarChart$1 as BarChart, BarChartPropsContext, useBarChartPropsContext };
+//# sourceMappingURL=bar-chart.js.map