@cimpress-ui/react 0.1.0 → 0.2.1
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.
- package/README.md +1 -1
- package/dist/commonjs/components/breadcrumbs/breadcrumbs.d.ts +22 -0
- package/dist/commonjs/components/breadcrumbs/breadcrumbs.d.ts.map +1 -0
- package/dist/commonjs/components/breadcrumbs/breadcrumbs.js +37 -0
- package/dist/commonjs/components/breadcrumbs/breadcrumbs.js.map +1 -0
- package/dist/commonjs/components/button/button.js +1 -1
- package/dist/commonjs/components/button/button.js.map +1 -1
- package/dist/commonjs/components/button/icon-button.js +1 -1
- package/dist/commonjs/components/button/icon-button.js.map +1 -1
- package/dist/commonjs/components/button/types.d.ts.map +1 -1
- package/dist/commonjs/components/button/types.js.map +1 -1
- package/dist/commonjs/components/card/card-context.d.ts +4 -0
- package/dist/commonjs/components/card/card-context.d.ts.map +1 -0
- package/dist/commonjs/components/card/card-context.js +6 -0
- package/dist/commonjs/components/card/card-context.js.map +1 -0
- package/dist/commonjs/components/card/card.d.ts +15 -0
- package/dist/commonjs/components/card/card.d.ts.map +1 -0
- package/dist/commonjs/components/card/card.js +24 -0
- package/dist/commonjs/components/card/card.js.map +1 -0
- package/dist/commonjs/components/checkbox/checkbox.d.ts +1 -1
- package/dist/commonjs/components/checkbox/checkbox.d.ts.map +1 -1
- package/dist/commonjs/components/checkbox/checkbox.js.map +1 -1
- package/dist/commonjs/components/combo-box/combo-box.d.ts +5 -1
- package/dist/commonjs/components/combo-box/combo-box.d.ts.map +1 -1
- package/dist/commonjs/components/combo-box/combo-box.js +6 -6
- package/dist/commonjs/components/combo-box/combo-box.js.map +1 -1
- package/dist/commonjs/components/disclosure/disclosure-group.d.ts +10 -0
- package/dist/commonjs/components/disclosure/disclosure-group.d.ts.map +1 -0
- package/dist/commonjs/components/disclosure/disclosure-group.js +18 -0
- package/dist/commonjs/components/disclosure/disclosure-group.js.map +1 -0
- package/dist/commonjs/components/disclosure/disclosure.d.ts +14 -0
- package/dist/commonjs/components/disclosure/disclosure.d.ts.map +1 -0
- package/dist/commonjs/components/disclosure/disclosure.js +20 -0
- package/dist/commonjs/components/disclosure/disclosure.js.map +1 -0
- package/dist/commonjs/components/internal/collapsible-list/collapsible-list.d.ts +0 -14
- package/dist/commonjs/components/internal/collapsible-list/collapsible-list.d.ts.map +1 -1
- package/dist/commonjs/components/internal/collapsible-list/collapsible-list.js +2 -4
- package/dist/commonjs/components/internal/collapsible-list/collapsible-list.js.map +1 -1
- package/dist/commonjs/components/internal/form-field/form-field.d.ts +1 -28
- package/dist/commonjs/components/internal/form-field/form-field.d.ts.map +1 -1
- package/dist/commonjs/components/internal/form-field/form-field.js +10 -0
- package/dist/commonjs/components/internal/form-field/form-field.js.map +1 -1
- package/dist/commonjs/components/internal/spinner/spinner.d.ts +0 -16
- package/dist/commonjs/components/internal/spinner/spinner.d.ts.map +1 -1
- package/dist/commonjs/components/modal/modal.d.ts +19 -0
- package/dist/commonjs/components/modal/modal.d.ts.map +1 -0
- package/dist/commonjs/components/modal/modal.js +25 -0
- package/dist/commonjs/components/modal/modal.js.map +1 -0
- package/dist/commonjs/components/nav-tabs/nav-tabs.d.ts +23 -0
- package/dist/commonjs/components/nav-tabs/nav-tabs.d.ts.map +1 -0
- package/dist/commonjs/components/nav-tabs/nav-tabs.js +27 -0
- package/dist/commonjs/components/nav-tabs/nav-tabs.js.map +1 -0
- package/dist/commonjs/components/number-field/number-field.d.ts +10 -0
- package/dist/commonjs/components/number-field/number-field.d.ts.map +1 -0
- package/dist/commonjs/components/number-field/number-field.js +32 -0
- package/dist/commonjs/components/number-field/number-field.js.map +1 -0
- package/dist/commonjs/components/pagination/pagination.d.ts +14 -0
- package/dist/commonjs/components/pagination/pagination.d.ts.map +1 -0
- package/dist/commonjs/components/pagination/pagination.js +69 -0
- package/dist/commonjs/components/pagination/pagination.js.map +1 -0
- package/dist/commonjs/components/radio/radio.d.ts +1 -1
- package/dist/commonjs/components/radio/radio.d.ts.map +1 -1
- package/dist/commonjs/components/radio/radio.js.map +1 -1
- package/dist/commonjs/components/table/contexts/focus.d.ts +13 -0
- package/dist/commonjs/components/table/contexts/focus.d.ts.map +1 -0
- package/dist/commonjs/components/table/contexts/focus.js +51 -0
- package/dist/commonjs/components/table/contexts/focus.js.map +1 -0
- package/dist/commonjs/components/table/contexts/row-state.d.ts +10 -0
- package/dist/commonjs/components/table/contexts/row-state.d.ts.map +1 -0
- package/dist/commonjs/components/table/contexts/row-state.js +22 -0
- package/dist/commonjs/components/table/contexts/row-state.js.map +1 -0
- package/dist/commonjs/components/table/hooks/use-table-cell.d.ts +7 -0
- package/dist/commonjs/components/table/hooks/use-table-cell.d.ts.map +1 -0
- package/dist/commonjs/components/table/hooks/use-table-cell.js +125 -0
- package/dist/commonjs/components/table/hooks/use-table-cell.js.map +1 -0
- package/dist/commonjs/components/table/hooks/use-table.d.ts +7 -0
- package/dist/commonjs/components/table/hooks/use-table.d.ts.map +1 -0
- package/dist/commonjs/components/table/hooks/use-table.js +142 -0
- package/dist/commonjs/components/table/hooks/use-table.js.map +1 -0
- package/dist/commonjs/components/table/table-body-cell.d.ts +26 -0
- package/dist/commonjs/components/table/table-body-cell.d.ts.map +1 -0
- package/dist/commonjs/components/table/table-body-cell.js +17 -0
- package/dist/commonjs/components/table/table-body-cell.js.map +1 -0
- package/dist/commonjs/components/table/table-body.d.ts +8 -0
- package/dist/commonjs/components/table/table-body.d.ts.map +1 -0
- package/dist/commonjs/components/table/table-body.js +11 -0
- package/dist/commonjs/components/table/table-body.js.map +1 -0
- package/dist/commonjs/components/table/table-container.d.ts +8 -0
- package/dist/commonjs/components/table/table-container.d.ts.map +1 -0
- package/dist/commonjs/components/table/table-container.js +40 -0
- package/dist/commonjs/components/table/table-container.js.map +1 -0
- package/dist/commonjs/components/table/table-header-cell.d.ts +26 -0
- package/dist/commonjs/components/table/table-header-cell.d.ts.map +1 -0
- package/dist/commonjs/components/table/table-header-cell.js +17 -0
- package/dist/commonjs/components/table/table-header-cell.js.map +1 -0
- package/dist/commonjs/components/table/table-header.d.ts +8 -0
- package/dist/commonjs/components/table/table-header.d.ts.map +1 -0
- package/dist/commonjs/components/table/table-header.js +11 -0
- package/dist/commonjs/components/table/table-header.js.map +1 -0
- package/dist/commonjs/components/table/table-row.d.ts +21 -0
- package/dist/commonjs/components/table/table-row.d.ts.map +1 -0
- package/dist/commonjs/components/table/table-row.js +14 -0
- package/dist/commonjs/components/table/table-row.js.map +1 -0
- package/dist/commonjs/components/table/table.d.ts +26 -0
- package/dist/commonjs/components/table/table.d.ts.map +1 -0
- package/dist/commonjs/components/table/table.js +27 -0
- package/dist/commonjs/components/table/table.js.map +1 -0
- package/dist/commonjs/components/table/utils/focus-table-child.d.ts +4 -0
- package/dist/commonjs/components/table/utils/focus-table-child.d.ts.map +1 -0
- package/dist/commonjs/components/table/utils/focus-table-child.js +14 -0
- package/dist/commonjs/components/table/utils/focus-table-child.js.map +1 -0
- package/dist/commonjs/components/tag/tag-group.d.ts +18 -0
- package/dist/commonjs/components/tag/tag-group.d.ts.map +1 -0
- package/dist/commonjs/components/tag/tag-group.js +27 -0
- package/dist/commonjs/components/tag/tag-group.js.map +1 -0
- package/dist/commonjs/components/tag/tag.d.ts +17 -0
- package/dist/commonjs/components/tag/tag.d.ts.map +1 -0
- package/dist/commonjs/components/tag/tag.js +20 -0
- package/dist/commonjs/components/tag/tag.js.map +1 -0
- package/dist/commonjs/components/text-inputs/text-area.d.ts.map +1 -1
- package/dist/commonjs/components/text-inputs/text-area.js +1 -1
- package/dist/commonjs/components/text-inputs/text-area.js.map +1 -1
- package/dist/commonjs/components/text-inputs/text-field.d.ts.map +1 -1
- package/dist/commonjs/components/text-inputs/text-field.js +1 -1
- package/dist/commonjs/components/text-inputs/text-field.js.map +1 -1
- package/dist/commonjs/components/tooltip/tooltip.d.ts +9 -0
- package/dist/commonjs/components/tooltip/tooltip.d.ts.map +1 -0
- package/dist/commonjs/components/tooltip/tooltip.js +15 -0
- package/dist/commonjs/components/tooltip/tooltip.js.map +1 -0
- package/dist/commonjs/components/types.d.ts +16 -2
- package/dist/commonjs/components/types.d.ts.map +1 -1
- package/dist/commonjs/components/types.js.map +1 -1
- package/dist/commonjs/components/typography/link.d.ts +2 -2
- package/dist/commonjs/components/typography/link.d.ts.map +1 -1
- package/dist/commonjs/components/typography/link.js +3 -2
- package/dist/commonjs/components/typography/link.js.map +1 -1
- package/dist/commonjs/components/typography/types.d.ts +2 -1
- package/dist/commonjs/components/typography/types.d.ts.map +1 -1
- package/dist/commonjs/components/typography/types.js.map +1 -1
- package/dist/commonjs/components/typography/utils.d.ts.map +1 -1
- package/dist/commonjs/components/typography/utils.js +2 -2
- package/dist/commonjs/components/typography/utils.js.map +1 -1
- package/dist/commonjs/components/visually-hidden/visually-hidden.d.ts +17 -0
- package/dist/commonjs/components/visually-hidden/visually-hidden.d.ts.map +1 -0
- package/dist/commonjs/components/visually-hidden/visually-hidden.js +20 -0
- package/dist/commonjs/components/visually-hidden/visually-hidden.js.map +1 -0
- package/dist/commonjs/icons/accounting-document.d.ts +1 -1
- package/dist/commonjs/icons/accounting-document.d.ts.map +1 -1
- package/dist/commonjs/icons/accounting-document.js +4 -2
- package/dist/commonjs/icons/accounting-document.js.map +1 -1
- package/dist/commonjs/icons/add-circle-fill.d.ts +1 -1
- package/dist/commonjs/icons/add-circle-fill.d.ts.map +1 -1
- package/dist/commonjs/icons/add-circle-fill.js +4 -2
- package/dist/commonjs/icons/add-circle-fill.js.map +1 -1
- package/dist/commonjs/icons/add-circle.d.ts +1 -1
- package/dist/commonjs/icons/add-circle.d.ts.map +1 -1
- package/dist/commonjs/icons/add-circle.js +4 -2
- package/dist/commonjs/icons/add-circle.js.map +1 -1
- package/dist/commonjs/icons/add.d.ts +1 -1
- package/dist/commonjs/icons/add.d.ts.map +1 -1
- package/dist/commonjs/icons/add.js +4 -2
- package/dist/commonjs/icons/add.js.map +1 -1
- package/dist/commonjs/icons/alert-triangle.d.ts +1 -1
- package/dist/commonjs/icons/alert-triangle.d.ts.map +1 -1
- package/dist/commonjs/icons/alert-triangle.js +4 -2
- package/dist/commonjs/icons/alert-triangle.js.map +1 -1
- package/dist/commonjs/icons/calculator-alt.d.ts +1 -1
- package/dist/commonjs/icons/calculator-alt.d.ts.map +1 -1
- package/dist/commonjs/icons/calculator-alt.js +4 -2
- package/dist/commonjs/icons/calculator-alt.js.map +1 -1
- package/dist/commonjs/icons/calculator.d.ts +1 -1
- package/dist/commonjs/icons/calculator.d.ts.map +1 -1
- package/dist/commonjs/icons/calculator.js +4 -2
- package/dist/commonjs/icons/calculator.js.map +1 -1
- package/dist/commonjs/icons/checkmark-circle-fill.d.ts +1 -1
- package/dist/commonjs/icons/checkmark-circle-fill.d.ts.map +1 -1
- package/dist/commonjs/icons/checkmark-circle-fill.js +4 -2
- package/dist/commonjs/icons/checkmark-circle-fill.js.map +1 -1
- package/dist/commonjs/icons/checkmark-circle.d.ts +1 -1
- package/dist/commonjs/icons/checkmark-circle.d.ts.map +1 -1
- package/dist/commonjs/icons/checkmark-circle.js +4 -2
- package/dist/commonjs/icons/checkmark-circle.js.map +1 -1
- package/dist/commonjs/icons/checkmark-small.d.ts +1 -1
- package/dist/commonjs/icons/checkmark-small.d.ts.map +1 -1
- package/dist/commonjs/icons/checkmark-small.js +4 -2
- package/dist/commonjs/icons/checkmark-small.js.map +1 -1
- package/dist/commonjs/icons/checkmark.d.ts +1 -1
- package/dist/commonjs/icons/checkmark.d.ts.map +1 -1
- package/dist/commonjs/icons/checkmark.js +4 -2
- package/dist/commonjs/icons/checkmark.js.map +1 -1
- package/dist/commonjs/icons/chevron-down-fill.d.ts +1 -1
- package/dist/commonjs/icons/chevron-down-fill.d.ts.map +1 -1
- package/dist/commonjs/icons/chevron-down-fill.js +4 -2
- package/dist/commonjs/icons/chevron-down-fill.js.map +1 -1
- package/dist/commonjs/icons/error-circle-fill.d.ts +1 -1
- package/dist/commonjs/icons/error-circle-fill.d.ts.map +1 -1
- package/dist/commonjs/icons/error-circle-fill.js +5 -3
- package/dist/commonjs/icons/error-circle-fill.js.map +1 -1
- package/dist/commonjs/icons/index.d.ts +6 -0
- package/dist/commonjs/icons/index.d.ts.map +1 -1
- package/dist/commonjs/icons/index.js +13 -1
- package/dist/commonjs/icons/index.js.map +1 -1
- package/dist/commonjs/icons/info-circle-fill.d.ts +1 -1
- package/dist/commonjs/icons/info-circle-fill.d.ts.map +1 -1
- package/dist/commonjs/icons/info-circle-fill.js +4 -2
- package/dist/commonjs/icons/info-circle-fill.js.map +1 -1
- package/dist/commonjs/icons/minus-small.d.ts +1 -1
- package/dist/commonjs/icons/minus-small.d.ts.map +1 -1
- package/dist/commonjs/icons/minus-small.js +4 -2
- package/dist/commonjs/icons/minus-small.js.map +1 -1
- package/dist/commonjs/icons/minus.d.ts +8 -0
- package/dist/commonjs/icons/minus.d.ts.map +1 -0
- package/dist/commonjs/icons/minus.js +24 -0
- package/dist/commonjs/icons/minus.js.map +1 -0
- package/dist/commonjs/icons/unstable-chevron-left-fill.d.ts +8 -0
- package/dist/commonjs/icons/unstable-chevron-left-fill.d.ts.map +1 -0
- package/dist/commonjs/icons/unstable-chevron-left-fill.js +24 -0
- package/dist/commonjs/icons/unstable-chevron-left-fill.js.map +1 -0
- package/dist/commonjs/icons/unstable-chevron-right-fill.d.ts +8 -0
- package/dist/commonjs/icons/unstable-chevron-right-fill.d.ts.map +1 -0
- package/dist/commonjs/icons/unstable-chevron-right-fill.js +24 -0
- package/dist/commonjs/icons/unstable-chevron-right-fill.js.map +1 -0
- package/dist/commonjs/icons/unstable-close.d.ts +8 -0
- package/dist/commonjs/icons/unstable-close.d.ts.map +1 -0
- package/dist/commonjs/icons/unstable-close.js +24 -0
- package/dist/commonjs/icons/unstable-close.js.map +1 -0
- package/dist/commonjs/icons/unstable-info-circle.d.ts +8 -0
- package/dist/commonjs/icons/unstable-info-circle.d.ts.map +1 -0
- package/dist/commonjs/icons/unstable-info-circle.js +24 -0
- package/dist/commonjs/icons/unstable-info-circle.js.map +1 -0
- package/dist/commonjs/icons/unstable-placeholder.d.ts +8 -0
- package/dist/commonjs/icons/unstable-placeholder.d.ts.map +1 -0
- package/dist/commonjs/icons/unstable-placeholder.js +24 -0
- package/dist/commonjs/icons/unstable-placeholder.js.map +1 -0
- package/dist/commonjs/icons/warning-circle-fill.d.ts +1 -1
- package/dist/commonjs/icons/warning-circle-fill.d.ts.map +1 -1
- package/dist/commonjs/icons/warning-circle-fill.js +4 -2
- package/dist/commonjs/icons/warning-circle-fill.js.map +1 -1
- package/dist/commonjs/index.d.ts +21 -1
- package/dist/commonjs/index.d.ts.map +1 -1
- package/dist/commonjs/index.js +19 -0
- package/dist/commonjs/index.js.map +1 -1
- package/dist/commonjs/utils/style/tone.d.ts +3 -0
- package/dist/commonjs/utils/style/tone.d.ts.map +1 -0
- package/dist/commonjs/utils/style/tone.js +7 -0
- package/dist/commonjs/utils/style/tone.js.map +1 -0
- package/dist/commonjs/utils/style/types.d.ts +2 -0
- package/dist/commonjs/utils/style/types.d.ts.map +1 -0
- package/dist/commonjs/utils/style/types.js +3 -0
- package/dist/commonjs/utils/style/types.js.map +1 -0
- package/dist/commonjs/with-style-props.d.ts +1 -1
- package/dist/commonjs/with-style-props.d.ts.map +1 -1
- package/dist/commonjs/with-style-props.js.map +1 -1
- package/dist/esm/components/breadcrumbs/breadcrumbs.d.ts +22 -0
- package/dist/esm/components/breadcrumbs/breadcrumbs.d.ts.map +1 -0
- package/dist/esm/components/breadcrumbs/breadcrumbs.js +30 -0
- package/dist/esm/components/breadcrumbs/breadcrumbs.js.map +1 -0
- package/dist/esm/components/button/button.js +1 -1
- package/dist/esm/components/button/button.js.map +1 -1
- package/dist/esm/components/button/icon-button.js +1 -1
- package/dist/esm/components/button/icon-button.js.map +1 -1
- package/dist/esm/components/button/types.d.ts.map +1 -1
- package/dist/esm/components/button/types.js.map +1 -1
- package/dist/esm/components/card/card-context.d.ts +4 -0
- package/dist/esm/components/card/card-context.d.ts.map +1 -0
- package/dist/esm/components/card/card-context.js +3 -0
- package/dist/esm/components/card/card-context.js.map +1 -0
- package/dist/esm/components/card/card.d.ts +15 -0
- package/dist/esm/components/card/card.d.ts.map +1 -0
- package/dist/esm/components/card/card.js +17 -0
- package/dist/esm/components/card/card.js.map +1 -0
- package/dist/esm/components/checkbox/checkbox.d.ts +1 -1
- package/dist/esm/components/checkbox/checkbox.d.ts.map +1 -1
- package/dist/esm/components/checkbox/checkbox.js.map +1 -1
- package/dist/esm/components/combo-box/combo-box.d.ts +5 -1
- package/dist/esm/components/combo-box/combo-box.d.ts.map +1 -1
- package/dist/esm/components/combo-box/combo-box.js +7 -7
- package/dist/esm/components/combo-box/combo-box.js.map +1 -1
- package/dist/esm/components/disclosure/disclosure-group.d.ts +10 -0
- package/dist/esm/components/disclosure/disclosure-group.d.ts.map +1 -0
- package/dist/esm/components/disclosure/disclosure-group.js +12 -0
- package/dist/esm/components/disclosure/disclosure-group.js.map +1 -0
- package/dist/esm/components/disclosure/disclosure.d.ts +14 -0
- package/dist/esm/components/disclosure/disclosure.d.ts.map +1 -0
- package/dist/esm/components/disclosure/disclosure.js +14 -0
- package/dist/esm/components/disclosure/disclosure.js.map +1 -0
- package/dist/esm/components/internal/collapsible-list/collapsible-list.d.ts +0 -14
- package/dist/esm/components/internal/collapsible-list/collapsible-list.d.ts.map +1 -1
- package/dist/esm/components/internal/collapsible-list/collapsible-list.js +2 -4
- package/dist/esm/components/internal/collapsible-list/collapsible-list.js.map +1 -1
- package/dist/esm/components/internal/form-field/form-field.d.ts +1 -28
- package/dist/esm/components/internal/form-field/form-field.d.ts.map +1 -1
- package/dist/esm/components/internal/form-field/form-field.js +10 -1
- package/dist/esm/components/internal/form-field/form-field.js.map +1 -1
- package/dist/esm/components/internal/spinner/spinner.d.ts +0 -16
- package/dist/esm/components/internal/spinner/spinner.d.ts.map +1 -1
- package/dist/esm/components/modal/modal.d.ts +19 -0
- package/dist/esm/components/modal/modal.d.ts.map +1 -0
- package/dist/esm/components/modal/modal.js +18 -0
- package/dist/esm/components/modal/modal.js.map +1 -0
- package/dist/esm/components/nav-tabs/nav-tabs.d.ts +23 -0
- package/dist/esm/components/nav-tabs/nav-tabs.d.ts.map +1 -0
- package/dist/esm/components/nav-tabs/nav-tabs.js +20 -0
- package/dist/esm/components/nav-tabs/nav-tabs.js.map +1 -0
- package/dist/esm/components/number-field/number-field.d.ts +10 -0
- package/dist/esm/components/number-field/number-field.d.ts.map +1 -0
- package/dist/esm/components/number-field/number-field.js +26 -0
- package/dist/esm/components/number-field/number-field.js.map +1 -0
- package/dist/esm/components/pagination/pagination.d.ts +14 -0
- package/dist/esm/components/pagination/pagination.d.ts.map +1 -0
- package/dist/esm/components/pagination/pagination.js +66 -0
- package/dist/esm/components/pagination/pagination.js.map +1 -0
- package/dist/esm/components/radio/radio.d.ts +1 -1
- package/dist/esm/components/radio/radio.d.ts.map +1 -1
- package/dist/esm/components/radio/radio.js.map +1 -1
- package/dist/esm/components/table/contexts/focus.d.ts +13 -0
- package/dist/esm/components/table/contexts/focus.d.ts.map +1 -0
- package/dist/esm/components/table/contexts/focus.js +47 -0
- package/dist/esm/components/table/contexts/focus.js.map +1 -0
- package/dist/esm/components/table/contexts/row-state.d.ts +10 -0
- package/dist/esm/components/table/contexts/row-state.d.ts.map +1 -0
- package/dist/esm/components/table/contexts/row-state.js +18 -0
- package/dist/esm/components/table/contexts/row-state.js.map +1 -0
- package/dist/esm/components/table/hooks/use-table-cell.d.ts +7 -0
- package/dist/esm/components/table/hooks/use-table-cell.d.ts.map +1 -0
- package/dist/esm/components/table/hooks/use-table-cell.js +122 -0
- package/dist/esm/components/table/hooks/use-table-cell.js.map +1 -0
- package/dist/esm/components/table/hooks/use-table.d.ts +7 -0
- package/dist/esm/components/table/hooks/use-table.d.ts.map +1 -0
- package/dist/esm/components/table/hooks/use-table.js +139 -0
- package/dist/esm/components/table/hooks/use-table.js.map +1 -0
- package/dist/esm/components/table/table-body-cell.d.ts +26 -0
- package/dist/esm/components/table/table-body-cell.d.ts.map +1 -0
- package/dist/esm/components/table/table-body-cell.js +14 -0
- package/dist/esm/components/table/table-body-cell.js.map +1 -0
- package/dist/esm/components/table/table-body.d.ts +8 -0
- package/dist/esm/components/table/table-body.d.ts.map +1 -0
- package/dist/esm/components/table/table-body.js +8 -0
- package/dist/esm/components/table/table-body.js.map +1 -0
- package/dist/esm/components/table/table-container.d.ts +8 -0
- package/dist/esm/components/table/table-container.d.ts.map +1 -0
- package/dist/esm/components/table/table-container.js +34 -0
- package/dist/esm/components/table/table-container.js.map +1 -0
- package/dist/esm/components/table/table-header-cell.d.ts +26 -0
- package/dist/esm/components/table/table-header-cell.d.ts.map +1 -0
- package/dist/esm/components/table/table-header-cell.js +14 -0
- package/dist/esm/components/table/table-header-cell.js.map +1 -0
- package/dist/esm/components/table/table-header.d.ts +8 -0
- package/dist/esm/components/table/table-header.d.ts.map +1 -0
- package/dist/esm/components/table/table-header.js +8 -0
- package/dist/esm/components/table/table-header.js.map +1 -0
- package/dist/esm/components/table/table-row.d.ts +21 -0
- package/dist/esm/components/table/table-row.d.ts.map +1 -0
- package/dist/esm/components/table/table-row.js +11 -0
- package/dist/esm/components/table/table-row.js.map +1 -0
- package/dist/esm/components/table/table.d.ts +26 -0
- package/dist/esm/components/table/table.d.ts.map +1 -0
- package/dist/esm/components/table/table.js +24 -0
- package/dist/esm/components/table/table.js.map +1 -0
- package/dist/esm/components/table/utils/focus-table-child.d.ts +4 -0
- package/dist/esm/components/table/utils/focus-table-child.d.ts.map +1 -0
- package/dist/esm/components/table/utils/focus-table-child.js +11 -0
- package/dist/esm/components/table/utils/focus-table-child.js.map +1 -0
- package/dist/esm/components/tag/tag-group.d.ts +18 -0
- package/dist/esm/components/tag/tag-group.d.ts.map +1 -0
- package/dist/esm/components/tag/tag-group.js +21 -0
- package/dist/esm/components/tag/tag-group.js.map +1 -0
- package/dist/esm/components/tag/tag.d.ts +17 -0
- package/dist/esm/components/tag/tag.d.ts.map +1 -0
- package/dist/esm/components/tag/tag.js +14 -0
- package/dist/esm/components/tag/tag.js.map +1 -0
- package/dist/esm/components/text-inputs/text-area.d.ts.map +1 -1
- package/dist/esm/components/text-inputs/text-area.js +3 -3
- package/dist/esm/components/text-inputs/text-area.js.map +1 -1
- package/dist/esm/components/text-inputs/text-field.d.ts.map +1 -1
- package/dist/esm/components/text-inputs/text-field.js +3 -3
- package/dist/esm/components/text-inputs/text-field.js.map +1 -1
- package/dist/esm/components/tooltip/tooltip.d.ts +9 -0
- package/dist/esm/components/tooltip/tooltip.d.ts.map +1 -0
- package/dist/esm/components/tooltip/tooltip.js +9 -0
- package/dist/esm/components/tooltip/tooltip.js.map +1 -0
- package/dist/esm/components/types.d.ts +16 -2
- package/dist/esm/components/types.d.ts.map +1 -1
- package/dist/esm/components/types.js.map +1 -1
- package/dist/esm/components/typography/link.d.ts +2 -2
- package/dist/esm/components/typography/link.d.ts.map +1 -1
- package/dist/esm/components/typography/link.js +3 -2
- package/dist/esm/components/typography/link.js.map +1 -1
- package/dist/esm/components/typography/types.d.ts +2 -1
- package/dist/esm/components/typography/types.d.ts.map +1 -1
- package/dist/esm/components/typography/types.js.map +1 -1
- package/dist/esm/components/typography/utils.d.ts.map +1 -1
- package/dist/esm/components/typography/utils.js +2 -2
- package/dist/esm/components/typography/utils.js.map +1 -1
- package/dist/esm/components/visually-hidden/visually-hidden.d.ts +17 -0
- package/dist/esm/components/visually-hidden/visually-hidden.d.ts.map +1 -0
- package/dist/esm/components/visually-hidden/visually-hidden.js +14 -0
- package/dist/esm/components/visually-hidden/visually-hidden.js.map +1 -0
- package/dist/esm/icons/accounting-document.d.ts +1 -1
- package/dist/esm/icons/accounting-document.d.ts.map +1 -1
- package/dist/esm/icons/accounting-document.js +4 -2
- package/dist/esm/icons/accounting-document.js.map +1 -1
- package/dist/esm/icons/add-circle-fill.d.ts +1 -1
- package/dist/esm/icons/add-circle-fill.d.ts.map +1 -1
- package/dist/esm/icons/add-circle-fill.js +4 -2
- package/dist/esm/icons/add-circle-fill.js.map +1 -1
- package/dist/esm/icons/add-circle.d.ts +1 -1
- package/dist/esm/icons/add-circle.d.ts.map +1 -1
- package/dist/esm/icons/add-circle.js +4 -2
- package/dist/esm/icons/add-circle.js.map +1 -1
- package/dist/esm/icons/add.d.ts +1 -1
- package/dist/esm/icons/add.d.ts.map +1 -1
- package/dist/esm/icons/add.js +4 -2
- package/dist/esm/icons/add.js.map +1 -1
- package/dist/esm/icons/alert-triangle.d.ts +1 -1
- package/dist/esm/icons/alert-triangle.d.ts.map +1 -1
- package/dist/esm/icons/alert-triangle.js +4 -2
- package/dist/esm/icons/alert-triangle.js.map +1 -1
- package/dist/esm/icons/calculator-alt.d.ts +1 -1
- package/dist/esm/icons/calculator-alt.d.ts.map +1 -1
- package/dist/esm/icons/calculator-alt.js +4 -2
- package/dist/esm/icons/calculator-alt.js.map +1 -1
- package/dist/esm/icons/calculator.d.ts +1 -1
- package/dist/esm/icons/calculator.d.ts.map +1 -1
- package/dist/esm/icons/calculator.js +4 -2
- package/dist/esm/icons/calculator.js.map +1 -1
- package/dist/esm/icons/checkmark-circle-fill.d.ts +1 -1
- package/dist/esm/icons/checkmark-circle-fill.d.ts.map +1 -1
- package/dist/esm/icons/checkmark-circle-fill.js +4 -2
- package/dist/esm/icons/checkmark-circle-fill.js.map +1 -1
- package/dist/esm/icons/checkmark-circle.d.ts +1 -1
- package/dist/esm/icons/checkmark-circle.d.ts.map +1 -1
- package/dist/esm/icons/checkmark-circle.js +4 -2
- package/dist/esm/icons/checkmark-circle.js.map +1 -1
- package/dist/esm/icons/checkmark-small.d.ts +1 -1
- package/dist/esm/icons/checkmark-small.d.ts.map +1 -1
- package/dist/esm/icons/checkmark-small.js +4 -2
- package/dist/esm/icons/checkmark-small.js.map +1 -1
- package/dist/esm/icons/checkmark.d.ts +1 -1
- package/dist/esm/icons/checkmark.d.ts.map +1 -1
- package/dist/esm/icons/checkmark.js +4 -2
- package/dist/esm/icons/checkmark.js.map +1 -1
- package/dist/esm/icons/chevron-down-fill.d.ts +1 -1
- package/dist/esm/icons/chevron-down-fill.d.ts.map +1 -1
- package/dist/esm/icons/chevron-down-fill.js +4 -2
- package/dist/esm/icons/chevron-down-fill.js.map +1 -1
- package/dist/esm/icons/error-circle-fill.d.ts +1 -1
- package/dist/esm/icons/error-circle-fill.d.ts.map +1 -1
- package/dist/esm/icons/error-circle-fill.js +6 -4
- package/dist/esm/icons/error-circle-fill.js.map +1 -1
- package/dist/esm/icons/index.d.ts +6 -0
- package/dist/esm/icons/index.d.ts.map +1 -1
- package/dist/esm/icons/index.js +6 -0
- package/dist/esm/icons/index.js.map +1 -1
- package/dist/esm/icons/info-circle-fill.d.ts +1 -1
- package/dist/esm/icons/info-circle-fill.d.ts.map +1 -1
- package/dist/esm/icons/info-circle-fill.js +4 -2
- package/dist/esm/icons/info-circle-fill.js.map +1 -1
- package/dist/esm/icons/minus-small.d.ts +1 -1
- package/dist/esm/icons/minus-small.d.ts.map +1 -1
- package/dist/esm/icons/minus-small.js +4 -2
- package/dist/esm/icons/minus-small.js.map +1 -1
- package/dist/esm/icons/minus.d.ts +8 -0
- package/dist/esm/icons/minus.d.ts.map +1 -0
- package/dist/esm/icons/minus.js +19 -0
- package/dist/esm/icons/minus.js.map +1 -0
- package/dist/esm/icons/unstable-chevron-left-fill.d.ts +8 -0
- package/dist/esm/icons/unstable-chevron-left-fill.d.ts.map +1 -0
- package/dist/esm/icons/unstable-chevron-left-fill.js +19 -0
- package/dist/esm/icons/unstable-chevron-left-fill.js.map +1 -0
- package/dist/esm/icons/unstable-chevron-right-fill.d.ts +8 -0
- package/dist/esm/icons/unstable-chevron-right-fill.d.ts.map +1 -0
- package/dist/esm/icons/unstable-chevron-right-fill.js +19 -0
- package/dist/esm/icons/unstable-chevron-right-fill.js.map +1 -0
- package/dist/esm/icons/unstable-close.d.ts +8 -0
- package/dist/esm/icons/unstable-close.d.ts.map +1 -0
- package/dist/esm/icons/unstable-close.js +19 -0
- package/dist/esm/icons/unstable-close.js.map +1 -0
- package/dist/esm/icons/unstable-info-circle.d.ts +8 -0
- package/dist/esm/icons/unstable-info-circle.d.ts.map +1 -0
- package/dist/esm/icons/unstable-info-circle.js +19 -0
- package/dist/esm/icons/unstable-info-circle.js.map +1 -0
- package/dist/esm/icons/unstable-placeholder.d.ts +8 -0
- package/dist/esm/icons/unstable-placeholder.d.ts.map +1 -0
- package/dist/esm/icons/unstable-placeholder.js +19 -0
- package/dist/esm/icons/unstable-placeholder.js.map +1 -0
- package/dist/esm/icons/warning-circle-fill.d.ts +1 -1
- package/dist/esm/icons/warning-circle-fill.d.ts.map +1 -1
- package/dist/esm/icons/warning-circle-fill.js +4 -2
- package/dist/esm/icons/warning-circle-fill.js.map +1 -1
- package/dist/esm/index.d.ts +21 -1
- package/dist/esm/index.d.ts.map +1 -1
- package/dist/esm/index.js +19 -0
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/utils/style/tone.d.ts +3 -0
- package/dist/esm/utils/style/tone.d.ts.map +1 -0
- package/dist/esm/utils/style/tone.js +4 -0
- package/dist/esm/utils/style/tone.js.map +1 -0
- package/dist/esm/utils/style/types.d.ts +2 -0
- package/dist/esm/utils/style/types.d.ts.map +1 -0
- package/dist/esm/utils/style/types.js +2 -0
- package/dist/esm/utils/style/types.js.map +1 -0
- package/dist/esm/with-style-props.d.ts +1 -1
- package/dist/esm/with-style-props.d.ts.map +1 -1
- package/dist/esm/with-style-props.js.map +1 -1
- package/dist-styles/styles.css +1 -1
- package/package.json +5 -2
package/README.md
CHANGED
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import type { AriaLabelingProps, CollectionItem, CollectionProps, CommonProps, Key, NavigationProps, StringLikeChildren, WithRequired } from '../types.js';
|
|
2
|
+
export interface BreadcrumbsProps<T extends CollectionItem = CollectionItem> extends CommonProps, CollectionProps<T>, AriaLabelingProps {
|
|
3
|
+
}
|
|
4
|
+
export interface BreadcrumbItemProps extends Omit<CommonProps, 'id'>, WithRequired<NavigationProps, 'href'> {
|
|
5
|
+
/** The text to display as the breadcrumb. */
|
|
6
|
+
children: StringLikeChildren;
|
|
7
|
+
/** The ID of the item. Has to be unique across all items. */
|
|
8
|
+
id?: Key;
|
|
9
|
+
}
|
|
10
|
+
/** Renders a single breadcrumb within `Breadcrumbs`. */
|
|
11
|
+
export declare function BreadcrumbItem({ children, UNSAFE_className, UNSAFE_style, href, hrefLang, download, ping, referrerPolicy, rel, routerOptions, target, ...props }: BreadcrumbItemProps): import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
export declare namespace BreadcrumbItem {
|
|
13
|
+
var displayName: string;
|
|
14
|
+
}
|
|
15
|
+
/**
|
|
16
|
+
* Displays a list of breadcrumbs to help users navigate through a website.
|
|
17
|
+
*
|
|
18
|
+
* See [breadcrumbs usage guidelines](https://ui.cimpress.io/components/breadcrumbs/).
|
|
19
|
+
*/
|
|
20
|
+
declare const _Breadcrumbs: <T extends CollectionItem = CollectionItem>(props: BreadcrumbsProps<T> & import("react").RefAttributes<HTMLElement> & import("../../with-style-props.js").StyleProps) => import("react").JSX.Element | null;
|
|
21
|
+
export { _Breadcrumbs as Breadcrumbs };
|
|
22
|
+
//# sourceMappingURL=breadcrumbs.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"breadcrumbs.d.ts","sourceRoot":"","sources":["../../../../src/components/breadcrumbs/breadcrumbs.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EACV,iBAAiB,EACjB,cAAc,EACd,eAAe,EACf,WAAW,EACX,GAAG,EACH,eAAe,EACf,kBAAkB,EAClB,YAAY,EACb,MAAM,aAAa,CAAC;AAGrB,MAAM,WAAW,gBAAgB,CAAC,CAAC,SAAS,cAAc,GAAG,cAAc,CACzE,SAAQ,WAAW,EACjB,eAAe,CAAC,CAAC,CAAC,EAClB,iBAAiB;CAAG;AA0CxB,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,EAAE,YAAY,CAAC,eAAe,EAAE,MAAM,CAAC;IACzG,6CAA6C;IAC7C,QAAQ,EAAE,kBAAkB,CAAC;IAC7B,6DAA6D;IAC7D,EAAE,CAAC,EAAE,GAAG,CAAC;CACV;AAED,wDAAwD;AACxD,wBAAgB,cAAc,CAAC,EAC7B,QAAQ,EACR,gBAAgB,EAChB,YAAY,EAGZ,IAAI,EACJ,QAAQ,EACR,QAAQ,EACR,IAAI,EACJ,cAAc,EACd,GAAG,EACH,aAAa,EACb,MAAM,EAEN,GAAG,KAAK,EACT,EAAE,mBAAmB,2CAmBrB;yBAnCe,cAAc;;;AAuC9B;;;;GAIG;AACH,QAAA,MAAM,YAAY,GA5FG,CAAC,SAAS,cAAc,kLA4F8B,CAAC;AAE5E,OAAO,EAAE,YAAY,IAAI,WAAW,EAAE,CAAC"}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
"use strict";
|
|
3
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
4
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
5
|
+
};
|
|
6
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
7
|
+
exports.Breadcrumbs = void 0;
|
|
8
|
+
exports.BreadcrumbItem = BreadcrumbItem;
|
|
9
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
10
|
+
const utils_1 = require("@react-aria/utils");
|
|
11
|
+
const clsx_1 = __importDefault(require("clsx"));
|
|
12
|
+
const react_aria_components_1 = require("react-aria-components");
|
|
13
|
+
const forward_ref_js_1 = require("../../forward-ref.js");
|
|
14
|
+
const index_js_1 = require("../../icons/index.js");
|
|
15
|
+
const with_style_props_js_1 = require("../../with-style-props.js");
|
|
16
|
+
const link_js_1 = require("../typography/link.js");
|
|
17
|
+
function Breadcrumbs({ children, items, UNSAFE_className, UNSAFE_style,
|
|
18
|
+
// Aria labeling props
|
|
19
|
+
'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledby, 'aria-describedby': ariaDescribedby, 'aria-details': ariaDetails, ...props }, ref) {
|
|
20
|
+
const breadcrumbsId = (0, utils_1.useId)();
|
|
21
|
+
return ((0, jsx_runtime_1.jsx)("nav", { ...props, ref: ref, "aria-labelledby": ariaLabelledby ?? breadcrumbsId, "aria-describedby": ariaDescribedby, "aria-details": ariaDetails, children: (0, jsx_runtime_1.jsx)(react_aria_components_1.Breadcrumbs, { id: breadcrumbsId, items: items, className: (0, clsx_1.default)('cim-breadcrumbs', UNSAFE_className), style: UNSAFE_style, "aria-label": ariaLabel, children: children }) }));
|
|
22
|
+
}
|
|
23
|
+
/** Renders a single breadcrumb within `Breadcrumbs`. */
|
|
24
|
+
function BreadcrumbItem({ children, UNSAFE_className, UNSAFE_style,
|
|
25
|
+
// Navigation props
|
|
26
|
+
href, hrefLang, download, ping, referrerPolicy, rel, routerOptions, target, ...props }) {
|
|
27
|
+
return ((0, jsx_runtime_1.jsxs)(react_aria_components_1.Breadcrumb, { ...props, className: (0, clsx_1.default)('cim-breadcrumb-item', UNSAFE_className), style: UNSAFE_style, children: [(0, jsx_runtime_1.jsx)(link_js_1.Link, { variant: "body", href: href, hrefLang: hrefLang, download: download, ping: ping, referrerPolicy: referrerPolicy, rel: rel, routerOptions: routerOptions, target: target, children: children }), (0, jsx_runtime_1.jsx)(index_js_1.UNSTABLE_IconChevronRightFill, { size: 16 })] }));
|
|
28
|
+
}
|
|
29
|
+
BreadcrumbItem.displayName = 'BreadcrumbItem';
|
|
30
|
+
/**
|
|
31
|
+
* Displays a list of breadcrumbs to help users navigate through a website.
|
|
32
|
+
*
|
|
33
|
+
* See [breadcrumbs usage guidelines](https://ui.cimpress.io/components/breadcrumbs/).
|
|
34
|
+
*/
|
|
35
|
+
const _Breadcrumbs = (0, with_style_props_js_1.withStyleProps)((0, forward_ref_js_1.forwardRef)(Breadcrumbs), 'Breadcrumbs');
|
|
36
|
+
exports.Breadcrumbs = _Breadcrumbs;
|
|
37
|
+
//# sourceMappingURL=breadcrumbs.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"breadcrumbs.js","sourceRoot":"","sources":["../../../../src/components/breadcrumbs/breadcrumbs.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;;AA0Eb,wCAmCC;;AA3GD,6CAA0C;AAC1C,gDAAwB;AAExB,iEAAmG;AACnG,yDAAkD;AAClD,mDAAqE;AACrE,mEAA2D;AAW3D,mDAA6C;AAO7C,SAAS,WAAW,CAClB,EACE,QAAQ,EACR,KAAK,EACL,gBAAgB,EAChB,YAAY;AAEZ,sBAAsB;AACtB,YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,cAAc,EACjC,kBAAkB,EAAE,eAAe,EACnC,cAAc,EAAE,WAAW,EAC3B,GAAG,KAAK,EACY,EACtB,GAA8B;IAE9B,MAAM,aAAa,GAAG,IAAA,aAAK,GAAE,CAAC;IAE9B,OAAO,CACL,mCACM,KAAK,EACT,GAAG,EAAE,GAAG,qBAES,cAAc,IAAI,aAAa,sBAC9B,eAAe,kBACnB,WAAW,YAEzB,uBAAC,mCAAc,IACb,EAAE,EAAE,aAAa,EACjB,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,IAAA,cAAI,EAAC,iBAAiB,EAAE,gBAAgB,CAAC,EACpD,KAAK,EAAE,YAAY,gBACP,SAAS,YAEpB,QAAQ,GACM,GACb,CACP,CAAC;AACJ,CAAC;AASD,wDAAwD;AACxD,SAAgB,cAAc,CAAC,EAC7B,QAAQ,EACR,gBAAgB,EAChB,YAAY;AAEZ,mBAAmB;AACnB,IAAI,EACJ,QAAQ,EACR,QAAQ,EACR,IAAI,EACJ,cAAc,EACd,GAAG,EACH,aAAa,EACb,MAAM,EAEN,GAAG,KAAK,EACY;IACpB,OAAO,CACL,wBAAC,kCAAa,OAAK,KAAK,EAAE,SAAS,EAAE,IAAA,cAAI,EAAC,qBAAqB,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,YAAY,aACrG,uBAAC,cAAI,IACH,OAAO,EAAC,MAAM,EACd,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,cAAc,EAAE,cAAc,EAC9B,GAAG,EAAE,GAAG,EACR,aAAa,EAAE,aAAa,EAC5B,MAAM,EAAE,MAAM,YAEb,QAAQ,GACJ,EACP,uBAAC,wCAA6B,IAAC,IAAI,EAAE,EAAE,GAAI,IAC7B,CACjB,CAAC;AACJ,CAAC;AAED,cAAc,CAAC,WAAW,GAAG,gBAAgB,CAAC;AAE9C;;;;GAIG;AACH,MAAM,YAAY,GAAG,IAAA,oCAAc,EAAC,IAAA,2BAAU,EAAC,WAAW,CAAC,EAAE,aAAa,CAAC,CAAC;AAEnD,mCAAW","sourcesContent":["'use client';\n\nimport { useId } from '@react-aria/utils';\nimport clsx from 'clsx';\nimport type { ForwardedRef } from 'react';\nimport { Breadcrumbs as RACBreadcrumbs, Breadcrumb as RACBreadcrumb } from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { UNSTABLE_IconChevronRightFill } from '../../icons/index.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport type {\n AriaLabelingProps,\n CollectionItem,\n CollectionProps,\n CommonProps,\n Key,\n NavigationProps,\n StringLikeChildren,\n WithRequired,\n} from '../types.js';\nimport { Link } from '../typography/link.js';\n\nexport interface BreadcrumbsProps<T extends CollectionItem = CollectionItem>\n extends CommonProps,\n CollectionProps<T>,\n AriaLabelingProps {}\n\nfunction Breadcrumbs<T extends CollectionItem = CollectionItem>(\n {\n children,\n items,\n UNSAFE_className,\n UNSAFE_style,\n\n // Aria labeling props\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n 'aria-describedby': ariaDescribedby,\n 'aria-details': ariaDetails,\n ...props\n }: BreadcrumbsProps<T>,\n ref: ForwardedRef<HTMLElement>,\n) {\n const breadcrumbsId = useId();\n\n return (\n <nav\n {...props}\n ref={ref}\n // RAC puts a localized `aria-label` on `Breadcrumbs`, so we refer to it unless a custom label is provided\n aria-labelledby={ariaLabelledby ?? breadcrumbsId}\n aria-describedby={ariaDescribedby}\n aria-details={ariaDetails}\n >\n <RACBreadcrumbs\n id={breadcrumbsId}\n items={items}\n className={clsx('cim-breadcrumbs', UNSAFE_className)}\n style={UNSAFE_style}\n aria-label={ariaLabel}\n >\n {children}\n </RACBreadcrumbs>\n </nav>\n );\n}\n\nexport interface BreadcrumbItemProps extends Omit<CommonProps, 'id'>, WithRequired<NavigationProps, 'href'> {\n /** The text to display as the breadcrumb. */\n children: StringLikeChildren;\n /** The ID of the item. Has to be unique across all items. */\n id?: Key;\n}\n\n/** Renders a single breadcrumb within `Breadcrumbs`. */\nexport function BreadcrumbItem({\n children,\n UNSAFE_className,\n UNSAFE_style,\n\n // Navigation props\n href,\n hrefLang,\n download,\n ping,\n referrerPolicy,\n rel,\n routerOptions,\n target,\n\n ...props\n}: BreadcrumbItemProps) {\n return (\n <RACBreadcrumb {...props} className={clsx('cim-breadcrumb-item', UNSAFE_className)} style={UNSAFE_style}>\n <Link\n variant=\"body\"\n href={href}\n hrefLang={hrefLang}\n download={download}\n ping={ping}\n referrerPolicy={referrerPolicy}\n rel={rel}\n routerOptions={routerOptions}\n target={target}\n >\n {children}\n </Link>\n <UNSTABLE_IconChevronRightFill size={16} />\n </RACBreadcrumb>\n );\n}\n\nBreadcrumbItem.displayName = 'BreadcrumbItem';\n\n/**\n * Displays a list of breadcrumbs to help users navigate through a website.\n *\n * See [breadcrumbs usage guidelines](https://ui.cimpress.io/components/breadcrumbs/).\n */\nconst _Breadcrumbs = withStyleProps(forwardRef(Breadcrumbs), 'Breadcrumbs');\n\nexport { _Breadcrumbs as Breadcrumbs };\n"]}
|
|
@@ -13,7 +13,7 @@ const forward_ref_js_1 = require("../../forward-ref.js");
|
|
|
13
13
|
const with_style_props_js_1 = require("../../with-style-props.js");
|
|
14
14
|
const spinner_js_1 = require("../internal/spinner/spinner.js");
|
|
15
15
|
const constants_js_1 = require("./constants.js");
|
|
16
|
-
function Button({ children, variant = 'secondary', tone = 'base', size = 'medium', iconStart, iconEnd, isLoading
|
|
16
|
+
function Button({ children, variant = 'secondary', tone = 'base', size = 'medium', iconStart, iconEnd, isLoading, loadingLabel, isDisabled, fullWidth, UNSAFE_className, UNSAFE_style, ...props }, ref) {
|
|
17
17
|
(0, react_1.useEffect)(() => {
|
|
18
18
|
if (isLoading && !loadingLabel) {
|
|
19
19
|
console.warn('Button requires loadingLabel when isLoading is true for accessibility');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../../src/components/button/button.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;;;AAEb,gDAAwB;AACxB,iCAAqD;AACrD,iEAA4D;AAC5D,yDAAkD;AAClD,mEAA2D;AAC3D,+DAAiE;AACjE,iDAA+C;AAK/C,SAAS,MAAM,CACb,EACE,QAAQ,EACR,OAAO,GAAG,WAAW,EACrB,IAAI,GAAG,MAAM,EACb,IAAI,GAAG,QAAQ,EACf,SAAS,EACT,OAAO,EACP,SAAS,
|
|
1
|
+
{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../../src/components/button/button.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;;;AAEb,gDAAwB;AACxB,iCAAqD;AACrD,iEAA4D;AAC5D,yDAAkD;AAClD,mEAA2D;AAC3D,+DAAiE;AACjE,iDAA+C;AAK/C,SAAS,MAAM,CACb,EACE,QAAQ,EACR,OAAO,GAAG,WAAW,EACrB,IAAI,GAAG,MAAM,EACb,IAAI,GAAG,QAAQ,EACf,SAAS,EACT,OAAO,EACP,SAAS,EACT,YAAY,EACZ,UAAU,EACV,SAAS,EACT,gBAAgB,EAChB,YAAY,EACZ,GAAG,KAAK,EACI,EACd,GAAoC;IAEpC,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,SAAS,IAAI,CAAC,YAAY,EAAE,CAAC;YAC/B,OAAO,CAAC,IAAI,CAAC,uEAAuE,CAAC,CAAC;QACxF,CAAC;IACH,CAAC,EAAE,CAAC,SAAS,EAAE,YAAY,CAAC,CAAC,CAAC;IAE9B,OAAO,CACL,uBAAC,8BAAS,OACJ,KAAK,EACT,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,cAAI,EAAC,YAAY,EAAE,gBAAgB,CAAC,EAC/C,KAAK,EAAE,YAAY,kBACL,OAAO,eACV,IAAI,eACJ,IAAI,qBACE,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,EAC7C,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,SAAS,YAEnB,CAAC,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC,CAClB,6DACG,SAAS,EACV,2CAAO,QAAQ,GAAQ,EACtB,OAAO,EACP,SAAS,IAAI,uBAAC,4BAAe,IAAC,IAAI,EAAE,4BAAa,CAAC,IAAI,CAAC,gBAAc,YAAY,GAAI,IACrF,CACJ,GACS,CACb,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,OAAO,GAAG,IAAA,oCAAc,EAAC,IAAA,2BAAU,EAAC,MAAM,CAAC,EAAE,QAAQ,CAAC,CAAC;AAEzC,yBAAM","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { useEffect, type ForwardedRef } from 'react';\nimport { Button as RACButton } from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { InternalSpinner } from '../internal/spinner/spinner.js';\nimport { SPINNER_SIZES } from './constants.js';\nimport type { ActionButtonProps, BaseButtonProps, TextButtonProps } from './types.js';\n\nexport interface ButtonProps extends BaseButtonProps, TextButtonProps, ActionButtonProps {}\n\nfunction Button(\n {\n children,\n variant = 'secondary',\n tone = 'base',\n size = 'medium',\n iconStart,\n iconEnd,\n isLoading,\n loadingLabel,\n isDisabled,\n fullWidth,\n UNSAFE_className,\n UNSAFE_style,\n ...props\n }: ButtonProps,\n ref: ForwardedRef<HTMLButtonElement>,\n) {\n useEffect(() => {\n if (isLoading && !loadingLabel) {\n console.warn('Button requires loadingLabel when isLoading is true for accessibility');\n }\n }, [isLoading, loadingLabel]);\n\n return (\n <RACButton\n {...props}\n ref={ref}\n className={clsx('cim-button', UNSAFE_className)}\n style={UNSAFE_style}\n data-variant={variant}\n data-tone={tone}\n data-size={size}\n data-full-width={fullWidth ? true : undefined}\n isDisabled={isDisabled}\n isPending={isLoading}\n >\n {({ isPending }) => (\n <>\n {iconStart}\n <span>{children}</span>\n {iconEnd}\n {isPending && <InternalSpinner size={SPINNER_SIZES[size]} aria-label={loadingLabel} />}\n </>\n )}\n </RACButton>\n );\n}\n\n/**\n * Displays a labelled button that allows users to perform an action.\n *\n * See [button usage guidelines](https://ui.cimpress.io/components/button/).\n */\nconst _Button = withStyleProps(forwardRef(Button), 'Button');\n\nexport { _Button as Button };\n"]}
|
|
@@ -13,7 +13,7 @@ const forward_ref_js_1 = require("../../forward-ref.js");
|
|
|
13
13
|
const with_style_props_js_1 = require("../../with-style-props.js");
|
|
14
14
|
const spinner_js_1 = require("../internal/spinner/spinner.js");
|
|
15
15
|
const constants_js_1 = require("./constants.js");
|
|
16
|
-
function IconButton({ icon, variant = 'secondary', tone = 'base', size = 'medium', isLoading
|
|
16
|
+
function IconButton({ icon, variant = 'secondary', tone = 'base', size = 'medium', isLoading, loadingLabel, isDisabled, fullWidth, UNSAFE_className, UNSAFE_style, ...props }, ref) {
|
|
17
17
|
(0, react_1.useEffect)(() => {
|
|
18
18
|
if (isLoading && !loadingLabel) {
|
|
19
19
|
console.warn('IconButton requires loadingLabel when isLoading is true for accessibility');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon-button.js","sourceRoot":"","sources":["../../../../src/components/button/icon-button.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;;;AAEb,gDAAwB;AACxB,iCAAqD;AACrD,iEAA4D;AAC5D,yDAAkD;AAClD,mEAA2D;AAC3D,+DAAiE;AACjE,iDAA+C;AAK/C,SAAS,UAAU,CACjB,EACE,IAAI,EACJ,OAAO,GAAG,WAAW,EACrB,IAAI,GAAG,MAAM,EACb,IAAI,GAAG,QAAQ,EACf,SAAS,
|
|
1
|
+
{"version":3,"file":"icon-button.js","sourceRoot":"","sources":["../../../../src/components/button/icon-button.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;;;AAEb,gDAAwB;AACxB,iCAAqD;AACrD,iEAA4D;AAC5D,yDAAkD;AAClD,mEAA2D;AAC3D,+DAAiE;AACjE,iDAA+C;AAK/C,SAAS,UAAU,CACjB,EACE,IAAI,EACJ,OAAO,GAAG,WAAW,EACrB,IAAI,GAAG,MAAM,EACb,IAAI,GAAG,QAAQ,EACf,SAAS,EACT,YAAY,EACZ,UAAU,EACV,SAAS,EACT,gBAAgB,EAChB,YAAY,EACZ,GAAG,KAAK,EACQ,EAClB,GAAoC;IAEpC,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,SAAS,IAAI,CAAC,YAAY,EAAE,CAAC;YAC/B,OAAO,CAAC,IAAI,CAAC,2EAA2E,CAAC,CAAC;QAC5F,CAAC;IACH,CAAC,EAAE,CAAC,SAAS,EAAE,YAAY,CAAC,CAAC,CAAC;IAE9B,OAAO,CACL,uBAAC,8BAAS,OACJ,KAAK,EACT,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,cAAI,EAAC,iBAAiB,EAAE,gBAAgB,CAAC,EACpD,KAAK,EAAE,YAAY,kBACL,OAAO,eACV,IAAI,eACJ,IAAI,qBACE,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,EAC7C,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,SAAS,YAEnB,CAAC,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC,CAClB,6DACG,IAAI,EACJ,SAAS,IAAI,uBAAC,4BAAe,IAAC,IAAI,EAAE,4BAAa,CAAC,IAAI,CAAC,gBAAc,YAAY,GAAI,IACrF,CACJ,GACS,CACb,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,WAAW,GAAG,IAAA,oCAAc,EAAC,IAAA,2BAAU,EAAC,UAAU,CAAC,EAAE,YAAY,CAAC,CAAC;AAEjD,iCAAU","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { useEffect, type ForwardedRef } from 'react';\nimport { Button as RACButton } from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { InternalSpinner } from '../internal/spinner/spinner.js';\nimport { SPINNER_SIZES } from './constants.js';\nimport type { ActionButtonProps, BaseButtonProps, SingleIconButtonProps } from './types.js';\n\nexport interface IconButtonProps extends BaseButtonProps, SingleIconButtonProps, ActionButtonProps {}\n\nfunction IconButton(\n {\n icon,\n variant = 'secondary',\n tone = 'base',\n size = 'medium',\n isLoading,\n loadingLabel,\n isDisabled,\n fullWidth,\n UNSAFE_className,\n UNSAFE_style,\n ...props\n }: IconButtonProps,\n ref: ForwardedRef<HTMLButtonElement>,\n) {\n useEffect(() => {\n if (isLoading && !loadingLabel) {\n console.warn('IconButton requires loadingLabel when isLoading is true for accessibility');\n }\n }, [isLoading, loadingLabel]);\n\n return (\n <RACButton\n {...props}\n ref={ref}\n className={clsx('cim-icon-button', UNSAFE_className)}\n style={UNSAFE_style}\n data-variant={variant}\n data-tone={tone}\n data-size={size}\n data-full-width={fullWidth ? true : undefined}\n isDisabled={isDisabled}\n isPending={isLoading}\n >\n {({ isPending }) => (\n <>\n {icon}\n {isPending && <InternalSpinner size={SPINNER_SIZES[size]} aria-label={loadingLabel} />}\n </>\n )}\n </RACButton>\n );\n}\n\n/**\n * Displays an icon-only button that allows users to perform an action.\n *\n * See [button usage guidelines](https://ui.cimpress.io/components/button/).\n */\nconst _IconButton = withStyleProps(forwardRef(IconButton), 'IconButton');\n\nexport { _IconButton as IconButton };\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/button/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,WAAW,IAAI,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAC3E,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAEpF;;GAEG;AACH,MAAM,WAAW,eAAgB,SAAQ,WAAW;IAClD;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;IAC/C;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IAC3B;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;GAEG;AACH,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,eAAe,EAAE,OAAO,CAAC;IACrE,wCAAwC;IACxC,QAAQ,EAAE,kBAAkB,CAAC;IAC7B,gDAAgD;IAChD,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,+CAA+C;IAC/C,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB;AAED;;GAEG;AACH,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CAAC,eAAe,EAAE,OAAO,GAAG,YAAY,CAAC;IAC1F,wCAAwC;IACxC,IAAI,EAAE,SAAS,CAAC;IAChB,mFAAmF;IACnF,YAAY,EAAE,MAAM,CAAC;CACtB;AAED;;GAEG;AACH,MAAM,WAAW,iBACf,SAAQ,IAAI,CACV,cAAc,EACd,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,GAAG,YAAY,GAAG,cAAc,GAAG,YAAY,CAC9F;IACD;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/button/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,WAAW,IAAI,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAC3E,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAEpF;;GAEG;AACH,MAAM,WAAW,eAAgB,SAAQ,WAAW;IAClD;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;IAC/C;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IAC3B;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;GAEG;AACH,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,eAAe,EAAE,OAAO,CAAC;IACrE,wCAAwC;IACxC,QAAQ,EAAE,kBAAkB,CAAC;IAC7B,gDAAgD;IAChD,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,+CAA+C;IAC/C,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB;AAED;;GAEG;AACH,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CAAC,eAAe,EAAE,OAAO,GAAG,YAAY,CAAC;IAC1F,wCAAwC;IACxC,IAAI,EAAE,SAAS,CAAC;IAChB,mFAAmF;IACnF,YAAY,EAAE,MAAM,CAAC;CACtB;AAED;;GAEG;AACH,MAAM,WAAW,iBACf,SAAQ,IAAI,CACV,cAAc,EACd,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,GAAG,YAAY,GAAG,cAAc,GAAG,YAAY,CAC9F;IACD;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CAQvB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/components/button/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ReactNode } from 'react';\nimport type { ButtonProps as RACButtonProps } from 'react-aria-components';\nimport type { CommonProps, LabellableProps, StringLikeChildren } from '../types.js';\n\n/**\n * Props available on all buttons.\n */\nexport interface BaseButtonProps extends CommonProps {\n /**\n * Determines the visual appearance of the button.\n * @default 'secondary'\n */\n variant?: 'primary' | 'secondary' | 'tertiary';\n /**\n * Determines the color tone of the button.\n * @default 'base'\n */\n tone?: 'base' | 'critical';\n /**\n * The size of the button.\n * @default 'medium'\n */\n size?: 'small' | 'medium' | 'large';\n /**\n * Whether the button should take up the whole available width.\n *\n * @default false\n */\n fullWidth?: boolean;\n}\n\n/**\n * Props available on buttons containing text.\n */\nexport interface TextButtonProps extends Omit<LabellableProps, 'label'> {\n /** The text displayed on the button. */\n children: StringLikeChildren;\n /** An icon displayed before the button text. */\n iconStart?: ReactNode;\n /** An icon displayed after the button text. */\n iconEnd?: ReactNode;\n}\n\n/**\n * Props available on buttons containing a single icon.\n */\nexport interface SingleIconButtonProps extends Omit<LabellableProps, 'label' | 'aria-label'> {\n /** The icon displayed on the button. */\n icon: ReactNode;\n /** The label describing the function of this button for assistive technologies. */\n 'aria-label': string;\n}\n\n/**\n * Props available on buttons that perform an action (non-navigational).\n */\nexport interface ActionButtonProps\n extends Pick<\n RACButtonProps,\n 'form' | 'name' | 'value' | 'onPress' | 'type' | 'isDisabled' | 'onHoverStart' | 'onHoverEnd'\n > {\n /**\n * Whether the button is in a loading state.\n * This disables the button and replaces its contents with a spinner.\n *\n * @default false\n */\n isLoading?: boolean;\n /**\n * A string that identifies the loading state to assistive technologies.\n * It will be announced by screen readers together with the button label.\n * You must provide this prop if `isLoading` is `true`.\n */\n loadingLabel?: string;\n}\n"]}
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/components/button/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ReactNode } from 'react';\nimport type { ButtonProps as RACButtonProps } from 'react-aria-components';\nimport type { CommonProps, LabellableProps, StringLikeChildren } from '../types.js';\n\n/**\n * Props available on all buttons.\n */\nexport interface BaseButtonProps extends CommonProps {\n /**\n * Determines the visual appearance of the button.\n * @default 'secondary'\n */\n variant?: 'primary' | 'secondary' | 'tertiary';\n /**\n * Determines the color tone of the button.\n * @default 'base'\n */\n tone?: 'base' | 'critical';\n /**\n * The size of the button.\n * @default 'medium'\n */\n size?: 'small' | 'medium' | 'large';\n /**\n * Whether the button should take up the whole available width.\n *\n * @default false\n */\n fullWidth?: boolean;\n}\n\n/**\n * Props available on buttons containing text.\n */\nexport interface TextButtonProps extends Omit<LabellableProps, 'label'> {\n /** The text displayed on the button. */\n children: StringLikeChildren;\n /** An icon displayed before the button text. */\n iconStart?: ReactNode;\n /** An icon displayed after the button text. */\n iconEnd?: ReactNode;\n}\n\n/**\n * Props available on buttons containing a single icon.\n */\nexport interface SingleIconButtonProps extends Omit<LabellableProps, 'label' | 'aria-label'> {\n /** The icon displayed on the button. */\n icon: ReactNode;\n /** The label describing the function of this button for assistive technologies. */\n 'aria-label': string;\n}\n\n/**\n * Props available on buttons that perform an action (non-navigational).\n */\nexport interface ActionButtonProps\n extends Pick<\n RACButtonProps,\n 'form' | 'name' | 'value' | 'onPress' | 'type' | 'isDisabled' | 'onHoverStart' | 'onHoverEnd'\n > {\n /**\n * Whether the button is in a loading state.\n * This disables the button and replaces its contents with a spinner.\n *\n * @default false\n */\n isLoading?: boolean;\n /**\n * A string that identifies the loading state to assistive technologies.\n * It will be announced by screen readers together with the button label.\n * You must provide this prop if `isLoading` is `true`.\n */\n loadingLabel?: string;\n /**\n * A slot name for the component. Slots allow the component to receive props from a parent component.\n * An explicit null value indicates that the local props completely override all props received from a parent.\n *\n * @internal\n */\n slot?: string;\n}\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"card-context.d.ts","sourceRoot":"","sources":["../../../../src/components/card/card-context.tsx"],"names":[],"mappings":"AAEA,eAAO,MAAM,WAAW;;EAAuC,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"card-context.js","sourceRoot":"","sources":["../../../../src/components/card/card-context.tsx"],"names":[],"mappings":";;;AAAA,iCAAsC;AAEzB,QAAA,WAAW,GAAG,IAAA,qBAAa,EAAC,EAAE,UAAU,EAAE,KAAK,EAAE,CAAC,CAAC","sourcesContent":["import { createContext } from 'react';\n\nexport const CardContext = createContext({ withBorder: false });\n"]}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { type ReactNode } from 'react';
|
|
2
|
+
import type { CommonProps } from '../types.js';
|
|
3
|
+
export interface UNSTABLE_CardProps extends CommonProps {
|
|
4
|
+
children: ReactNode;
|
|
5
|
+
withBorder?: boolean;
|
|
6
|
+
}
|
|
7
|
+
export interface UNSTABLE_CardSectionProps extends CommonProps {
|
|
8
|
+
children: ReactNode;
|
|
9
|
+
bleed?: boolean;
|
|
10
|
+
withBorder?: boolean;
|
|
11
|
+
}
|
|
12
|
+
declare const _UNSTABLE_Card: (props: UNSTABLE_CardProps & import("react").RefAttributes<HTMLDivElement> & import("../../with-style-props.js").StyleProps) => import("react").JSX.Element | null;
|
|
13
|
+
declare const _UNSTABLE_CardSection: (props: UNSTABLE_CardSectionProps & import("react").RefAttributes<HTMLDivElement> & import("../../with-style-props.js").StyleProps) => import("react").JSX.Element | null;
|
|
14
|
+
export { _UNSTABLE_Card as UNSTABLE_Card, _UNSTABLE_CardSection as UNSTABLE_CardSection };
|
|
15
|
+
//# sourceMappingURL=card.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../../../src/components/card/card.tsx"],"names":[],"mappings":"AACA,OAAO,EAAiC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGtE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAG/C,MAAM,WAAW,kBAAmB,SAAQ,WAAW;IACrD,QAAQ,EAAE,SAAS,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAeD,MAAM,WAAW,yBAA0B,SAAQ,WAAW;IAC5D,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAyBD,QAAA,MAAM,cAAc,oKAAoD,CAAC;AACzE,QAAA,MAAM,qBAAqB,2KAAkE,CAAC;AAE9F,OAAO,EAAE,cAAc,IAAI,aAAa,EAAE,qBAAqB,IAAI,oBAAoB,EAAE,CAAC"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.UNSTABLE_CardSection = exports.UNSTABLE_Card = void 0;
|
|
7
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
8
|
+
const clsx_1 = __importDefault(require("clsx"));
|
|
9
|
+
const react_1 = require("react");
|
|
10
|
+
const forward_ref_js_1 = require("../../forward-ref.js");
|
|
11
|
+
const with_style_props_js_1 = require("../../with-style-props.js");
|
|
12
|
+
const card_context_js_1 = require("./card-context.js");
|
|
13
|
+
function UNSTABLE_Card({ children, UNSAFE_className, UNSAFE_style, withBorder = false, ...props }, ref) {
|
|
14
|
+
return ((0, jsx_runtime_1.jsx)(card_context_js_1.CardContext.Provider, { value: { withBorder }, children: (0, jsx_runtime_1.jsx)("div", { ...props, className: (0, clsx_1.default)('cim-card', UNSAFE_className), style: UNSAFE_style, ref: ref, children: children }) }));
|
|
15
|
+
}
|
|
16
|
+
function UNSTABLE_CardSection({ children, UNSAFE_className, UNSAFE_style, bleed, withBorder, ...props }, ref) {
|
|
17
|
+
const { withBorder: contextWithBorder } = (0, react_1.useContext)(card_context_js_1.CardContext);
|
|
18
|
+
return ((0, jsx_runtime_1.jsx)("div", { ...props, className: (0, clsx_1.default)('cim-card-section', bleed && 'cim-card-section-bleed', (withBorder || contextWithBorder) && 'cim-card-section-with-border', UNSAFE_className), style: UNSAFE_style, ref: ref, children: children }));
|
|
19
|
+
}
|
|
20
|
+
const _UNSTABLE_Card = (0, with_style_props_js_1.withStyleProps)((0, forward_ref_js_1.forwardRef)(UNSTABLE_Card), 'Card');
|
|
21
|
+
exports.UNSTABLE_Card = _UNSTABLE_Card;
|
|
22
|
+
const _UNSTABLE_CardSection = (0, with_style_props_js_1.withStyleProps)((0, forward_ref_js_1.forwardRef)(UNSTABLE_CardSection), 'CardSection');
|
|
23
|
+
exports.UNSTABLE_CardSection = _UNSTABLE_CardSection;
|
|
24
|
+
//# sourceMappingURL=card.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"card.js","sourceRoot":"","sources":["../../../../src/components/card/card.tsx"],"names":[],"mappings":";;;;;;;AAAA,gDAAwB;AACxB,iCAAsE;AACtE,yDAAkD;AAClD,mEAA2D;AAE3D,uDAAgD;AAOhD,SAAS,aAAa,CACpB,EAAE,QAAQ,EAAE,gBAAgB,EAAE,YAAY,EAAE,UAAU,GAAG,KAAK,EAAE,GAAG,KAAK,EAAsB,EAC9F,GAAiC;IAEjC,OAAO,CACL,uBAAC,6BAAW,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,UAAU,EAAE,YACzC,mCAAS,KAAK,EAAE,SAAS,EAAE,IAAA,cAAI,EAAC,UAAU,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,GAAG,EAAE,GAAG,YACzF,QAAQ,GACL,GACe,CACxB,CAAC;AACJ,CAAC;AAQD,SAAS,oBAAoB,CAC3B,EAAE,QAAQ,EAAE,gBAAgB,EAAE,YAAY,EAAE,KAAK,EAAE,UAAU,EAAE,GAAG,KAAK,EAA6B,EACpG,GAAiC;IAEjC,MAAM,EAAE,UAAU,EAAE,iBAAiB,EAAE,GAAG,IAAA,kBAAU,EAAC,6BAAW,CAAC,CAAC;IAElE,OAAO,CACL,mCACM,KAAK,EACT,SAAS,EAAE,IAAA,cAAI,EACb,kBAAkB,EAClB,KAAK,IAAI,wBAAwB,EACjC,CAAC,UAAU,IAAI,iBAAiB,CAAC,IAAI,8BAA8B,EACnE,gBAAgB,CACjB,EACD,KAAK,EAAE,YAAY,EACnB,GAAG,EAAE,GAAG,YAEP,QAAQ,GACL,CACP,CAAC;AACJ,CAAC;AAED,MAAM,cAAc,GAAG,IAAA,oCAAc,EAAC,IAAA,2BAAU,EAAC,aAAa,CAAC,EAAE,MAAM,CAAC,CAAC;AAG9C,uCAAa;AAFxC,MAAM,qBAAqB,GAAG,IAAA,oCAAc,EAAC,IAAA,2BAAU,EAAC,oBAAoB,CAAC,EAAE,aAAa,CAAC,CAAC;AAE3B,qDAAoB","sourcesContent":["import clsx from 'clsx';\nimport { useContext, type ForwardedRef, type ReactNode } from 'react';\nimport { forwardRef } from '../../forward-ref.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport type { CommonProps } from '../types.js';\nimport { CardContext } from './card-context.js';\n\nexport interface UNSTABLE_CardProps extends CommonProps {\n children: ReactNode;\n withBorder?: boolean;\n}\n\nfunction UNSTABLE_Card(\n { children, UNSAFE_className, UNSAFE_style, withBorder = false, ...props }: UNSTABLE_CardProps,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n return (\n <CardContext.Provider value={{ withBorder }}>\n <div {...props} className={clsx('cim-card', UNSAFE_className)} style={UNSAFE_style} ref={ref}>\n {children}\n </div>\n </CardContext.Provider>\n );\n}\n\nexport interface UNSTABLE_CardSectionProps extends CommonProps {\n children: ReactNode;\n bleed?: boolean;\n withBorder?: boolean;\n}\n\nfunction UNSTABLE_CardSection(\n { children, UNSAFE_className, UNSAFE_style, bleed, withBorder, ...props }: UNSTABLE_CardSectionProps,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const { withBorder: contextWithBorder } = useContext(CardContext);\n\n return (\n <div\n {...props}\n className={clsx(\n 'cim-card-section',\n bleed && 'cim-card-section-bleed',\n (withBorder || contextWithBorder) && 'cim-card-section-with-border',\n UNSAFE_className,\n )}\n style={UNSAFE_style}\n ref={ref}\n >\n {children}\n </div>\n );\n}\n\nconst _UNSTABLE_Card = withStyleProps(forwardRef(UNSTABLE_Card), 'Card');\nconst _UNSTABLE_CardSection = withStyleProps(forwardRef(UNSTABLE_CardSection), 'CardSection');\n\nexport { _UNSTABLE_Card as UNSTABLE_Card, _UNSTABLE_CardSection as UNSTABLE_CardSection };\n"]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { type CheckboxProps as RACCheckboxProps } from 'react-aria-components';
|
|
2
2
|
import type { CommonProps, LabellableProps, StringLikeChildren } from '../types.js';
|
|
3
|
-
export interface CheckboxProps extends CommonProps, Omit<LabellableProps, 'label'>, Pick<RACCheckboxProps, 'onChange' | 'isSelected' | 'isIndeterminate' | 'isDisabled' | 'isReadOnly' | 'isRequired' | 'isInvalid' | 'name' | 'value' | 'defaultSelected'> {
|
|
3
|
+
export interface CheckboxProps extends CommonProps, Omit<LabellableProps, 'label'>, Pick<RACCheckboxProps, 'onChange' | 'isSelected' | 'isIndeterminate' | 'isDisabled' | 'isReadOnly' | 'isRequired' | 'isInvalid' | 'name' | 'value' | 'defaultSelected' | 'autoFocus'> {
|
|
4
4
|
/** The label rendered next to the checkbox. */
|
|
5
5
|
children?: StringLikeChildren;
|
|
6
6
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../../src/components/checkbox/checkbox.tsx"],"names":[],"mappings":"AAIA,OAAO,EAA2B,KAAK,aAAa,IAAI,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAIxG,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAGpF,MAAM,WAAW,aACf,SAAQ,WAAW,EACjB,IAAI,CAAC,eAAe,EAAE,OAAO,CAAC,EAC9B,IAAI,CACF,gBAAgB,EACd,UAAU,GACV,YAAY,GACZ,iBAAiB,GACjB,YAAY,GACZ,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,MAAM,GACN,OAAO,GACP,iBAAiB,
|
|
1
|
+
{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../../src/components/checkbox/checkbox.tsx"],"names":[],"mappings":"AAIA,OAAO,EAA2B,KAAK,aAAa,IAAI,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAIxG,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAGpF,MAAM,WAAW,aACf,SAAQ,WAAW,EACjB,IAAI,CAAC,eAAe,EAAE,OAAO,CAAC,EAC9B,IAAI,CACF,gBAAgB,EACd,UAAU,GACV,YAAY,GACZ,iBAAiB,GACjB,YAAY,GACZ,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,MAAM,GACN,OAAO,GACP,iBAAiB,GACjB,WAAW,CACd;IACH,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,kBAAkB,CAAC;CAC/B;AAgCD;;;;GAIG;AACH,QAAA,MAAM,SAAS,iKAAmD,CAAC;AAEnE,OAAO,EAAE,SAAS,IAAI,QAAQ,EAAE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.js","sourceRoot":"","sources":["../../../../src/components/checkbox/checkbox.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;;;AAEb,gDAAwB;AACxB,iCAAqD;AACrD,iEAAwG;AACxG,yDAAkD;AAClD,mDAA0E;AAC1E,mEAA2D;AAE3D,mDAA6C;
|
|
1
|
+
{"version":3,"file":"checkbox.js","sourceRoot":"","sources":["../../../../src/components/checkbox/checkbox.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;;;AAEb,gDAAwB;AACxB,iCAAqD;AACrD,iEAAwG;AACxG,yDAAkD;AAClD,mDAA0E;AAC1E,mEAA2D;AAE3D,mDAA6C;AAuB7C,SAAS,QAAQ,CACf,EAAE,QAAQ,EAAE,gBAAgB,EAAE,YAAY,EAAE,GAAG,KAAK,EAAiB,EACrE,GAAmC;IAEnC,MAAM,EAAE,YAAY,EAAE,SAAS,EAAE,iBAAiB,EAAE,cAAc,EAAE,GAAG,KAAK,CAAC;IAE7E,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,CAAC,QAAQ,IAAI,CAAC,SAAS,IAAI,CAAC,cAAc,EAAE,CAAC;YAC/C,OAAO,CAAC,IAAI,CAAC,oFAAoF,CAAC,CAAC;QACrG,CAAC;IACH,CAAC,EAAE,CAAC,QAAQ,EAAE,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC;IAE1C,OAAO,CACL,uBAAC,gCAAW,OAAK,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,IAAA,cAAI,EAAC,cAAc,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,YAAY,YACrG,CAAC,EAAE,eAAe,EAAE,EAAE,EAAE,CAAC,CACxB,6DACE,gCAAK,SAAS,EAAC,6BAA6B,YAC1C,gCAAK,SAAS,EAAC,qBAAqB,YAAE,eAAe,CAAC,CAAC,CAAC,uBAAC,yBAAc,KAAG,CAAC,CAAC,CAAC,uBAAC,6BAAkB,KAAG,GAAO,GACtG,EACL,QAAQ,IAAI,CACX,uBAAC,cAAI,IAAC,EAAE,EAAC,MAAM,EAAC,OAAO,EAAC,MAAM,YAC3B,QAAQ,GACJ,CACR,IACA,CACJ,GACW,CACf,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,SAAS,GAAG,IAAA,oCAAc,EAAC,IAAA,2BAAU,EAAC,QAAQ,CAAC,EAAE,UAAU,CAAC,CAAC;AAE7C,6BAAQ","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { useEffect, type ForwardedRef } from 'react';\nimport { Checkbox as RACCheckbox, type CheckboxProps as RACCheckboxProps } from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { IconCheckmarkSmall, IconMinusSmall } from '../../icons/index.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport type { CommonProps, LabellableProps, StringLikeChildren } from '../types.js';\nimport { Text } from '../typography/text.js';\n\nexport interface CheckboxProps\n extends CommonProps,\n Omit<LabellableProps, 'label'>,\n Pick<\n RACCheckboxProps,\n | 'onChange'\n | 'isSelected'\n | 'isIndeterminate'\n | 'isDisabled'\n | 'isReadOnly'\n | 'isRequired'\n | 'isInvalid'\n | 'name'\n | 'value'\n | 'defaultSelected'\n | 'autoFocus'\n > {\n /** The label rendered next to the checkbox. */\n children?: StringLikeChildren;\n}\n\nfunction Checkbox(\n { children, UNSAFE_className, UNSAFE_style, ...props }: CheckboxProps,\n ref: ForwardedRef<HTMLLabelElement>,\n) {\n const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n useEffect(() => {\n if (!children && !ariaLabel && !ariaLabelledBy) {\n console.warn('Checkbox requires one of children / aria-label / aria-labelledby for accessibility');\n }\n }, [children, ariaLabel, ariaLabelledBy]);\n\n return (\n <RACCheckbox {...props} ref={ref} className={clsx('cim-checkbox', UNSAFE_className)} style={UNSAFE_style}>\n {({ isIndeterminate }) => (\n <>\n <div className=\"cim-checkbox-toggle-wrapper\">\n <div className=\"cim-checkbox-toggle\">{isIndeterminate ? <IconMinusSmall /> : <IconCheckmarkSmall />}</div>\n </div>\n {children && (\n <Text as=\"span\" variant=\"body\">\n {children}\n </Text>\n )}\n </>\n )}\n </RACCheckbox>\n );\n}\n\n/**\n * Allows users to mark an item as selected. Can be used standalone, or as part of `CheckboxGroup`.\n *\n * See [checkbox usage guidelines](https://ui.cimpress.io/components/checkbox/).\n */\nconst _Checkbox = withStyleProps(forwardRef(Checkbox), 'Checkbox');\n\nexport { _Checkbox as Checkbox };\n"]}
|
|
@@ -9,7 +9,11 @@ export interface ComboBoxValidationValue {
|
|
|
9
9
|
}
|
|
10
10
|
export interface ComboBoxProps<T extends CollectionItem = CollectionItem> extends CommonProps, FieldWithPlaceholderProps<ComboBoxValidationValue>, CollectionProps<T>, Pick<RACComboBoxProps<T>, 'name' | 'isDisabled' | 'isRequired' | 'isInvalid' | 'isReadOnly' | 'selectedKey' | 'defaultSelectedKey' | 'inputValue' | 'defaultInputValue' | 'autoFocus' | 'onSelectionChange' | 'onInputChange' | 'onFocus' | 'onBlur' | 'onOpenChange'>, Pick<RACListBoxProps<T>, 'onScroll'> {
|
|
11
11
|
}
|
|
12
|
-
/**
|
|
12
|
+
/**
|
|
13
|
+
* Allows users to filter a collapsible list and select one item from it.
|
|
14
|
+
*
|
|
15
|
+
* See [combo box usage guidelines](https://ui.cimpress.com/components/combo-box)
|
|
16
|
+
*/
|
|
13
17
|
declare const _ComboBox: <T extends CollectionItem>(props: ComboBoxProps<T> & import("react").RefAttributes<HTMLDivElement> & import("../../with-style-props.js").StyleProps) => import("react").JSX.Element | null;
|
|
14
18
|
export { _ComboBox as ComboBox };
|
|
15
19
|
export interface ComboBoxItemProps<T extends CollectionItem> extends Pick<RACListBoxItemProps<T>, 'id' | 'isDisabled' | 'onHoverStart' | 'onHoverEnd'> {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"combo-box.d.ts","sourceRoot":"","sources":["../../../../src/components/combo-box/combo-box.tsx"],"names":[],"mappings":"AAIA,OAAO,EASL,KAAK,YAAY,IAAI,eAAe,EAIpC,KAAK,aAAa,IAAI,gBAAgB,EACtC,KAAK,gBAAgB,IAAI,mBAAmB,EAC7C,MAAM,uBAAuB,CAAC;AAM/B,OAAO,KAAK,EACV,cAAc,EACd,eAAe,EACf,WAAW,EACX,yBAAyB,EACzB,GAAG,EACH,kBAAkB,EACnB,MAAM,aAAa,CAAC;AAGrB,gFAAgF;AAChF,MAAM,WAAW,uBAAuB;IACtC,wCAAwC;IACxC,WAAW,EAAE,GAAG,GAAG,IAAI,CAAC;IACxB,uCAAuC;IACvC,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,aAAa,CAAC,CAAC,SAAS,cAAc,GAAG,cAAc,CACtE,SAAQ,WAAW,EACjB,yBAAyB,CAAC,uBAAuB,CAAC,EAClD,eAAe,CAAC,CAAC,CAAC,EAClB,IAAI,CACF,gBAAgB,CAAC,CAAC,CAAC,EACjB,MAAM,GACN,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,YAAY,GACZ,aAAa,GACb,oBAAoB,GACpB,YAAY,GACZ,mBAAmB,GACnB,WAAW,GACX,mBAAmB,GACnB,eAAe,GACf,SAAS,GACT,QAAQ,GACR,cAAc,CACjB,EACD,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,EAAE,UAAU,CAAC;CAAG;
|
|
1
|
+
{"version":3,"file":"combo-box.d.ts","sourceRoot":"","sources":["../../../../src/components/combo-box/combo-box.tsx"],"names":[],"mappings":"AAIA,OAAO,EASL,KAAK,YAAY,IAAI,eAAe,EAIpC,KAAK,aAAa,IAAI,gBAAgB,EACtC,KAAK,gBAAgB,IAAI,mBAAmB,EAC7C,MAAM,uBAAuB,CAAC;AAM/B,OAAO,KAAK,EACV,cAAc,EACd,eAAe,EACf,WAAW,EACX,yBAAyB,EACzB,GAAG,EACH,kBAAkB,EACnB,MAAM,aAAa,CAAC;AAGrB,gFAAgF;AAChF,MAAM,WAAW,uBAAuB;IACtC,wCAAwC;IACxC,WAAW,EAAE,GAAG,GAAG,IAAI,CAAC;IACxB,uCAAuC;IACvC,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,aAAa,CAAC,CAAC,SAAS,cAAc,GAAG,cAAc,CACtE,SAAQ,WAAW,EACjB,yBAAyB,CAAC,uBAAuB,CAAC,EAClD,eAAe,CAAC,CAAC,CAAC,EAClB,IAAI,CACF,gBAAgB,CAAC,CAAC,CAAC,EACjB,MAAM,GACN,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,YAAY,GACZ,aAAa,GACb,oBAAoB,GACpB,YAAY,GACZ,mBAAmB,GACnB,WAAW,GACX,mBAAmB,GACnB,eAAe,GACf,SAAS,GACT,QAAQ,GACR,cAAc,CACjB,EACD,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,EAAE,UAAU,CAAC;CAAG;AA+D3C;;;;GAIG;AACH,QAAA,MAAM,SAAS,GAlEG,CAAC,SAAS,cAAc,iKAkEwB,CAAC;AAEnE,OAAO,EAAE,SAAS,IAAI,QAAQ,EAAE,CAAC;AAsBjC,MAAM,WAAW,iBAAiB,CAAC,CAAC,SAAS,cAAc,CACzD,SAAQ,IAAI,CAAC,mBAAmB,CAAC,CAAC,CAAC,EAAE,IAAI,GAAG,YAAY,GAAG,cAAc,GAAG,YAAY,CAAC;IACzF,QAAQ,EAAE,kBAAkB,CAAC;CAC9B;AAED,oDAAoD;AACpD,wBAAgB,YAAY,CAAC,CAAC,SAAS,cAAc,EAAE,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,iBAAiB,CAAC,CAAC,CAAC,2CAiBlG;yBAjBe,YAAY;;;AAqB5B,MAAM,WAAW,oBAAoB,CAAC,CAAC,SAAS,cAAc,CAAE,SAAQ,eAAe,CAAC,CAAC,CAAC;IACxF,6EAA6E;IAC7E,EAAE,CAAC,EAAE,GAAG,CAAC;IACT,mDAAmD;IACnD,KAAK,EAAE,MAAM,CAAC;CACf;AAED,0DAA0D;AAC1D,wBAAgB,eAAe,CAAC,CAAC,SAAS,cAAc,EAAE,EACxD,KAAK,EACL,QAAQ,EACR,KAAK,EACL,GAAG,KAAK,EACT,EAAE,oBAAoB,CAAC,CAAC,CAAC,2CAezB;yBApBe,eAAe"}
|
|
@@ -18,7 +18,6 @@ const collapsible_list_js_1 = require("../internal/collapsible-list/collapsible-
|
|
|
18
18
|
const form_field_js_1 = require("../internal/form-field/form-field.js");
|
|
19
19
|
const utils_js_1 = require("../typography/utils.js");
|
|
20
20
|
function ComboBox({ label, description, error, items, children, placeholder, UNSAFE_className, UNSAFE_style, isReadOnly, onScroll, ...props }, ref) {
|
|
21
|
-
const triggerPositioningRef = (0, react_1.useRef)(null);
|
|
22
21
|
const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;
|
|
23
22
|
(0, react_1.useEffect)(() => {
|
|
24
23
|
if (!label && !ariaLabel && !ariaLabelledBy) {
|
|
@@ -28,12 +27,13 @@ function ComboBox({ label, description, error, items, children, placeholder, UNS
|
|
|
28
27
|
if (items != null && typeof children !== 'function') {
|
|
29
28
|
console.warn('`ComboBox` requires `children` to be a function when using `items` prop');
|
|
30
29
|
}
|
|
31
|
-
return ((0, jsx_runtime_1.jsxs)(react_aria_components_1.ComboBox, { ...props, ref: ref, className: (0, clsx_1.default)('cim-combo-box', UNSAFE_className), style: UNSAFE_style, menuTrigger: "focus", isReadOnly: isReadOnly, "data-readonly": isReadOnly ? true : undefined, children: [(0, jsx_runtime_1.jsx)(form_field_js_1.FormFieldLabel, { isRequired: props.isRequired, isDisabled: props.isDisabled, children: label }), (0, jsx_runtime_1.jsxs)(react_aria_components_1.Group, { className: "cim-combo-box-input-
|
|
32
|
-
// Position the list relative to wrapper div instead of input to account for border
|
|
33
|
-
triggerRef: triggerPositioningRef, widthCorrection: 2, children: (0, jsx_runtime_1.jsx)(react_aria_components_1.ListBox, { className: "cim-combo-box-listbox", onScroll: onScroll, items: items, children: children }) })] }));
|
|
30
|
+
return ((0, jsx_runtime_1.jsxs)(react_aria_components_1.ComboBox, { ...props, ref: ref, className: (0, clsx_1.default)('cim-combo-box', UNSAFE_className), style: UNSAFE_style, menuTrigger: "focus", isReadOnly: isReadOnly, "data-readonly": isReadOnly ? true : undefined, children: [(0, jsx_runtime_1.jsx)(form_field_js_1.FormFieldLabel, { isRequired: props.isRequired, isDisabled: props.isDisabled, children: label }), (0, jsx_runtime_1.jsxs)(react_aria_components_1.Group, { className: "cim-combo-box-input-group", children: [(0, jsx_runtime_1.jsx)(ComboBoxInput, { isReadOnly: isReadOnly, placeholder: placeholder }), (0, jsx_runtime_1.jsx)(react_aria_components_1.Button, { className: "cim-combo-box-button", children: (0, jsx_runtime_1.jsx)(index_js_1.IconChevronDownFill, {}) })] }), (0, jsx_runtime_1.jsx)(form_field_js_1.FormFieldError, { children: error }), (0, jsx_runtime_1.jsx)(form_field_js_1.FormFieldDescription, { children: description }), (0, jsx_runtime_1.jsx)(collapsible_list_js_1.CollapsibleList, { offset: 5, maxHeight: 315, children: (0, jsx_runtime_1.jsx)(react_aria_components_1.ListBox, { className: "cim-combo-box-listbox", onScroll: onScroll, items: items, children: children }) })] }));
|
|
34
31
|
}
|
|
35
|
-
|
|
36
|
-
|
|
32
|
+
/**
|
|
33
|
+
* Allows users to filter a collapsible list and select one item from it.
|
|
34
|
+
*
|
|
35
|
+
* See [combo box usage guidelines](https://ui.cimpress.com/components/combo-box)
|
|
36
|
+
*/
|
|
37
37
|
const _ComboBox = (0, with_style_props_js_1.withStyleProps)((0, forward_ref_js_1.forwardRef)(ComboBox), 'ComboBox');
|
|
38
38
|
exports.ComboBox = _ComboBox;
|
|
39
39
|
function ComboBoxInput({ isReadOnly, placeholder, }) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"combo-box.js","sourceRoot":"","sources":["../../../../src/components/combo-box/combo-box.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { useContext, useEffect, useRef, type ForwardedRef } from 'react';\nimport {\n Button as RACButton,\n Collection as RACCollection,\n ComboBox as RACComboBox,\n ComboBoxStateContext as RACComboBoxStateContext,\n Group as RACGroup,\n Header as RACHeader,\n Input as RACInput,\n ListBox as RACListBox,\n type ListBoxProps as RACListBoxProps,\n ListBoxItem as RACListBoxItem,\n ListBoxSection as RACListBoxSection,\n Text as RACText,\n type ComboBoxProps as RACComboBoxProps,\n type ListBoxItemProps as RACListBoxItemProps,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { IconCheckmark, IconChevronDownFill } from '../../icons/index.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { CollapsibleList } from '../internal/collapsible-list/collapsible-list.js';\nimport { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';\nimport type {\n CollectionItem,\n CollectionProps,\n CommonProps,\n FieldWithPlaceholderProps,\n Key,\n StringLikeChildren,\n} from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\n/** Represents the state of the `ComboBox` component for validation purposes. */\nexport interface ComboBoxValidationValue {\n /** The selected key in the ComboBox. */\n selectedKey: Key | null;\n /** The value of the ComboBox input. */\n inputValue: string;\n}\n\nexport interface ComboBoxProps<T extends CollectionItem = CollectionItem>\n extends CommonProps,\n FieldWithPlaceholderProps<ComboBoxValidationValue>,\n CollectionProps<T>,\n Pick<\n RACComboBoxProps<T>,\n | 'name'\n | 'isDisabled'\n | 'isRequired'\n | 'isInvalid'\n | 'isReadOnly'\n | 'selectedKey'\n | 'defaultSelectedKey'\n | 'inputValue'\n | 'defaultInputValue'\n | 'autoFocus'\n | 'onSelectionChange'\n | 'onInputChange'\n | 'onFocus'\n | 'onBlur'\n | 'onOpenChange'\n >,\n Pick<RACListBoxProps<T>, 'onScroll'> {}\n\nfunction ComboBox<T extends CollectionItem>(\n {\n label,\n description,\n error,\n items,\n children,\n placeholder,\n UNSAFE_className,\n UNSAFE_style,\n isReadOnly,\n onScroll,\n ...props\n }: ComboBoxProps<T>,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const triggerPositioningRef = useRef<HTMLDivElement>(null);\n\n const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n useEffect(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn('ComboBox requires one of label / aria-label / aria-labelledby for accessibility');\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n if (items != null && typeof children !== 'function') {\n console.warn('`ComboBox` requires `children` to be a function when using `items` prop');\n }\n\n return (\n <RACComboBox\n {...props}\n ref={ref}\n className={clsx('cim-combo-box', UNSAFE_className)}\n style={UNSAFE_style}\n menuTrigger=\"focus\"\n isReadOnly={isReadOnly}\n data-readonly={isReadOnly ? true : undefined}\n >\n <FormFieldLabel isRequired={props.isRequired} isDisabled={props.isDisabled}>\n {label}\n </FormFieldLabel>\n <RACGroup className=\"cim-combo-box-input-wrapper\" ref={triggerPositioningRef}>\n <ComboBoxInput isReadOnly={isReadOnly} placeholder={placeholder} />\n <RACButton className=\"cim-combo-box-button\">\n <IconChevronDownFill />\n </RACButton>\n </RACGroup>\n <FormFieldError>{error}</FormFieldError>\n <FormFieldDescription>{description}</FormFieldDescription>\n <CollapsibleList\n offset={5} // 1px border + 4px actual offset\n maxHeight={315}\n // Position the list relative to wrapper div instead of input to account for border\n triggerRef={triggerPositioningRef}\n widthCorrection={2} // React Aria calculates the width of the trigger based on the width of the input + button, so we need to add 2px to account for the border on `.cim-combo-box-input-wrapper`\n >\n <RACListBox className=\"cim-combo-box-listbox\" onScroll={onScroll} items={items}>\n {children}\n </RACListBox>\n </CollapsibleList>\n </RACComboBox>\n );\n}\n\n// TODO: add link to usage guidelines\n/** Allows users to filter a collapsible list and select one item from it. */\nconst _ComboBox = withStyleProps(forwardRef(ComboBox), 'ComboBox');\n\nexport { _ComboBox as ComboBox };\n\nfunction ComboBoxInput({\n isReadOnly,\n placeholder,\n}: {\n isReadOnly: boolean | undefined;\n placeholder: string | undefined;\n}) {\n const comboBoxState = useContext(RACComboBoxStateContext);\n\n return (\n <RACInput\n className={clsx('cim-combo-box-input', textStyle({ variant: 'medium' }))}\n // Ensure the popover opens when the input is clicked.\n // By default, React Aria only opens the popover when the input is focused.\n onClick={() => !isReadOnly && comboBoxState!.open()}\n placeholder={placeholder}\n />\n );\n}\n\nexport interface ComboBoxItemProps<T extends CollectionItem>\n extends Pick<RACListBoxItemProps<T>, 'id' | 'isDisabled' | 'onHoverStart' | 'onHoverEnd'> {\n children: StringLikeChildren;\n}\n\n/** Renders a single list item within `ComboBox`. */\nexport function ComboBoxItem<T extends CollectionItem>({ children, ...props }: ComboBoxItemProps<T>) {\n const textValue =\n typeof children === 'string' ? children : typeof children === 'number' ? String(children) : children.join('');\n\n return (\n <RACListBoxItem {...props} className=\"cim-combo-box-item\" textValue={textValue}>\n {({ isDisabled }) => (\n <>\n <IconCheckmark />\n\n <RACText slot=\"label\" className={textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'base' })}>\n {children}\n </RACText>\n </>\n )}\n </RACListBoxItem>\n );\n}\n\nComboBoxItem.displayName = 'ComboBoxItem';\n\nexport interface ComboBoxSectionProps<T extends CollectionItem> extends CollectionProps<T> {\n /** The ID of the section. Has to be unique across all sections and items. */\n id?: Key;\n /** The content to display as the section title. */\n title: string;\n}\n\n/** Groups list items within `ComboBox` into a section. */\nexport function ComboBoxSection<T extends CollectionItem>({\n title,\n children,\n items,\n ...props\n}: ComboBoxSectionProps<T>) {\n if (items != null && typeof children !== 'function') {\n console.warn('`ComboBoxSection` requires `children` to be a function when using `items` prop');\n }\n\n return (\n <RACListBoxSection {...props} className=\"cim-combo-box-section\">\n <RACHeader\n className={clsx('cim-combo-box-section-header', textStyle({ variant: 'small-semibold', tone: 'subtle' }))}\n >\n {title}\n </RACHeader>\n <RACCollection items={items}>{children}</RACCollection>\n </RACListBoxSection>\n );\n}\n\nComboBoxSection.displayName = 'ComboBoxSection';\n"]}
|
|
1
|
+
{"version":3,"file":"combo-box.js","sourceRoot":"","sources":["../../../../src/components/combo-box/combo-box.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { useContext, useEffect, type ForwardedRef } from 'react';\nimport {\n Button as RACButton,\n Collection as RACCollection,\n ComboBox as RACComboBox,\n ComboBoxStateContext as RACComboBoxStateContext,\n Group as RACGroup,\n Header as RACHeader,\n Input as RACInput,\n ListBox as RACListBox,\n type ListBoxProps as RACListBoxProps,\n ListBoxItem as RACListBoxItem,\n ListBoxSection as RACListBoxSection,\n Text as RACText,\n type ComboBoxProps as RACComboBoxProps,\n type ListBoxItemProps as RACListBoxItemProps,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { IconCheckmark, IconChevronDownFill } from '../../icons/index.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { CollapsibleList } from '../internal/collapsible-list/collapsible-list.js';\nimport { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';\nimport type {\n CollectionItem,\n CollectionProps,\n CommonProps,\n FieldWithPlaceholderProps,\n Key,\n StringLikeChildren,\n} from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\n/** Represents the state of the `ComboBox` component for validation purposes. */\nexport interface ComboBoxValidationValue {\n /** The selected key in the ComboBox. */\n selectedKey: Key | null;\n /** The value of the ComboBox input. */\n inputValue: string;\n}\n\nexport interface ComboBoxProps<T extends CollectionItem = CollectionItem>\n extends CommonProps,\n FieldWithPlaceholderProps<ComboBoxValidationValue>,\n CollectionProps<T>,\n Pick<\n RACComboBoxProps<T>,\n | 'name'\n | 'isDisabled'\n | 'isRequired'\n | 'isInvalid'\n | 'isReadOnly'\n | 'selectedKey'\n | 'defaultSelectedKey'\n | 'inputValue'\n | 'defaultInputValue'\n | 'autoFocus'\n | 'onSelectionChange'\n | 'onInputChange'\n | 'onFocus'\n | 'onBlur'\n | 'onOpenChange'\n >,\n Pick<RACListBoxProps<T>, 'onScroll'> {}\n\nfunction ComboBox<T extends CollectionItem>(\n {\n label,\n description,\n error,\n items,\n children,\n placeholder,\n UNSAFE_className,\n UNSAFE_style,\n isReadOnly,\n onScroll,\n ...props\n }: ComboBoxProps<T>,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n useEffect(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn('ComboBox requires one of label / aria-label / aria-labelledby for accessibility');\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n if (items != null && typeof children !== 'function') {\n console.warn('`ComboBox` requires `children` to be a function when using `items` prop');\n }\n\n return (\n <RACComboBox\n {...props}\n ref={ref}\n className={clsx('cim-combo-box', UNSAFE_className)}\n style={UNSAFE_style}\n menuTrigger=\"focus\"\n isReadOnly={isReadOnly}\n data-readonly={isReadOnly ? true : undefined}\n >\n <FormFieldLabel isRequired={props.isRequired} isDisabled={props.isDisabled}>\n {label}\n </FormFieldLabel>\n <RACGroup className=\"cim-combo-box-input-group\">\n <ComboBoxInput isReadOnly={isReadOnly} placeholder={placeholder} />\n <RACButton className=\"cim-combo-box-button\">\n <IconChevronDownFill />\n </RACButton>\n </RACGroup>\n <FormFieldError>{error}</FormFieldError>\n <FormFieldDescription>{description}</FormFieldDescription>\n <CollapsibleList\n offset={5} // 1px border + 4px actual offset\n maxHeight={315}\n >\n <RACListBox className=\"cim-combo-box-listbox\" onScroll={onScroll} items={items}>\n {children}\n </RACListBox>\n </CollapsibleList>\n </RACComboBox>\n );\n}\n\n/**\n * Allows users to filter a collapsible list and select one item from it.\n *\n * See [combo box usage guidelines](https://ui.cimpress.com/components/combo-box)\n */\nconst _ComboBox = withStyleProps(forwardRef(ComboBox), 'ComboBox');\n\nexport { _ComboBox as ComboBox };\n\nfunction ComboBoxInput({\n isReadOnly,\n placeholder,\n}: {\n isReadOnly: boolean | undefined;\n placeholder: string | undefined;\n}) {\n const comboBoxState = useContext(RACComboBoxStateContext);\n\n return (\n <RACInput\n className={clsx('cim-combo-box-input', textStyle({ variant: 'medium' }))}\n // Ensure the popover opens when the input is clicked.\n // By default, React Aria only opens the popover when the input is focused.\n onClick={() => !isReadOnly && comboBoxState!.open()}\n placeholder={placeholder}\n />\n );\n}\n\nexport interface ComboBoxItemProps<T extends CollectionItem>\n extends Pick<RACListBoxItemProps<T>, 'id' | 'isDisabled' | 'onHoverStart' | 'onHoverEnd'> {\n children: StringLikeChildren;\n}\n\n/** Renders a single list item within `ComboBox`. */\nexport function ComboBoxItem<T extends CollectionItem>({ children, ...props }: ComboBoxItemProps<T>) {\n const textValue =\n typeof children === 'string' ? children : typeof children === 'number' ? String(children) : children.join('');\n\n return (\n <RACListBoxItem {...props} className=\"cim-combo-box-item\" textValue={textValue}>\n {({ isDisabled }) => (\n <>\n <IconCheckmark />\n\n <RACText slot=\"label\" className={textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'base' })}>\n {children}\n </RACText>\n </>\n )}\n </RACListBoxItem>\n );\n}\n\nComboBoxItem.displayName = 'ComboBoxItem';\n\nexport interface ComboBoxSectionProps<T extends CollectionItem> extends CollectionProps<T> {\n /** The ID of the section. Has to be unique across all sections and items. */\n id?: Key;\n /** The content to display as the section title. */\n title: string;\n}\n\n/** Groups list items within `ComboBox` into a section. */\nexport function ComboBoxSection<T extends CollectionItem>({\n title,\n children,\n items,\n ...props\n}: ComboBoxSectionProps<T>) {\n if (items != null && typeof children !== 'function') {\n console.warn('`ComboBoxSection` requires `children` to be a function when using `items` prop');\n }\n\n return (\n <RACListBoxSection {...props} className=\"cim-combo-box-section\">\n <RACHeader\n className={clsx('cim-combo-box-section-header', textStyle({ variant: 'small-semibold', tone: 'subtle' }))}\n >\n {title}\n </RACHeader>\n <RACCollection items={items}>{children}</RACCollection>\n </RACListBoxSection>\n );\n}\n\nComboBoxSection.displayName = 'ComboBoxSection';\n"]}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import type { ReactNode } from 'react';
|
|
2
|
+
import { type DisclosureGroupProps as RACDisclosureGroupProps } from 'react-aria-components';
|
|
3
|
+
import type { CommonProps } from '../types.js';
|
|
4
|
+
export interface UNSTABLE_DisclosureGroupProps extends CommonProps, Pick<RACDisclosureGroupProps, 'isDisabled' | 'allowsMultipleExpanded' | 'defaultExpandedKeys'> {
|
|
5
|
+
/** The disclosures to group together */
|
|
6
|
+
children: ReactNode;
|
|
7
|
+
}
|
|
8
|
+
declare const _DisclosureGroup: (props: UNSTABLE_DisclosureGroupProps & import("react").RefAttributes<HTMLDivElement> & import("../../with-style-props.js").StyleProps) => import("react").JSX.Element | null;
|
|
9
|
+
export { _DisclosureGroup as UNSTABLE_DisclosureGroup };
|
|
10
|
+
//# sourceMappingURL=disclosure-group.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"disclosure-group.d.ts","sourceRoot":"","sources":["../../../../src/components/disclosure/disclosure-group.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAgB,SAAS,EAAE,MAAM,OAAO,CAAC;AACrD,OAAO,EAEL,KAAK,oBAAoB,IAAI,uBAAuB,EACrD,MAAM,uBAAuB,CAAC;AAG/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE/C,MAAM,WAAW,6BACf,SAAQ,WAAW,EACjB,IAAI,CAAC,uBAAuB,EAAE,YAAY,GAAG,wBAAwB,GAAG,qBAAqB,CAAC;IAChG,wCAAwC;IACxC,QAAQ,EAAE,SAAS,CAAC;CACrB;AAkBD,QAAA,MAAM,gBAAgB,+KAA0E,CAAC;AAEjG,OAAO,EAAE,gBAAgB,IAAI,wBAAwB,EAAE,CAAC"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
"use strict";
|
|
3
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
4
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
5
|
+
};
|
|
6
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
7
|
+
exports.UNSTABLE_DisclosureGroup = void 0;
|
|
8
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
9
|
+
const clsx_1 = __importDefault(require("clsx"));
|
|
10
|
+
const react_aria_components_1 = require("react-aria-components");
|
|
11
|
+
const forward_ref_js_1 = require("../../forward-ref.js");
|
|
12
|
+
const with_style_props_js_1 = require("../../with-style-props.js");
|
|
13
|
+
function UNSTABLE_DisclosureGroup({ children, UNSAFE_className, UNSAFE_style, ...props }, ref) {
|
|
14
|
+
return ((0, jsx_runtime_1.jsx)(react_aria_components_1.DisclosureGroup, { ...props, ref: ref, className: (0, clsx_1.default)('cim-disclosure-group', UNSAFE_className), style: UNSAFE_style, children: children }));
|
|
15
|
+
}
|
|
16
|
+
const _DisclosureGroup = (0, with_style_props_js_1.withStyleProps)((0, forward_ref_js_1.forwardRef)(UNSTABLE_DisclosureGroup), 'DisclosureGroup');
|
|
17
|
+
exports.UNSTABLE_DisclosureGroup = _DisclosureGroup;
|
|
18
|
+
//# sourceMappingURL=disclosure-group.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"disclosure-group.js","sourceRoot":"","sources":["../../../../src/components/disclosure/disclosure-group.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;;;AAEb,gDAAwB;AAExB,iEAG+B;AAC/B,yDAAkD;AAClD,mEAA2D;AAU3D,SAAS,wBAAwB,CAC/B,EAAE,QAAQ,EAAE,gBAAgB,EAAE,YAAY,EAAE,GAAG,KAAK,EAAiC,EACrF,GAAiC;IAEjC,OAAO,CACL,uBAAC,uCAAkB,OACb,KAAK,EACT,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,cAAI,EAAC,sBAAsB,EAAE,gBAAgB,CAAC,EACzD,KAAK,EAAE,YAAY,YAElB,QAAQ,GACU,CACtB,CAAC;AACJ,CAAC;AAED,MAAM,gBAAgB,GAAG,IAAA,oCAAc,EAAC,IAAA,2BAAU,EAAC,wBAAwB,CAAC,EAAE,iBAAiB,CAAC,CAAC;AAEpE,oDAAwB","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport type { ForwardedRef, ReactNode } from 'react';\nimport {\n DisclosureGroup as RACDisclosureGroup,\n type DisclosureGroupProps as RACDisclosureGroupProps,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport type { CommonProps } from '../types.js';\n\nexport interface UNSTABLE_DisclosureGroupProps\n extends CommonProps,\n Pick<RACDisclosureGroupProps, 'isDisabled' | 'allowsMultipleExpanded' | 'defaultExpandedKeys'> {\n /** The disclosures to group together */\n children: ReactNode;\n}\n\nfunction UNSTABLE_DisclosureGroup(\n { children, UNSAFE_className, UNSAFE_style, ...props }: UNSTABLE_DisclosureGroupProps,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n return (\n <RACDisclosureGroup\n {...props}\n ref={ref}\n className={clsx('cim-disclosure-group', UNSAFE_className)}\n style={UNSAFE_style}\n >\n {children}\n </RACDisclosureGroup>\n );\n}\n\nconst _DisclosureGroup = withStyleProps(forwardRef(UNSTABLE_DisclosureGroup), 'DisclosureGroup');\n\nexport { _DisclosureGroup as UNSTABLE_DisclosureGroup };\n"]}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import type { ReactNode } from 'react';
|
|
2
|
+
import { type DisclosureProps as RACDisclosureProps } from 'react-aria-components';
|
|
3
|
+
import type { CommonProps, StringLikeChildren } from '../types.js';
|
|
4
|
+
export interface UNSTABLE_DisclosureProps extends Omit<CommonProps, 'id'>, Pick<RACDisclosureProps, 'id' | 'isDisabled' | 'defaultExpanded'> {
|
|
5
|
+
/** The content to display when the disclosure is expanded */
|
|
6
|
+
children: ReactNode;
|
|
7
|
+
/** The title that remains visible and triggers expand/collapse */
|
|
8
|
+
title: StringLikeChildren;
|
|
9
|
+
/** The content to display at the end of the heading */
|
|
10
|
+
contentEnd?: ReactNode;
|
|
11
|
+
}
|
|
12
|
+
declare const _Disclosure: (props: UNSTABLE_DisclosureProps & import("react").RefAttributes<HTMLDivElement> & import("../../with-style-props.js").StyleProps) => import("react").JSX.Element | null;
|
|
13
|
+
export { _Disclosure as UNSTABLE_Disclosure };
|
|
14
|
+
//# sourceMappingURL=disclosure.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"disclosure.d.ts","sourceRoot":"","sources":["../../../../src/components/disclosure/disclosure.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAgB,SAAS,EAAE,MAAM,OAAO,CAAC;AACrD,OAAO,EAKL,KAAK,eAAe,IAAI,kBAAkB,EAC3C,MAAM,uBAAuB,CAAC;AAI/B,OAAO,KAAK,EAAE,WAAW,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAGnE,MAAM,WAAW,wBACf,SAAQ,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,EAC7B,IAAI,CAAC,kBAAkB,EAAE,IAAI,GAAG,YAAY,GAAG,iBAAiB,CAAC;IACnE,6DAA6D;IAC7D,QAAQ,EAAE,SAAS,CAAC;IACpB,kEAAkE;IAClE,KAAK,EAAE,kBAAkB,CAAC;IAC1B,uDAAuD;IACvD,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB;AA0BD,QAAA,MAAM,WAAW,0KAAgE,CAAC;AAElF,OAAO,EAAE,WAAW,IAAI,mBAAmB,EAAE,CAAC"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
"use strict";
|
|
3
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
4
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
5
|
+
};
|
|
6
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
7
|
+
exports.UNSTABLE_Disclosure = void 0;
|
|
8
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
9
|
+
const clsx_1 = __importDefault(require("clsx"));
|
|
10
|
+
const react_aria_components_1 = require("react-aria-components");
|
|
11
|
+
const forward_ref_js_1 = require("../../forward-ref.js");
|
|
12
|
+
const index_js_1 = require("../../icons/index.js");
|
|
13
|
+
const with_style_props_js_1 = require("../../with-style-props.js");
|
|
14
|
+
const text_js_1 = require("../typography/text.js");
|
|
15
|
+
function UNSTABLE_Disclosure({ children, title, contentEnd, UNSAFE_className, UNSAFE_style, ...props }, ref) {
|
|
16
|
+
return ((0, jsx_runtime_1.jsxs)(react_aria_components_1.Disclosure, { ref: ref, ...props, className: (0, clsx_1.default)('cim-disclosure', UNSAFE_className), style: UNSAFE_style, children: [(0, jsx_runtime_1.jsxs)("div", { className: "cim-disclosure-heading-wrapper", children: [(0, jsx_runtime_1.jsx)(react_aria_components_1.Heading, { className: "cim-disclosure-heading", children: (0, jsx_runtime_1.jsxs)(react_aria_components_1.Button, { className: "cim-disclosure-button", slot: "trigger", children: [(0, jsx_runtime_1.jsx)(index_js_1.IconChevronDownFill, { size: 24, UNSAFE_className: "cim-disclosure-icon" }), (0, jsx_runtime_1.jsx)(text_js_1.Text, { as: "span", variant: "body-semibold", children: title })] }) }), contentEnd && (0, jsx_runtime_1.jsx)("div", { className: "cim-disclosure-content-end", children: contentEnd })] }), (0, jsx_runtime_1.jsx)(react_aria_components_1.DisclosurePanel, { className: "cim-disclosure-panel", children: (0, jsx_runtime_1.jsx)("div", { className: "cim-disclosure-panel-content", children: children }) })] }));
|
|
17
|
+
}
|
|
18
|
+
const _Disclosure = (0, with_style_props_js_1.withStyleProps)((0, forward_ref_js_1.forwardRef)(UNSTABLE_Disclosure), 'Disclosure');
|
|
19
|
+
exports.UNSTABLE_Disclosure = _Disclosure;
|
|
20
|
+
//# sourceMappingURL=disclosure.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"disclosure.js","sourceRoot":"","sources":["../../../../src/components/disclosure/disclosure.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;;;AAEb,gDAAwB;AAExB,iEAM+B;AAC/B,yDAAkD;AAClD,mDAA2D;AAC3D,mEAA2D;AAE3D,mDAA6C;AAa7C,SAAS,mBAAmB,CAC1B,EAAE,QAAQ,EAAE,KAAK,EAAE,UAAU,EAAE,gBAAgB,EAAE,YAAY,EAAE,GAAG,KAAK,EAA4B,EACnG,GAAiC;IAEjC,OAAO,CACL,wBAAC,kCAAa,IAAC,GAAG,EAAE,GAAG,KAAM,KAAK,EAAE,SAAS,EAAE,IAAA,cAAI,EAAC,gBAAgB,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,YAAY,aAC1G,iCAAK,SAAS,EAAC,gCAAgC,aAC7C,uBAAC,+BAAU,IAAC,SAAS,EAAC,wBAAwB,YAC5C,wBAAC,8BAAS,IAAC,SAAS,EAAC,uBAAuB,EAAC,IAAI,EAAC,SAAS,aACzD,uBAAC,8BAAmB,IAAC,IAAI,EAAE,EAAE,EAAE,gBAAgB,EAAC,qBAAqB,GAAG,EACxE,uBAAC,cAAI,IAAC,EAAE,EAAC,MAAM,EAAC,OAAO,EAAC,eAAe,YACpC,KAAK,GACD,IACG,GACD,EACZ,UAAU,IAAI,gCAAK,SAAS,EAAC,4BAA4B,YAAE,UAAU,GAAO,IACzE,EACN,uBAAC,uCAAkB,IAAC,SAAS,EAAC,sBAAsB,YAClD,gCAAK,SAAS,EAAC,8BAA8B,YAAE,QAAQ,GAAO,GAC3C,IACP,CACjB,CAAC;AACJ,CAAC;AAED,MAAM,WAAW,GAAG,IAAA,oCAAc,EAAC,IAAA,2BAAU,EAAC,mBAAmB,CAAC,EAAE,YAAY,CAAC,CAAC;AAE1D,0CAAmB","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport type { ForwardedRef, ReactNode } from 'react';\nimport {\n Disclosure as RACDisclosure,\n Button as RACButton,\n Heading as RACHeading,\n DisclosurePanel as RACDisclosurePanel,\n type DisclosureProps as RACDisclosureProps,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { IconChevronDownFill } from '../../icons/index.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport type { CommonProps, StringLikeChildren } from '../types.js';\nimport { Text } from '../typography/text.js';\n\nexport interface UNSTABLE_DisclosureProps\n extends Omit<CommonProps, 'id'>,\n Pick<RACDisclosureProps, 'id' | 'isDisabled' | 'defaultExpanded'> {\n /** The content to display when the disclosure is expanded */\n children: ReactNode;\n /** The title that remains visible and triggers expand/collapse */\n title: StringLikeChildren;\n /** The content to display at the end of the heading */\n contentEnd?: ReactNode;\n}\n\nfunction UNSTABLE_Disclosure(\n { children, title, contentEnd, UNSAFE_className, UNSAFE_style, ...props }: UNSTABLE_DisclosureProps,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n return (\n <RACDisclosure ref={ref} {...props} className={clsx('cim-disclosure', UNSAFE_className)} style={UNSAFE_style}>\n <div className=\"cim-disclosure-heading-wrapper\">\n <RACHeading className=\"cim-disclosure-heading\">\n <RACButton className=\"cim-disclosure-button\" slot=\"trigger\">\n <IconChevronDownFill size={24} UNSAFE_className=\"cim-disclosure-icon\" />\n <Text as=\"span\" variant=\"body-semibold\">\n {title}\n </Text>\n </RACButton>\n </RACHeading>\n {contentEnd && <div className=\"cim-disclosure-content-end\">{contentEnd}</div>}\n </div>\n <RACDisclosurePanel className=\"cim-disclosure-panel\">\n <div className=\"cim-disclosure-panel-content\">{children}</div>\n </RACDisclosurePanel>\n </RACDisclosure>\n );\n}\n\nconst _Disclosure = withStyleProps(forwardRef(UNSTABLE_Disclosure), 'Disclosure');\n\nexport { _Disclosure as UNSTABLE_Disclosure };\n"]}
|
|
@@ -1,16 +1,2 @@
|
|
|
1
|
-
import { type PopoverProps as RACPopoverProps } from 'react-aria-components';
|
|
2
|
-
interface CollapsibleListProps extends Pick<RACPopoverProps, 'placement' | 'offset' | 'maxHeight' | 'children' | 'triggerRef'> {
|
|
3
|
-
/** A correction amount (in px) to add to the minimum list width. */
|
|
4
|
-
widthCorrection?: number;
|
|
5
|
-
}
|
|
6
|
-
/**
|
|
7
|
-
* Displays a collapsible list activated via a trigger element.
|
|
8
|
-
*
|
|
9
|
-
* @internal
|
|
10
|
-
*/
|
|
11
|
-
export declare function CollapsibleList({ children, widthCorrection, ...props }: CollapsibleListProps): import("react/jsx-runtime").JSX.Element;
|
|
12
|
-
export declare namespace CollapsibleList {
|
|
13
|
-
var displayName: string;
|
|
14
|
-
}
|
|
15
1
|
export {};
|
|
16
2
|
//# sourceMappingURL=collapsible-list.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"collapsible-list.d.ts","sourceRoot":"","sources":["../../../../../src/components/internal/collapsible-list/collapsible-list.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"collapsible-list.d.ts","sourceRoot":"","sources":["../../../../../src/components/internal/collapsible-list/collapsible-list.tsx"],"names":[],"mappings":""}
|
|
@@ -8,10 +8,8 @@ const react_aria_components_1 = require("react-aria-components");
|
|
|
8
8
|
*
|
|
9
9
|
* @internal
|
|
10
10
|
*/
|
|
11
|
-
function CollapsibleList({ children,
|
|
12
|
-
return ((0, jsx_runtime_1.jsx)(react_aria_components_1.Popover, { ...props, className: "cim-collapsible-list",
|
|
13
|
-
// @ts-expect-error `style` doesn't expect CSS variables
|
|
14
|
-
style: { '--trigger-width-corr': `${widthCorrection}px` }, containerPadding: 16, "data-cim-style-root": true, children: children }));
|
|
11
|
+
function CollapsibleList({ children, ...props }) {
|
|
12
|
+
return ((0, jsx_runtime_1.jsx)(react_aria_components_1.Popover, { ...props, className: "cim-collapsible-list", containerPadding: 16, "data-cim-style-root": true, children: children }));
|
|
15
13
|
}
|
|
16
14
|
CollapsibleList.displayName = 'CollapsibleList';
|
|
17
15
|
//# sourceMappingURL=collapsible-list.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"collapsible-list.js","sourceRoot":"","sources":["../../../../../src/components/internal/collapsible-list/collapsible-list.tsx"],"names":[],"mappings":";;
|
|
1
|
+
{"version":3,"file":"collapsible-list.js","sourceRoot":"","sources":["../../../../../src/components/internal/collapsible-list/collapsible-list.tsx"],"names":[],"mappings":";;AAUA,0CAMC;;AAhBD,iEAAoG;AAKpG;;;;GAIG;AACH,SAAgB,eAAe,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAwB;IAC1E,OAAO,CACL,uBAAC,+BAAU,OAAK,KAAK,EAAE,SAAS,EAAC,sBAAsB,EAAC,gBAAgB,EAAE,EAAE,yCACzE,QAAQ,GACE,CACd,CAAC;AACJ,CAAC;AAED,eAAe,CAAC,WAAW,GAAG,iBAAiB,CAAC","sourcesContent":["import { Popover as RACPopover, type PopoverProps as RACPopoverProps } from 'react-aria-components';\n\ninterface CollapsibleListProps\n extends Pick<RACPopoverProps, 'placement' | 'offset' | 'maxHeight' | 'children' | 'triggerRef'> {}\n\n/**\n * Displays a collapsible list activated via a trigger element.\n *\n * @internal\n */\nexport function CollapsibleList({ children, ...props }: CollapsibleListProps) {\n return (\n <RACPopover {...props} className=\"cim-collapsible-list\" containerPadding={16} data-cim-style-root>\n {children}\n </RACPopover>\n );\n}\n\nCollapsibleList.displayName = 'CollapsibleList';\n"]}
|