@hashicorp/mds-react 0.9.3 → 0.9.4
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/components/accordion/index.js +9 -0
- package/components/accordion/index.js.map +1 -0
- package/components/accordion/item/button.js +44 -0
- package/components/accordion/item/button.js.map +1 -0
- package/components/accordion/item/index.js +59 -0
- package/components/accordion/item/index.js.map +1 -0
- package/components/accordion/style.module.scss.js +24 -0
- package/components/accordion/style.module.scss.js.map +1 -0
- package/components/alert/alert.module.scss.js +29 -0
- package/components/alert/alert.module.scss.js.map +1 -0
- package/components/alert/icon.js +34 -0
- package/components/alert/icon.js.map +1 -0
- package/components/alert/index.js +97 -0
- package/components/alert/index.js.map +1 -0
- package/components/badge/index.js +50 -0
- package/components/badge/index.js.map +1 -0
- package/components/badge/style.module.scss.js +22 -0
- package/components/badge/style.module.scss.js.map +1 -0
- package/components/badge-count/index.js +29 -0
- package/components/badge-count/index.js.map +1 -0
- package/components/badge-count/style.module.scss.js +15 -0
- package/components/badge-count/style.module.scss.js.map +1 -0
- package/components/breadcrumbs/index.js +38 -0
- package/components/breadcrumbs/index.js.map +1 -0
- package/components/breadcrumbs/item/index.js +32 -0
- package/components/breadcrumbs/item/index.js.map +1 -0
- package/components/breadcrumbs/style.module.scss.js +27 -0
- package/components/breadcrumbs/style.module.scss.js.map +1 -0
- package/components/breadcrumbs/truncation-button/index.js +25 -0
- package/components/breadcrumbs/truncation-button/index.js.map +1 -0
- package/components/button/index.d.ts +2 -1
- package/components/button/index.js +119 -0
- package/components/button/index.js.map +1 -0
- package/components/button/styles.module.scss.js +32 -0
- package/components/button/styles.module.scss.js.map +1 -0
- package/components/card/card-thumbnail/card-thumbnail.module.css.js +8 -0
- package/components/card/card-thumbnail/card-thumbnail.module.css.js.map +1 -0
- package/components/card/card-thumbnail/index.js +23 -0
- package/components/card/card-thumbnail/index.js.map +1 -0
- package/components/card/index.d.ts +2 -1
- package/components/card/index.js +160 -0
- package/components/card/index.js.map +1 -0
- package/components/card/styles.module.css.js +29 -0
- package/components/card/styles.module.css.js.map +1 -0
- package/components/card/types.d.ts +1 -0
- package/components/code-block/code-block.module.scss.js +34 -0
- package/components/code-block/code-block.module.scss.js.map +1 -0
- package/components/code-block/code-lines/index.js +59 -0
- package/components/code-block/code-lines/index.js.map +1 -0
- package/components/code-block/code-lines/utils/split-html-into-lines.js +19 -0
- package/components/code-block/code-lines/utils/split-html-into-lines.js.map +1 -0
- package/components/code-block/code-lines/utils/split-jsx-into-lines.js +31 -0
- package/components/code-block/code-lines/utils/split-jsx-into-lines.js.map +1 -0
- package/components/code-block/hidden-copy-content/index.js +13 -0
- package/components/code-block/hidden-copy-content/index.js.map +1 -0
- package/components/code-block/index.js +88 -0
- package/components/code-block/index.js.map +1 -0
- package/components/code-block/utils/parse-highlighted-lines.js +39 -0
- package/components/code-block/utils/parse-highlighted-lines.js.map +1 -0
- package/components/code-block/utils/process-snippet.js +20 -0
- package/components/code-block/utils/process-snippet.js.map +1 -0
- package/components/code-block/utils/shellwords.js +33 -0
- package/components/code-block/utils/shellwords.js.map +1 -0
- package/components/combo-box-primitive/index.js +302 -0
- package/components/combo-box-primitive/index.js.map +1 -0
- package/components/dialog-primitive/dialog.module.scss.js +12 -0
- package/components/dialog-primitive/dialog.module.scss.js.map +1 -0
- package/components/dialog-primitive/index.js +15 -0
- package/components/dialog-primitive/index.js.map +1 -0
- package/components/disclosure-primitive/index.js +57 -0
- package/components/disclosure-primitive/index.js.map +1 -0
- package/components/disclosure-primitive/styles.module.css.js +7 -0
- package/components/disclosure-primitive/styles.module.css.js.map +1 -0
- package/components/disclosure-primitive/use-disclosure-primitive.js +17 -0
- package/components/disclosure-primitive/use-disclosure-primitive.js.map +1 -0
- package/components/dismiss-button/index.js +22 -0
- package/components/dismiss-button/index.js.map +1 -0
- package/components/dismiss-button/styles.module.scss.js +7 -0
- package/components/dismiss-button/styles.module.scss.js.map +1 -0
- package/components/dropdown/index.js +79 -0
- package/components/dropdown/index.js.map +1 -0
- package/components/dropdown/list-item/custom.js +9 -0
- package/components/dropdown/list-item/custom.js.map +1 -0
- package/components/dropdown/list-item/index.js +14 -0
- package/components/dropdown/list-item/index.js.map +1 -0
- package/components/dropdown/list-item/interactive.js +49 -0
- package/components/dropdown/list-item/interactive.js.map +1 -0
- package/components/dropdown/list-item/separator.js +17 -0
- package/components/dropdown/list-item/separator.js.map +1 -0
- package/components/dropdown/list-item/styles.module.css.js +26 -0
- package/components/dropdown/list-item/styles.module.css.js.map +1 -0
- package/components/dropdown/list-item/title.js +9 -0
- package/components/dropdown/list-item/title.js.map +1 -0
- package/components/dropdown/styles.module.css.js +24 -0
- package/components/dropdown/styles.module.css.js.map +1 -0
- package/components/dropdown/toggle-button/index.js +54 -0
- package/components/dropdown/toggle-button/index.js.map +1 -0
- package/components/dropdown/toggle-button/styles.module.scss.js +14 -0
- package/components/dropdown/toggle-button/styles.module.scss.js.map +1 -0
- package/components/flight-icon/flight-icon.module.css.js +12 -0
- package/components/flight-icon/flight-icon.module.css.js.map +1 -0
- package/components/flight-icon/index.js +58 -0
- package/components/flight-icon/index.js.map +1 -0
- package/components/form/checkbox/form-checkbox.module.css.js +8 -0
- package/components/form/checkbox/form-checkbox.module.css.js.map +1 -0
- package/components/form/checkbox/index.js +109 -0
- package/components/form/checkbox/index.js.map +1 -0
- package/components/form/error/form-error.module.css.js +14 -0
- package/components/form/error/form-error.module.css.js.map +1 -0
- package/components/form/error/index.js +22 -0
- package/components/form/error/index.js.map +1 -0
- package/components/form/field/form-field.module.css.js +17 -0
- package/components/form/field/form-field.module.css.js.map +1 -0
- package/components/form/field/index.js +46 -0
- package/components/form/field/index.js.map +1 -0
- package/components/form/fieldset/form-fieldset.module.css.js +19 -0
- package/components/form/fieldset/form-fieldset.module.css.js.map +1 -0
- package/components/form/fieldset/index.js +65 -0
- package/components/form/fieldset/index.js.map +1 -0
- package/components/form/file-input/form-file-input.module.scss.js +7 -0
- package/components/form/file-input/form-file-input.module.scss.js.map +1 -0
- package/components/form/file-input/index.js +68 -0
- package/components/form/file-input/index.js.map +1 -0
- package/components/form/helper-text/form-helper-text.module.css.js +7 -0
- package/components/form/helper-text/form-helper-text.module.css.js.map +1 -0
- package/components/form/helper-text/index.js +22 -0
- package/components/form/helper-text/index.js.map +1 -0
- package/components/form/indicator/form-indicator.module.css.js +8 -0
- package/components/form/indicator/form-indicator.module.css.js.map +1 -0
- package/components/form/indicator/index.js +23 -0
- package/components/form/indicator/index.js.map +1 -0
- package/components/form/label/form-label.module.css.js +10 -0
- package/components/form/label/form-label.module.css.js.map +1 -0
- package/components/form/label/index.js +33 -0
- package/components/form/label/index.js.map +1 -0
- package/components/form/legend/form-legend.module.css.js +10 -0
- package/components/form/legend/form-legend.module.css.js.map +1 -0
- package/components/form/legend/index.js +19 -0
- package/components/form/legend/index.js.map +1 -0
- package/components/form/radio/form-radio.module.scss.js +8 -0
- package/components/form/radio/form-radio.module.scss.js.map +1 -0
- package/components/form/radio/index.js +100 -0
- package/components/form/radio/index.js.map +1 -0
- package/components/form/radio-card/description.js +10 -0
- package/components/form/radio-card/description.js.map +1 -0
- package/components/form/radio-card/form-radio-card.module.css.js +30 -0
- package/components/form/radio-card/form-radio-card.module.css.js.map +1 -0
- package/components/form/radio-card/group.js +31 -0
- package/components/form/radio-card/group.js.map +1 -0
- package/components/form/radio-card/index.js +67 -0
- package/components/form/radio-card/index.js.map +1 -0
- package/components/form/radio-card/label.js +10 -0
- package/components/form/radio-card/label.js.map +1 -0
- package/components/form/select/form-select.module.css.js +14 -0
- package/components/form/select/form-select.module.css.js.map +1 -0
- package/components/form/select/index.js +79 -0
- package/components/form/select/index.js.map +1 -0
- package/components/form/super-select/form-super-select.module.css.js +22 -0
- package/components/form/super-select/form-super-select.module.css.js.map +1 -0
- package/components/form/super-select/index.js +170 -0
- package/components/form/super-select/index.js.map +1 -0
- package/components/form/text-input/index.js +91 -0
- package/components/form/text-input/index.js.map +1 -0
- package/components/form/text-input/styles.module.css.js +15 -0
- package/components/form/text-input/styles.module.css.js.map +1 -0
- package/components/form/textarea/form-textarea.module.css.js +14 -0
- package/components/form/textarea/form-textarea.module.css.js.map +1 -0
- package/components/form/textarea/index.js +74 -0
- package/components/form/textarea/index.js.map +1 -0
- package/components/form/toggle/form-toggle.module.scss.js +12 -0
- package/components/form/toggle/form-toggle.module.scss.js.map +1 -0
- package/components/form/toggle/index.js +102 -0
- package/components/form/toggle/index.js.map +1 -0
- package/components/hds/wrappers/tooltip.js +51 -0
- package/components/hds/wrappers/tooltip.js.map +1 -0
- package/components/icon-tile/index.js +50 -0
- package/components/icon-tile/index.js.map +1 -0
- package/components/icon-tile/style.module.scss.js +29 -0
- package/components/icon-tile/style.module.scss.js.map +1 -0
- package/components/index.d.ts +1 -1
- package/components/index.js +116 -73
- package/components/index.js.map +1 -1
- package/components/inline-link/index.js +33 -0
- package/components/inline-link/index.js.map +1 -0
- package/components/inline-link/inline-link.module.css.js +11 -0
- package/components/inline-link/inline-link.module.css.js.map +1 -0
- package/components/interactive/index.js +59 -0
- package/components/interactive/index.js.map +1 -0
- package/components/legacy-button/index.js +65 -0
- package/components/legacy-button/index.js.map +1 -0
- package/components/legacy-button/utils.js +39 -0
- package/components/legacy-button/utils.js.map +1 -0
- package/components/menu-primitive/index.js +68 -0
- package/components/menu-primitive/index.js.map +1 -0
- package/components/menu-primitive/styles.module.css.js +12 -0
- package/components/menu-primitive/styles.module.css.js.map +1 -0
- package/components/menu-primitive/use-menu-primitive.js +17 -0
- package/components/menu-primitive/use-menu-primitive.js.map +1 -0
- package/components/modal/index.js +61 -0
- package/components/modal/index.js.map +1 -0
- package/components/modal/modal.module.css.js +8 -0
- package/components/modal/modal.module.css.js.map +1 -0
- package/components/modal/use-modal.js +17 -0
- package/components/modal/use-modal.js.map +1 -0
- package/components/separator/index.js +15 -0
- package/components/separator/index.js.map +1 -0
- package/components/separator/separator.module.css.js +10 -0
- package/components/separator/separator.module.css.js.map +1 -0
- package/components/standalone-link/index.js +54 -0
- package/components/standalone-link/index.js.map +1 -0
- package/components/standalone-link/styles.module.scss.js +17 -0
- package/components/standalone-link/styles.module.scss.js.map +1 -0
- package/components/table/index.js +52 -0
- package/components/table/index.js.map +1 -0
- package/components/table/table.module.scss.js +33 -0
- package/components/table/table.module.scss.js.map +1 -0
- package/components/table/td.js +28 -0
- package/components/table/td.js.map +1 -0
- package/components/table/th-button-tooltip.js +24 -0
- package/components/table/th-button-tooltip.js.map +1 -0
- package/components/table/th.js +43 -0
- package/components/table/th.js.map +1 -0
- package/components/table/tr.js +9 -0
- package/components/table/tr.js.map +1 -0
- package/components/table/utils.js +28 -0
- package/components/table/utils.js.map +1 -0
- package/components/tabs/index.js +117 -0
- package/components/tabs/index.js.map +1 -0
- package/components/tabs/tab-panel.js +35 -0
- package/components/tabs/tab-panel.js.map +1 -0
- package/components/tabs/tab.js +70 -0
- package/components/tabs/tab.js.map +1 -0
- package/components/tabs/tabs.module.scss.js +22 -0
- package/components/tabs/tabs.module.scss.js.map +1 -0
- package/components/tabs/use-tabs-context.js +16 -0
- package/components/tabs/use-tabs-context.js.map +1 -0
- package/components/text/index.js +112 -0
- package/components/text/index.js.map +1 -0
- package/components/text/style.module.scss.js +9 -0
- package/components/text/style.module.scss.js.map +1 -0
- package/components/visualizations/bar-chart/horizontal-chart/dataset-value/index.js +62 -0
- package/components/visualizations/bar-chart/horizontal-chart/dataset-value/index.js.map +1 -0
- package/components/visualizations/bar-chart/horizontal-chart/dataset-value/style.module.css.js +20 -0
- package/components/visualizations/bar-chart/horizontal-chart/dataset-value/style.module.css.js.map +1 -0
- package/components/visualizations/bar-chart/horizontal-chart/index.js +104 -0
- package/components/visualizations/bar-chart/horizontal-chart/index.js.map +1 -0
- package/components/visualizations/bar-chart/horizontal-chart/legend/index.js +13 -0
- package/components/visualizations/bar-chart/horizontal-chart/legend/index.js.map +1 -0
- package/components/visualizations/bar-chart/horizontal-chart/legend/style.module.css.js +14 -0
- package/components/visualizations/bar-chart/horizontal-chart/legend/style.module.css.js.map +1 -0
- package/components/visualizations/bar-chart/horizontal-chart/style.module.css.js +28 -0
- package/components/visualizations/bar-chart/horizontal-chart/style.module.css.js.map +1 -0
- package/components/visualizations/bar-chart/index.js +37 -0
- package/components/visualizations/bar-chart/index.js.map +1 -0
- package/components/visualizations/bar-chart/style.module.css.js +12 -0
- package/components/visualizations/bar-chart/style.module.css.js.map +1 -0
- package/components/visualizations/donut-chart/components/arc-tooltip/index.js +14 -0
- package/components/visualizations/donut-chart/components/arc-tooltip/index.js.map +1 -0
- package/components/visualizations/donut-chart/components/arc-tooltip/styles.module.css.js +10 -0
- package/components/visualizations/donut-chart/components/arc-tooltip/styles.module.css.js.map +1 -0
- package/components/visualizations/donut-chart/components/external-arc-label/index.js +58 -0
- package/components/visualizations/donut-chart/components/external-arc-label/index.js.map +1 -0
- package/components/visualizations/donut-chart/components/external-arc-label/styles.module.css.js +16 -0
- package/components/visualizations/donut-chart/components/external-arc-label/styles.module.css.js.map +1 -0
- package/components/visualizations/donut-chart/components/internal-arc-label/index.js +42 -0
- package/components/visualizations/donut-chart/components/internal-arc-label/index.js.map +1 -0
- package/components/visualizations/donut-chart/components/internal-arc-label/styles.module.css.js +14 -0
- package/components/visualizations/donut-chart/components/internal-arc-label/styles.module.css.js.map +1 -0
- package/components/visualizations/donut-chart/index.js +90 -0
- package/components/visualizations/donut-chart/index.js.map +1 -0
- package/components/visualizations/donut-chart/styles.module.css.js +20 -0
- package/components/visualizations/donut-chart/styles.module.css.js.map +1 -0
- package/hooks/use-media-query/index.js +16 -0
- package/hooks/use-media-query/index.js.map +1 -0
- package/index.js +155 -101
- package/index.js.map +1 -1
- package/package.json +1 -1
- package/patterns/card/newsroom-card/index.js +26 -0
- package/patterns/card/newsroom-card/index.js.map +1 -0
- package/patterns/card/newsroom-card/style.module.css.js +8 -0
- package/patterns/card/newsroom-card/style.module.css.js.map +1 -0
- package/patterns/card/partner-card/index.js +42 -0
- package/patterns/card/partner-card/index.js.map +1 -0
- package/patterns/card/partner-card/style.module.css.js +12 -0
- package/patterns/card/partner-card/style.module.css.js.map +1 -0
- package/patterns/card/person-card/index.js +52 -0
- package/patterns/card/person-card/index.js.map +1 -0
- package/patterns/card/person-card/style.module.css.js +12 -0
- package/patterns/card/person-card/style.module.css.js.map +1 -0
- package/patterns/card/primitives.js +77 -0
- package/patterns/card/primitives.js.map +1 -0
- package/patterns/card/promo-card/index.js +36 -0
- package/patterns/card/promo-card/index.js.map +1 -0
- package/patterns/card/resource-card/index.js +26 -0
- package/patterns/card/resource-card/index.js.map +1 -0
- package/patterns/card/style.module.css.js +30 -0
- package/patterns/card/style.module.css.js.map +1 -0
- package/patterns/card/thumbnails/index.js +25 -0
- package/patterns/card/thumbnails/index.js.map +1 -0
- package/patterns/card/unified-card/index.js +37 -0
- package/patterns/card/unified-card/index.js.map +1 -0
- package/patterns/copy-button/clipboard.js +78 -0
- package/patterns/copy-button/clipboard.js.map +1 -0
- package/patterns/copy-button/index.js +57 -0
- package/patterns/copy-button/index.js.map +1 -0
- package/patterns/copy-button/style.module.css.js +13 -0
- package/patterns/copy-button/style.module.css.js.map +1 -0
- package/patterns/index.js +32 -22
- package/patterns/index.js.map +1 -1
- package/patterns/layout/index.js +47 -0
- package/patterns/layout/index.js.map +1 -0
- package/patterns/layout/layout.module.css.js +20 -0
- package/patterns/layout/layout.module.css.js.map +1 -0
- package/patterns/product-badge/index.js +22 -0
- package/patterns/product-badge/index.js.map +1 -0
- package/patterns/product-badge/style.module.css.js +8 -0
- package/patterns/product-badge/style.module.css.js.map +1 -0
- package/patterns/product-logo/index.js +130 -0
- package/patterns/product-logo/index.js.map +1 -0
- package/patterns/product-logo/product-logo.module.css.js +13 -0
- package/patterns/product-logo/product-logo.module.css.js.map +1 -0
- package/patterns/related-content/index.js +65 -0
- package/patterns/related-content/index.js.map +1 -0
- package/patterns/related-content/style.module.css.js +22 -0
- package/patterns/related-content/style.module.css.js.map +1 -0
- package/style.css +1 -1
- package/utils/get-contrast-yiq.js +13 -0
- package/utils/get-contrast-yiq.js.map +1 -0
- package/utils/hooks/use-screen-size.js +10 -0
- package/utils/hooks/use-screen-size.js.map +1 -0
- package/utils/i18n/constants/index.js +98 -0
- package/utils/i18n/constants/index.js.map +1 -0
- package/utils/i18n/helpers/locale-provider.js +9 -0
- package/utils/i18n/helpers/locale-provider.js.map +1 -0
- package/utils/i18n/helpers/to-smart-sentence-case.js +12 -0
- package/utils/i18n/helpers/to-smart-sentence-case.js.map +1 -0
- package/utils/i18n/helpers/to-smart-title-case.js +10 -0
- package/utils/i18n/helpers/to-smart-title-case.js.map +1 -0
- package/utils/i18n/helpers/use-locale.js +14 -0
- package/utils/i18n/helpers/use-locale.js.map +1 -0
- package/utils/i18n/index.js +41 -0
- package/utils/i18n/index.js.map +1 -0
- package/utils/i18n/index2.js +33 -0
- package/utils/i18n/index2.js.map +1 -0
- package/utils/index.js +7 -7
- package/utils/make-normalizer/index.js +34 -0
- package/utils/make-normalizer/index.js.map +1 -0
- package/{index-DBjAbGt7.js → utils/mds-context/index.js} +20 -19
- package/utils/mds-context/index.js.map +1 -0
- package/index-B9mPJh9w.js +0 -579
- package/index-B9mPJh9w.js.map +0 -1
- package/index-BHBlMMNF.js +0 -16
- package/index-BHBlMMNF.js.map +0 -1
- package/index-C4GBbW3N.js +0 -3567
- package/index-C4GBbW3N.js.map +0 -1
- package/index-DBjAbGt7.js.map +0 -1
- package/index-WkGIywHj.js +0 -767
- package/index-WkGIywHj.js.map +0 -1
- package/use-screen-size-BOnkX_K-.js +0 -9
- package/use-screen-size-BOnkX_K-.js.map +0 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/components/icon-tile/index.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport type { FlightIconSize } from '../flight-icon'\nimport { FlightIcon } from '../flight-icon'\nimport type { HTMLAttributes } from 'react'\nimport s from './style.module.scss'\n\ntype BaseProps = {\n\tsize: 'small' | 'medium' | 'large'\n\ticonSecondary?: string\n\tcolor?:\n\t\t| 'neutral'\n\t\t| 'boundary'\n\t\t| 'consul'\n\t\t| 'nomad'\n\t\t| 'packer'\n\t\t| 'terraform'\n\t\t| 'vagrant'\n\t\t| 'vault'\n\t\t| 'vault-secrets'\n\t\t| 'waypoint'\n} & Omit<HTMLAttributes<HTMLDivElement>, 'className' | 'style'>\n\ntype WithLogo = {\n\tlogo:\n\t\t| 'hcp'\n\t\t| 'boundary'\n\t\t| 'consul'\n\t\t| 'nomad'\n\t\t| 'packer'\n\t\t| 'terraform'\n\t\t| 'vagrant'\n\t\t| 'vault'\n\t\t| 'vault-secrets'\n\t\t| 'waypoint'\n\ticon?: never\n}\n\ntype WithIcon = {\n\ticon: string\n\tlogo?: never\n}\n\ntype IconTileProps = BaseProps & (WithLogo | WithIcon)\n\nconst EXTRA_ICON_SIZE_MAP = {\n\tsmall: 12,\n\tmedium: 16,\n\tlarge: 16,\n} as const satisfies Record<'small' | 'medium' | 'large', FlightIconSize>\n\nconst IconTile = ({\n\tsize = 'medium',\n\tlogo,\n\ticon,\n\ticonSecondary,\n\tcolor = 'neutral',\n\t...rest\n}: IconTileProps) => {\n\tconst iconName = logo ? `${logo}-color` : icon\n\n\tif (iconName) {\n\t\tconst iconSize = size === 'small' ? 16 : 24\n\t\tconst entity = logo ? 'logo' : 'icon'\n\t\tconst colorUse = logo ? logo : color\n\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclassName={classNames(\n\t\t\t\t\ts['icon-tile'],\n\t\t\t\t\ts[`type-${entity}`],\n\t\t\t\t\ts[`size-${size}`],\n\t\t\t\t\ts[`color-${colorUse}`]\n\t\t\t\t)}\n\t\t\t\taria-hidden=\"true\"\n\t\t\t\t{...rest}\n\t\t\t>\n\t\t\t\t<div className={logo ? s.logo : s.icon}>\n\t\t\t\t\t<FlightIcon name={iconName} size={iconSize} stretched />\n\t\t\t\t</div>\n\t\t\t\t{iconSecondary && (\n\t\t\t\t\t<div className={s.extra}>\n\t\t\t\t\t\t<FlightIcon\n\t\t\t\t\t\t\tname={iconSecondary}\n\t\t\t\t\t\t\tsize={EXTRA_ICON_SIZE_MAP[size]}\n\t\t\t\t\t\t\tcolor=\"var(--mds-color-foreground-strong)\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t)\n\t}\n}\n\nIconTile.displayName = 'IconTile'\n\nexport type { IconTileProps }\nexport { IconTile }\n"],"names":["EXTRA_ICON_SIZE_MAP","IconTile","size","logo","icon","iconSecondary","color","rest","iconName","iconSize","entity","colorUse","jsxs","classNames","s","jsx","FlightIcon"],"mappings":";;;;AA4CA,MAAMA,IAAsB;AAAA,EAC3B,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,OAAO;AACR,GAEMC,IAAW,CAAC;AAAA,EACjB,MAAAC,IAAO;AAAA,EACP,MAAAC;AAAA,EACA,MAAAC;AAAA,EACA,eAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,GAAGC;AACJ,MAAqB;AACpB,QAAMC,IAAWL,IAAO,GAAGA,CAAI,WAAWC;AAE1C,MAAII,GAAU;AACb,UAAMC,IAAWP,MAAS,UAAU,KAAK,IACnCQ,IAASP,IAAO,SAAS,QACzBQ,IAAWR,KAAcG;AAE/B,WACC,gBAAAM;AAAA,MAAC;AAAA,MAAA;AAAA,QACA,WAAWC;AAAA,UACVC,EAAE,WAAW;AAAA,UACbA,EAAE,QAAQJ,CAAM,EAAE;AAAA,UAClBI,EAAE,QAAQZ,CAAI,EAAE;AAAA,UAChBY,EAAE,SAASH,CAAQ,EAAE;AAAA,QAAA;AAAA,QAEtB,eAAY;AAAA,QACX,GAAGJ;AAAA,QAEJ,UAAA;AAAA,UAAA,gBAAAQ,EAAC,OAAA,EAAI,WAAWZ,IAAOW,EAAE,OAAOA,EAAE,MACjC,UAAA,gBAAAC,EAACC,GAAA,EAAW,MAAMR,GAAU,MAAMC,GAAU,WAAS,IAAC,GACvD;AAAA,UACCJ,KACA,gBAAAU,EAAC,OAAA,EAAI,WAAWD,EAAE,OACjB,UAAA,gBAAAC;AAAA,YAACC;AAAA,YAAA;AAAA,cACA,MAAMX;AAAA,cACN,MAAML,EAAoBE,CAAI;AAAA,cAC9B,OAAM;AAAA,YAAA;AAAA,UAAA,EACP,CACD;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAIJ;AACD;AAEAD,EAAS,cAAc;"}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
const o = "icon__aQOfk", r = "logo__3zBXv", l = "extra__5VSha", c = {
|
|
2
|
+
"icon-tile": "icon-tile__8Lxip",
|
|
3
|
+
icon: o,
|
|
4
|
+
logo: r,
|
|
5
|
+
extra: l,
|
|
6
|
+
"size-small": "size-small__eKjTy",
|
|
7
|
+
"size-medium": "size-medium__Cpd2c",
|
|
8
|
+
"size-large": "size-large__0nIKA",
|
|
9
|
+
"type-logo": "type-logo__bXQnG",
|
|
10
|
+
"type-icon": "type-icon__DoyiK",
|
|
11
|
+
"color-neutral": "color-neutral__s-i4y",
|
|
12
|
+
"color-boundary": "color-boundary__TWXib",
|
|
13
|
+
"color-consul": "color-consul__qHXGr",
|
|
14
|
+
"color-hcp": "color-hcp__T1Cpx",
|
|
15
|
+
"color-nomad": "color-nomad__OPKVc",
|
|
16
|
+
"color-packer": "color-packer__VbjYn",
|
|
17
|
+
"color-terraform": "color-terraform__CzLAd",
|
|
18
|
+
"color-vagrant": "color-vagrant__GMAgE",
|
|
19
|
+
"color-vault": "color-vault__yHn5Z",
|
|
20
|
+
"color-vault-secrets": "color-vault-secrets__GiX0y",
|
|
21
|
+
"color-waypoint": "color-waypoint__YASrb"
|
|
22
|
+
};
|
|
23
|
+
export {
|
|
24
|
+
c as default,
|
|
25
|
+
l as extra,
|
|
26
|
+
o as icon,
|
|
27
|
+
r as logo
|
|
28
|
+
};
|
|
29
|
+
//# sourceMappingURL=style.module.scss.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"style.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;"}
|
package/components/index.d.ts
CHANGED
|
@@ -11,7 +11,7 @@ export { Breadcrumbs } from './breadcrumbs';
|
|
|
11
11
|
export type { ButtonProps, ButtonColor, ButtonIconPosition, ButtonSize, } from './button';
|
|
12
12
|
export { Button, BUTTON_COLORS, BUTTON_ICON_POSITIONS, BUTTON_SIZES, } from './button';
|
|
13
13
|
export type { CardProps, CardThumbnailProps } from './card/types';
|
|
14
|
-
export { Card } from './card';
|
|
14
|
+
export { Card, CardContent } from './card';
|
|
15
15
|
export type { CodeBlockProps } from './code-block';
|
|
16
16
|
export { CodeBlock } from './code-block';
|
|
17
17
|
export { DisclosurePrimitive } from './disclosure-primitive';
|
package/components/index.js
CHANGED
|
@@ -1,77 +1,120 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
1
|
+
import { Accordion as e } from "./accordion/index.js";
|
|
2
|
+
import { BADGE_COLORS as p, BADGE_SIZES as x, BADGE_TYPES as m, Badge as f } from "./badge/index.js";
|
|
3
|
+
import { BadgeCount as n } from "./badge-count/index.js";
|
|
4
|
+
import { Alert as a, AlertActions as d, AlertButton as T, AlertStandaloneLink as S } from "./alert/index.js";
|
|
5
|
+
import { Breadcrumbs as c } from "./breadcrumbs/index.js";
|
|
6
|
+
import { BUTTON_COLORS as C, BUTTON_ICON_POSITIONS as O, BUTTON_SIZES as u, Button as B } from "./button/index.js";
|
|
7
|
+
import { Card as s, CardContent as _ } from "./card/index.js";
|
|
8
|
+
import { CodeBlock as L } from "./code-block/index.js";
|
|
9
|
+
import { DisclosurePrimitive as F } from "./disclosure-primitive/index.js";
|
|
10
|
+
import { useDisclosurePrimitive as G } from "./disclosure-primitive/use-disclosure-primitive.js";
|
|
11
|
+
import { Dropdown as b } from "./dropdown/index.js";
|
|
12
|
+
import { FLIGHT_ICON_SIZES as h, FlightIcon as P } from "./flight-icon/index.js";
|
|
13
|
+
import { CheckboxBase as Z, CheckboxField as v, CheckboxGroup as K } from "./form/checkbox/index.js";
|
|
14
|
+
import { Error as U } from "./form/error/index.js";
|
|
15
|
+
import { Field as w } from "./form/field/index.js";
|
|
16
|
+
import { Fieldset as z } from "./form/fieldset/index.js";
|
|
17
|
+
import { FileInputBase as W, FileInputField as Y } from "./form/file-input/index.js";
|
|
18
|
+
import { HelperText as q } from "./form/helper-text/index.js";
|
|
19
|
+
import { Indicator as Q } from "./form/indicator/index.js";
|
|
20
|
+
import { Label as oo } from "./form/label/index.js";
|
|
21
|
+
import { Legend as eo } from "./form/legend/index.js";
|
|
22
|
+
import { RadioBase as po, RadioField as xo, RadioGroup as mo } from "./form/radio/index.js";
|
|
23
|
+
import { RadioCard as io } from "./form/radio-card/index.js";
|
|
24
|
+
import { SelectField as lo } from "./form/select/index.js";
|
|
25
|
+
import { SuperSelectField as To } from "./form/super-select/index.js";
|
|
26
|
+
import { TextInput as Io, TextInputBase as co } from "./form/text-input/index.js";
|
|
27
|
+
import { TextAreaField as Co } from "./form/textarea/index.js";
|
|
28
|
+
import { ToggleBase as uo, ToggleField as Bo, ToggleGroup as go } from "./form/toggle/index.js";
|
|
29
|
+
import { IconTile as _o } from "./icon-tile/index.js";
|
|
30
|
+
import { InlineLink as Lo } from "./inline-link/index.js";
|
|
31
|
+
import { MDSButton as Fo } from "./legacy-button/index.js";
|
|
32
|
+
import { ModalProvider as Go } from "./modal/index.js";
|
|
33
|
+
import { Separator as bo } from "./separator/index.js";
|
|
34
|
+
import { STANDALONE_LINK_COLORS as ho, STANDALONE_LINK_ICON_POSITIONS as Po, STANDALONE_LINK_SIZES as Ho, StandaloneLink as Zo } from "./standalone-link/index.js";
|
|
35
|
+
import { Table as Ko } from "./table/index.js";
|
|
36
|
+
import { getDensity as Uo, getHorizontalAlignment as Xo, getScope as wo, getVerticalAlignment as yo } from "./table/utils.js";
|
|
37
|
+
import { Tabs as Vo } from "./tabs/index.js";
|
|
38
|
+
import { useTabsContext as Yo } from "./tabs/use-tabs-context.js";
|
|
39
|
+
import { TEXT_COLORS as qo, TEXT_WEIGHTS as Jo, Text as Qo } from "./text/index.js";
|
|
40
|
+
import { BarChart as or } from "./visualizations/bar-chart/index.js";
|
|
41
|
+
import { DonutChart as er } from "./visualizations/donut-chart/index.js";
|
|
42
|
+
import { AccordionContent as pr, AccordionItem as xr, AccordionToggle as mr } from "./accordion/item/index.js";
|
|
43
|
+
import { RadioCardGroup as ir } from "./form/radio-card/group.js";
|
|
44
|
+
import { useModal as lr } from "./modal/use-modal.js";
|
|
3
45
|
export {
|
|
4
46
|
e as Accordion,
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
47
|
+
pr as AccordionContent,
|
|
48
|
+
xr as AccordionItem,
|
|
49
|
+
mr as AccordionToggle,
|
|
50
|
+
a as Alert,
|
|
51
|
+
d as AlertActions,
|
|
52
|
+
T as AlertButton,
|
|
53
|
+
S as AlertStandaloneLink,
|
|
54
|
+
p as BADGE_COLORS,
|
|
55
|
+
x as BADGE_SIZES,
|
|
56
|
+
m as BADGE_TYPES,
|
|
57
|
+
C as BUTTON_COLORS,
|
|
58
|
+
O as BUTTON_ICON_POSITIONS,
|
|
59
|
+
u as BUTTON_SIZES,
|
|
60
|
+
f as Badge,
|
|
61
|
+
n as BadgeCount,
|
|
62
|
+
or as BarChart,
|
|
63
|
+
c as Breadcrumbs,
|
|
64
|
+
B as Button,
|
|
65
|
+
s as Card,
|
|
66
|
+
_ as CardContent,
|
|
67
|
+
Z as CheckboxBase,
|
|
68
|
+
v as CheckboxField,
|
|
69
|
+
K as CheckboxGroup,
|
|
70
|
+
L as CodeBlock,
|
|
71
|
+
F as DisclosurePrimitive,
|
|
72
|
+
er as DonutChart,
|
|
73
|
+
b as Dropdown,
|
|
74
|
+
U as Error,
|
|
75
|
+
h as FLIGHT_ICON_SIZES,
|
|
76
|
+
w as Field,
|
|
77
|
+
z as Fieldset,
|
|
78
|
+
W as FileInputBase,
|
|
79
|
+
Y as FileInputField,
|
|
80
|
+
P as FlightIcon,
|
|
81
|
+
q as HelperText,
|
|
82
|
+
_o as IconTile,
|
|
83
|
+
Q as Indicator,
|
|
84
|
+
Lo as InlineLink,
|
|
85
|
+
oo as Label,
|
|
86
|
+
eo as Legend,
|
|
87
|
+
Fo as MDSButton,
|
|
88
|
+
Go as ModalProvider,
|
|
89
|
+
po as RadioBase,
|
|
90
|
+
io as RadioCard,
|
|
91
|
+
ir as RadioCardGroup,
|
|
92
|
+
xo as RadioField,
|
|
93
|
+
mo as RadioGroup,
|
|
94
|
+
ho as STANDALONE_LINK_COLORS,
|
|
95
|
+
Po as STANDALONE_LINK_ICON_POSITIONS,
|
|
96
|
+
Ho as STANDALONE_LINK_SIZES,
|
|
97
|
+
lo as SelectField,
|
|
98
|
+
bo as Separator,
|
|
99
|
+
Zo as StandaloneLink,
|
|
100
|
+
To as SuperSelectField,
|
|
101
|
+
qo as TEXT_COLORS,
|
|
102
|
+
Jo as TEXT_WEIGHTS,
|
|
103
|
+
Ko as Table,
|
|
104
|
+
Vo as Tabs,
|
|
105
|
+
Qo as Text,
|
|
106
|
+
Co as TextAreaField,
|
|
107
|
+
Io as TextInput,
|
|
108
|
+
co as TextInputBase,
|
|
109
|
+
uo as ToggleBase,
|
|
110
|
+
Bo as ToggleField,
|
|
111
|
+
go as ToggleGroup,
|
|
112
|
+
Uo as getDensity,
|
|
113
|
+
Xo as getHorizontalAlignment,
|
|
114
|
+
wo as getScope,
|
|
115
|
+
yo as getVerticalAlignment,
|
|
116
|
+
G as useDisclosurePrimitive,
|
|
117
|
+
lr as useModal,
|
|
118
|
+
Yo as useTabsContext
|
|
76
119
|
};
|
|
77
120
|
//# sourceMappingURL=index.js.map
|
package/components/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { jsxs as c, jsx as p } from "react/jsx-runtime";
|
|
2
|
+
import f from "classnames";
|
|
3
|
+
import { Interactive as I } from "../interactive/index.js";
|
|
4
|
+
import i from "./inline-link.module.css.js";
|
|
5
|
+
import { FlightIcon as d } from "../flight-icon/index.js";
|
|
6
|
+
const g = ({
|
|
7
|
+
text: m,
|
|
8
|
+
color: o = "primary",
|
|
9
|
+
icon: r,
|
|
10
|
+
iconPosition: e = "trailing",
|
|
11
|
+
className: s,
|
|
12
|
+
isHrefExternal: t,
|
|
13
|
+
...a
|
|
14
|
+
}) => {
|
|
15
|
+
const l = r || !t ? r : "external-link", n = l && /* @__PURE__ */ p(d, { name: l, size: 16, className: i.icon });
|
|
16
|
+
return /* @__PURE__ */ c(
|
|
17
|
+
I,
|
|
18
|
+
{
|
|
19
|
+
className: f(i["link-inline"], i[`color-${o}`], s),
|
|
20
|
+
...a,
|
|
21
|
+
children: [
|
|
22
|
+
n && e === "leading" && n,
|
|
23
|
+
m,
|
|
24
|
+
n && e === "trailing" && n
|
|
25
|
+
]
|
|
26
|
+
}
|
|
27
|
+
);
|
|
28
|
+
};
|
|
29
|
+
g.displayName = "InlineLink";
|
|
30
|
+
export {
|
|
31
|
+
g as InlineLink
|
|
32
|
+
};
|
|
33
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/components/inline-link/index.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport { Interactive } from '../interactive'\nimport s from './inline-link.module.css'\nimport type { FlightIconName } from '../flight-icon'\nimport { FlightIcon } from '../flight-icon'\n\ninterface InlineLinkProps {\n\t/**\n\t * There are two available colors for an `<InlineLink />`: primary and secondary.\n\t */\n\tcolor?: 'primary' | 'secondary'\n\t/**\n\t * Use this parameter to show an icon.\n\t */\n\ticon?: FlightIconName\n\t/**\n\t * Positions the icon before or after the text.\n\t */\n\ticonPosition?: 'leading' | 'trailing'\n\t/**\n\t * URL parameter that’s passed down to the `<a>` element.\n\t */\n\thref: string\n\t/**\n\t * Controls if the <a> link is external. For security reasons, we add the target=\"_blank\" and rel=\"noopener noreferrer\" attributes to it by default.\n\t * default: `false`\n\t */\n\tisHrefExternal?: boolean\n\t/**\n\t * The content of the <a> HTML element.\n\t */\n\ttext: string\n\t/**\n\t * Optional class name to add to the component.\n\t */\n\tclassName?: string\n\tprefetch?: boolean\n\tlocale?: string\n}\n\nconst InlineLink = ({\n\ttext,\n\tcolor = 'primary',\n\ticon,\n\ticonPosition = 'trailing',\n\tclassName,\n\tisHrefExternal,\n\t...props\n}: InlineLinkProps) => {\n\tconst resolvedIcon = icon || !isHrefExternal ? icon : 'external-link'\n\tconst iconElement = resolvedIcon && (\n\t\t<FlightIcon name={resolvedIcon} size={16} className={s.icon} />\n\t)\n\n\treturn (\n\t\t<Interactive\n\t\t\tclassName={classNames(s['link-inline'], s[`color-${color}`], className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{iconElement && iconPosition === 'leading' && iconElement}\n\t\t\t{text}\n\t\t\t{iconElement && iconPosition === 'trailing' && iconElement}\n\t\t</Interactive>\n\t)\n}\n\nInlineLink.displayName = 'InlineLink'\n\nexport type { InlineLinkProps }\nexport { InlineLink }\n"],"names":["InlineLink","text","color","icon","iconPosition","className","isHrefExternal","props","resolvedIcon","iconElement","jsx","FlightIcon","s","jsxs","Interactive","classNames"],"mappings":";;;;;AAwCA,MAAMA,IAAa,CAAC;AAAA,EACnB,MAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,MAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,WAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,GAAGC;AACJ,MAAuB;AACtB,QAAMC,IAAeL,KAAQ,CAACG,IAAiBH,IAAO,iBAChDM,IAAcD,KACnB,gBAAAE,EAACC,GAAA,EAAW,MAAMH,GAAc,MAAM,IAAI,WAAWI,EAAE,KAAA,CAAM;AAG9D,SACC,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACA,WAAWC,EAAWH,EAAE,aAAa,GAAGA,EAAE,SAASV,CAAK,EAAE,GAAGG,CAAS;AAAA,MACrE,GAAGE;AAAA,MAEH,UAAA;AAAA,QAAAE,KAAeL,MAAiB,aAAaK;AAAA,QAC7CR;AAAA,QACAQ,KAAeL,MAAiB,cAAcK;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGlD;AAEAT,EAAW,cAAc;"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
const o = "icon__CPQmv", n = {
|
|
2
|
+
"link-inline": "link-inline__Wl8cA",
|
|
3
|
+
"color-primary": "color-primary__XlogH",
|
|
4
|
+
"color-secondary": "color-secondary__sf-Wg",
|
|
5
|
+
icon: o
|
|
6
|
+
};
|
|
7
|
+
export {
|
|
8
|
+
n as default,
|
|
9
|
+
o as icon
|
|
10
|
+
};
|
|
11
|
+
//# sourceMappingURL=inline-link.module.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"inline-link.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as c } from "react/jsx-runtime";
|
|
3
|
+
import { forwardRef as f } from "react";
|
|
4
|
+
import { useMDSLink as l } from "../../utils/mds-context/index.js";
|
|
5
|
+
const p = f((r, e) => {
|
|
6
|
+
const t = l(), {
|
|
7
|
+
href: i,
|
|
8
|
+
className: o,
|
|
9
|
+
isHrefExternal: n,
|
|
10
|
+
onClick: s,
|
|
11
|
+
children: a,
|
|
12
|
+
locale: d,
|
|
13
|
+
...u
|
|
14
|
+
} = r;
|
|
15
|
+
return i ? /* @__PURE__ */ c(
|
|
16
|
+
t,
|
|
17
|
+
{
|
|
18
|
+
className: o,
|
|
19
|
+
target: n ? "_blank" : void 0,
|
|
20
|
+
rel: n ? "noopener noreferrer" : void 0,
|
|
21
|
+
onClick: s,
|
|
22
|
+
...g(i, d, n),
|
|
23
|
+
...u,
|
|
24
|
+
ref: e,
|
|
25
|
+
children: a
|
|
26
|
+
}
|
|
27
|
+
) : /* @__PURE__ */ c(
|
|
28
|
+
"button",
|
|
29
|
+
{
|
|
30
|
+
type: "button",
|
|
31
|
+
className: o,
|
|
32
|
+
onClick: s,
|
|
33
|
+
...u,
|
|
34
|
+
ref: e,
|
|
35
|
+
children: a
|
|
36
|
+
}
|
|
37
|
+
);
|
|
38
|
+
});
|
|
39
|
+
p.displayName = "Interactive";
|
|
40
|
+
const g = (r, e, t) => t ? {
|
|
41
|
+
href: r,
|
|
42
|
+
hrefLang: void 0
|
|
43
|
+
} : ["en", "de", "es", "fr", "ja", "ko", "pt", "id"].includes(
|
|
44
|
+
r.substring(1, 3)
|
|
45
|
+
) ? {
|
|
46
|
+
href: r,
|
|
47
|
+
hrefLang: r.substring(1, 3)
|
|
48
|
+
} : r.startsWith("/") && e ? {
|
|
49
|
+
href: `/${e}${r}`,
|
|
50
|
+
hrefLang: e
|
|
51
|
+
} : {
|
|
52
|
+
href: r,
|
|
53
|
+
hrefLang: void 0
|
|
54
|
+
};
|
|
55
|
+
export {
|
|
56
|
+
p as Interactive,
|
|
57
|
+
g as getLocalizedLinkProps
|
|
58
|
+
};
|
|
59
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/components/interactive/index.tsx"],"sourcesContent":["'use client'\n\nimport { forwardRef, type ForwardRefExoticComponent } from 'react'\nimport type { ButtonHTMLAttributes, MouseEventHandler } from 'react'\nimport { useMDSLink } from '../../utils/mds-context'\n\ninterface InteractiveProps extends React.HTMLAttributes<HTMLElement> {\n\tisHrefExternal?: boolean\n\thref?: string\n\tonClick?: MouseEventHandler\n\ttype?: ButtonHTMLAttributes<HTMLButtonElement>['type']\n\tprefetch?: boolean\n\tlocale?: string\n}\n\nconst Interactive = forwardRef<\n\tHTMLAnchorElement | HTMLButtonElement,\n\tInteractiveProps\n>((props, ref) => {\n\tconst Link = useMDSLink()\n\tconst {\n\t\thref,\n\t\tclassName,\n\t\tisHrefExternal,\n\t\tonClick,\n\t\tchildren,\n\t\tlocale,\n\t\t...rest\n\t} = props\n\n\t// TODO: trigger link on space key up\n\tif (href) {\n\t\treturn (\n\t\t\t<Link\n\t\t\t\tclassName={className}\n\t\t\t\ttarget={isHrefExternal ? '_blank' : undefined}\n\t\t\t\trel={isHrefExternal ? 'noopener noreferrer' : undefined}\n\t\t\t\tonClick={onClick}\n\t\t\t\t{...getLocalizedLinkProps(href, locale, isHrefExternal)}\n\t\t\t\t{...rest}\n\t\t\t\tref={ref as ForwardRefExoticComponent<HTMLAnchorElement>}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</Link>\n\t\t)\n\t} else {\n\t\treturn (\n\t\t\t<button\n\t\t\t\ttype=\"button\"\n\t\t\t\tclassName={className}\n\t\t\t\tonClick={onClick}\n\t\t\t\t{...rest}\n\t\t\t\tref={ref as ForwardRefExoticComponent<HTMLButtonElement>}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</button>\n\t\t)\n\t}\n})\nInteractive.displayName = 'Interactive'\n\n/**\n * Smaller, local version of our getLocalizedLinkProps util,\n * cloned here to work around a cyclic dependency issue\n * with the main @web/utils package.\n *\n * @param url An internal URL path\n * @param locale A supported locale\n * @returns A prefixed URL if locale is defined, otherwise the URL without prefix\n */\nexport const getLocalizedLinkProps = (\n\thref: string,\n\tlocale?: string,\n\tisHrefExternal?: boolean\n): {\n\thref: string\n\threfLang: string | undefined\n\tisHrefExternal?: boolean\n} => {\n\tif (isHrefExternal) {\n\t\treturn {\n\t\t\thref: href,\n\t\t\threfLang: undefined,\n\t\t}\n\t}\n\n\tif (\n\t\t['en', 'de', 'es', 'fr', 'ja', 'ko', 'pt', 'id'].includes(\n\t\t\thref.substring(1, 3)\n\t\t)\n\t) {\n\t\t// Don't localize if the href is already localized\n\t\treturn {\n\t\t\thref: href,\n\t\t\threfLang: href.substring(1, 3),\n\t\t}\n\t}\n\n\tif (href.startsWith('/') && locale) {\n\t\treturn {\n\t\t\thref: `/${locale}${href}`,\n\t\t\threfLang: locale,\n\t\t}\n\t}\n\n\treturn {\n\t\thref: href,\n\t\threfLang: undefined,\n\t}\n}\n\nexport type { InteractiveProps }\nexport { Interactive }\n"],"names":["Interactive","forwardRef","props","ref","Link","useMDSLink","href","className","isHrefExternal","onClick","children","locale","rest","jsx","getLocalizedLinkProps"],"mappings":";;;;AAmBC,MAAAA,IAAaC,EAAW,CAAAC,GAAAC,MAAA;AACxB,QAAMC,IAAAC,EAAA,GACL;AAAA,IACA,MAAAC;AAAA,IACA,WAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,SAAAC;AAAA,IACA,UAAAC;AAAA,IACA,QAAAC;AAAA,OACGC;AAAA,EAGJ,IAAIV;AACH,aACE,gBAAAW;AAAA,IAAAT;AAAA,IAAA;AAAA,MAEA,WAAAG;AAAA,MACA,QAAKC,IAAiB,WAAA;AAAA,MACtB,KAAAA,IAAA,wBAAA;AAAA,MACC,SAAAC;AAAA,MACA,GAAGK,EAAAR,GAAAK,GAAAH,CAAA;AAAA,MACJ,GAAAI;AAAA,MAEC,KAAAT;AAAA,MAAA,UAAAO;AAAA,IACF;AAAA,EAEF,IAEG,gBAAAG;AAAA,IAAA;AAAA,IAAA;AAAA,MAEA,MAAA;AAAA,MACA,WAAAN;AAAA,MACC,SAAAE;AAAA,MACD,GAAAG;AAAA,MAEC,KAAAT;AAAA,MAAA,UAAAO;AAAA,IACF;AAAA,EAEF;AAED,CAAA;AAWOV,EAAM,cAAA;AASZ,MAAIc,IAAgB,CAAAR,GAAAK,GAAAH,MACnBA,IACC;AAAA,EACA,MAAAF;AAAA,EACD,UAAA;AACD,WAIO,MAAU,MAAI,MAAA,MAAA,MAAA,MAAA,IAAA,EAAA;AAAA,EACpBA,EACC,UAAA,GAAA,CAAA;AAED,IACC;AAAA,EACA,MAAAA;AAAA,EACD,UAAAA,EAAA,UAAA,GAAA,CAAA;AACD,IAGCA,EAAO,WAAA,GAAA,KAAAK,IACN;AAAA,EACA,UAAUA,CAAA,GAAAL,CAAA;AAAA,EACX,UAAAK;AACD,IAGC;AAAA,EACA,MAAAL;AAAA,EACD,UAAA;AACD;"}
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
import { jsx as b } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef as S } from "react";
|
|
3
|
+
import { determineColor as x, LINK_TYPE_ICON_MAP as l } from "./utils.js";
|
|
4
|
+
import { StandaloneLink as _ } from "../standalone-link/index.js";
|
|
5
|
+
import { Button as D } from "../button/index.js";
|
|
6
|
+
const H = S(
|
|
7
|
+
({
|
|
8
|
+
locale: t,
|
|
9
|
+
text: a,
|
|
10
|
+
title: i,
|
|
11
|
+
url: n,
|
|
12
|
+
href: d,
|
|
13
|
+
linkType: o,
|
|
14
|
+
onClick: m,
|
|
15
|
+
external: f,
|
|
16
|
+
className: u,
|
|
17
|
+
size: c,
|
|
18
|
+
icon: s,
|
|
19
|
+
iconPosition: e = "trailing",
|
|
20
|
+
label: B,
|
|
21
|
+
disabled: E,
|
|
22
|
+
type: M,
|
|
23
|
+
theme: r,
|
|
24
|
+
...P
|
|
25
|
+
}, g) => x(r) === "tertiary" ? /* @__PURE__ */ b(
|
|
26
|
+
_,
|
|
27
|
+
{
|
|
28
|
+
text: a || i,
|
|
29
|
+
color: r?.background === "dark" ? "secondary-inverted" : "secondary",
|
|
30
|
+
href: n || d,
|
|
31
|
+
icon: o ? l[o] : s,
|
|
32
|
+
iconPosition: o ? "trailing" : e,
|
|
33
|
+
className: u,
|
|
34
|
+
onClick: m,
|
|
35
|
+
size: c,
|
|
36
|
+
isHrefExternal: o === "outbound" || f,
|
|
37
|
+
ref: g,
|
|
38
|
+
locale: t
|
|
39
|
+
}
|
|
40
|
+
) : /* @__PURE__ */ b(
|
|
41
|
+
D,
|
|
42
|
+
{
|
|
43
|
+
text: a || i,
|
|
44
|
+
href: n || d,
|
|
45
|
+
isHrefExternal: o === "outbound" || f,
|
|
46
|
+
color: x(r),
|
|
47
|
+
type: M,
|
|
48
|
+
icon: o ? l[o] : s,
|
|
49
|
+
iconPosition: o ? "trailing" : e,
|
|
50
|
+
onClick: m,
|
|
51
|
+
className: u,
|
|
52
|
+
size: c === "small" ? "medium" : "large",
|
|
53
|
+
"aria-label": B,
|
|
54
|
+
disabled: E,
|
|
55
|
+
ref: g,
|
|
56
|
+
locale: t,
|
|
57
|
+
...P
|
|
58
|
+
}
|
|
59
|
+
)
|
|
60
|
+
);
|
|
61
|
+
H.displayName = "MDSButton";
|
|
62
|
+
export {
|
|
63
|
+
H as MDSButton
|
|
64
|
+
};
|
|
65
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/components/legacy-button/index.tsx"],"sourcesContent":["import { type ForwardRefExoticComponent, forwardRef } from 'react'\nimport type { ButtonProps } from './types'\nimport { determineColor, LINK_TYPE_ICON_MAP } from './utils'\nimport { StandaloneLink } from '../standalone-link'\nimport { Button } from '../button'\n\n/** @deprecated Use <Button> from '@hashicorp/mds-react/button' instead. Will be removed in v1.0. */\nconst MDSButton = forwardRef<\n\tHTMLAnchorElement | HTMLButtonElement,\n\tButtonProps\n>(\n\t(\n\t\t{\n\t\t\tlocale,\n\t\t\ttext,\n\t\t\ttitle,\n\t\t\turl,\n\t\t\thref,\n\t\t\tlinkType,\n\t\t\tonClick,\n\t\t\texternal,\n\t\t\tclassName,\n\t\t\tsize,\n\t\t\ticon,\n\t\t\ticonPosition = 'trailing',\n\t\t\tlabel,\n\t\t\tdisabled,\n\t\t\ttype,\n\t\t\ttheme,\n\t\t\t...rest\n\t\t},\n\t\tref\n\t) => {\n\t\tconst color = determineColor(theme)\n\n\t\tif (color === 'tertiary') {\n\t\t\t// We prefer the Standalone Link component over the tertiary\n\t\t\t// button styles.\n\t\t\treturn (\n\t\t\t\t<StandaloneLink\n\t\t\t\t\ttext={(text || title) as string}\n\t\t\t\t\tcolor={\n\t\t\t\t\t\ttheme?.background === 'dark' ? 'secondary-inverted' : 'secondary'\n\t\t\t\t\t}\n\t\t\t\t\thref={url || href}\n\t\t\t\t\ticon={linkType ? LINK_TYPE_ICON_MAP[linkType] : icon}\n\t\t\t\t\ticonPosition={linkType ? 'trailing' : iconPosition}\n\t\t\t\t\tclassName={className}\n\t\t\t\t\tonClick={onClick as () => void}\n\t\t\t\t\tsize={size}\n\t\t\t\t\tisHrefExternal={linkType === 'outbound' || external}\n\t\t\t\t\tref={ref as ForwardRefExoticComponent<HTMLAnchorElement>}\n\t\t\t\t\tlocale={locale}\n\t\t\t\t/>\n\t\t\t)\n\t\t}\n\n\t\treturn (\n\t\t\t<Button\n\t\t\t\ttext={text || title}\n\t\t\t\thref={url || href}\n\t\t\t\tisHrefExternal={linkType === 'outbound' || external}\n\t\t\t\tcolor={determineColor(theme)}\n\t\t\t\ttype={type}\n\t\t\t\ticon={linkType ? LINK_TYPE_ICON_MAP[linkType] : icon}\n\t\t\t\ticonPosition={linkType ? 'trailing' : iconPosition}\n\t\t\t\tonClick={onClick as React.MouseEventHandler<HTMLButtonElement>}\n\t\t\t\tclassName={className}\n\t\t\t\t// Default buttons to the large size unless we specifically request the\n\t\t\t\t// small variant\n\t\t\t\tsize={size === 'small' ? 'medium' : 'large'}\n\t\t\t\taria-label={label}\n\t\t\t\tdisabled={disabled}\n\t\t\t\tref={ref as ForwardRefExoticComponent<HTMLButtonElement>}\n\t\t\t\tlocale={locale}\n\t\t\t\t{...rest}\n\t\t\t/>\n\t\t)\n\t}\n)\n\nMDSButton.displayName = 'MDSButton'\n\nexport { MDSButton }\n"],"names":["MDSButton","forwardRef","locale","text","title","url","href","linkType","onClick","external","className","size","icon","iconPosition","label","disabled","type","theme","rest","ref","determineColor","jsx","StandaloneLink","LINK_TYPE_ICON_MAP","Button"],"mappings":";;;;;AAOA,MAAMA,IAAYC;AAAA,EAIjB,CACC;AAAA,IACC,QAAAC;AAAA,IACA,MAAAC;AAAA,IACA,OAAAC;AAAA,IACA,KAAAC;AAAA,IACA,MAAAC;AAAA,IACA,UAAAC;AAAA,IACA,SAAAC;AAAA,IACA,UAAAC;AAAA,IACA,WAAAC;AAAA,IACA,MAAAC;AAAA,IACA,MAAAC;AAAA,IACA,cAAAC,IAAe;AAAA,IACf,OAAAC;AAAA,IACA,UAAAC;AAAA,IACA,MAAAC;AAAA,IACA,OAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAEJC,MAEcC,EAAeH,CAAK,MAEpB,aAIZ,gBAAAI;AAAA,IAACC;AAAA,IAAA;AAAA,MACA,MAAOnB,KAAQC;AAAA,MACf,OACCa,GAAO,eAAe,SAAS,uBAAuB;AAAA,MAEvD,MAAMZ,KAAOC;AAAA,MACb,MAAMC,IAAWgB,EAAmBhB,CAAQ,IAAIK;AAAA,MAChD,cAAcL,IAAW,aAAaM;AAAA,MACtC,WAAAH;AAAA,MACA,SAAAF;AAAA,MACA,MAAAG;AAAA,MACA,gBAAgBJ,MAAa,cAAcE;AAAA,MAC3C,KAAAU;AAAA,MACA,QAAAjB;AAAA,IAAA;AAAA,EAAA,IAMF,gBAAAmB;AAAA,IAACG;AAAA,IAAA;AAAA,MACA,MAAMrB,KAAQC;AAAA,MACd,MAAMC,KAAOC;AAAA,MACb,gBAAgBC,MAAa,cAAcE;AAAA,MAC3C,OAAOW,EAAeH,CAAK;AAAA,MAC3B,MAAAD;AAAA,MACA,MAAMT,IAAWgB,EAAmBhB,CAAQ,IAAIK;AAAA,MAChD,cAAcL,IAAW,aAAaM;AAAA,MACtC,SAAAL;AAAA,MACA,WAAAE;AAAA,MAGA,MAAMC,MAAS,UAAU,WAAW;AAAA,MACpC,cAAYG;AAAA,MACZ,UAAAC;AAAA,MACA,KAAAI;AAAA,MACA,QAAAjB;AAAA,MACC,GAAGgB;AAAA,IAAA;AAAA,EAAA;AAIR;AAEAlB,EAAU,cAAc;"}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
function n(r) {
|
|
2
|
+
const a = r?.variant ? r.variant : "primary";
|
|
3
|
+
if (a === "primary")
|
|
4
|
+
switch (r?.brand) {
|
|
5
|
+
case "hashicorp":
|
|
6
|
+
return "primary";
|
|
7
|
+
case "boundary":
|
|
8
|
+
case "consul":
|
|
9
|
+
case "nomad":
|
|
10
|
+
case "packer":
|
|
11
|
+
case "terraform":
|
|
12
|
+
case "vagrant":
|
|
13
|
+
case "vault":
|
|
14
|
+
case "waypoint":
|
|
15
|
+
return r.brand;
|
|
16
|
+
case "neutral":
|
|
17
|
+
return "secondary-high-contrast";
|
|
18
|
+
default:
|
|
19
|
+
return "primary";
|
|
20
|
+
}
|
|
21
|
+
if (a === "secondary")
|
|
22
|
+
return "secondary";
|
|
23
|
+
if (a === "tertiary" || a === "tertiary-neutral" || a === "ghost")
|
|
24
|
+
return "tertiary";
|
|
25
|
+
throw new Error(
|
|
26
|
+
`Unable to determine HDS Button color from theme: ${JSON.stringify(r)}`
|
|
27
|
+
);
|
|
28
|
+
}
|
|
29
|
+
const t = {
|
|
30
|
+
inbound: "arrow-right",
|
|
31
|
+
outbound: "external-link",
|
|
32
|
+
download: "download",
|
|
33
|
+
anchor: "anchor"
|
|
34
|
+
};
|
|
35
|
+
export {
|
|
36
|
+
t as LINK_TYPE_ICON_MAP,
|
|
37
|
+
n as determineColor
|
|
38
|
+
};
|
|
39
|
+
//# sourceMappingURL=utils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.js","sources":["../../../src/components/legacy-button/utils.tsx"],"sourcesContent":["import type { ButtonColor, Theme, ThemeVariant } from './types'\n\nexport const COLORS = [\n\t'primary',\n\t'primary-black',\n\t'primary-white',\n\t'secondary', // deprecated; maps to secondary-white\n\t'secondary-high-contrast', // alternates between secondary-black and secondary-white based on theme\n\t'secondary-white',\n\t'secondary-black',\n\t'tertiary',\n\t'critical',\n\t'boundary',\n\t'consul',\n\t'nomad',\n\t'packer',\n\t'terraform',\n\t'vagrant',\n\t'vault',\n\t'waypoint',\n\t'hashicorp', // alias to primary\n] as const\n\nexport function determineColor(theme?: Theme): ButtonColor {\n\tconst variant: ThemeVariant = theme?.variant ? theme.variant : 'primary'\n\n\tif (variant === 'primary') {\n\t\tswitch (theme?.brand) {\n\t\t\tcase 'hashicorp':\n\t\t\t\treturn 'primary'\n\t\t\tcase 'boundary':\n\t\t\tcase 'consul':\n\t\t\tcase 'nomad':\n\t\t\tcase 'packer':\n\t\t\tcase 'terraform':\n\t\t\tcase 'vagrant':\n\t\t\tcase 'vault':\n\t\t\tcase 'waypoint':\n\t\t\t\treturn theme.brand\n\t\t\tcase 'neutral':\n\t\t\t\treturn 'secondary-high-contrast'\n\t\t\tdefault:\n\t\t\t\treturn 'primary'\n\t\t}\n\t}\n\n\tif (variant === 'secondary') {\n\t\treturn 'secondary'\n\t}\n\n\tif (\n\t\tvariant === 'tertiary' ||\n\t\tvariant === 'tertiary-neutral' ||\n\t\tvariant === 'ghost'\n\t) {\n\t\treturn 'tertiary'\n\t}\n\n\tthrow new Error(\n\t\t`Unable to determine HDS Button color from theme: ${JSON.stringify(theme)}`\n\t)\n}\n\nexport const LINK_TYPE_ICON_MAP = {\n\tinbound: 'arrow-right',\n\toutbound: 'external-link',\n\tdownload: 'download',\n\tanchor: 'anchor',\n}\n"],"names":["determineColor","theme","variant","LINK_TYPE_ICON_MAP"],"mappings":"AAuBO,SAASA,EAAeC,GAA4B;AAC1D,QAAMC,IAAwBD,GAAO,UAAUA,EAAM,UAAU;AAE/D,MAAIC,MAAY;AACf,YAAQD,GAAO,OAAA;AAAA,MACd,KAAK;AACJ,eAAO;AAAA,MACR,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AACJ,eAAOA,EAAM;AAAA,MACd,KAAK;AACJ,eAAO;AAAA,MACR;AACC,eAAO;AAAA,IAAA;AAIV,MAAIC,MAAY;AACf,WAAO;AAGR,MACCA,MAAY,cACZA,MAAY,sBACZA,MAAY;AAEZ,WAAO;AAGR,QAAM,IAAI;AAAA,IACT,oDAAoD,KAAK,UAAUD,CAAK,CAAC;AAAA,EAAA;AAE3E;AAEO,MAAME,IAAqB;AAAA,EACjC,SAAS;AAAA,EACT,UAAU;AAAA,EACV,UAAU;AAAA,EACV,QAAQ;AACT;"}
|
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as c } from "react/jsx-runtime";
|
|
3
|
+
import { useState as N, useRef as f, useCallback as i, useMemo as P } from "react";
|
|
4
|
+
import R from "classnames";
|
|
5
|
+
import { MenuPrimitiveContext as b, useMenuPrimitive as p } from "./use-menu-primitive.js";
|
|
6
|
+
import u from "./styles.module.css.js";
|
|
7
|
+
const E = ({
|
|
8
|
+
onClose: e,
|
|
9
|
+
isFullWidth: n,
|
|
10
|
+
children: d,
|
|
11
|
+
className: g,
|
|
12
|
+
...v
|
|
13
|
+
}) => {
|
|
14
|
+
const [l, r] = N(!1), m = f(null), o = f(null), t = i(() => {
|
|
15
|
+
r(!1), e && e();
|
|
16
|
+
}, [r, e]), a = i(() => {
|
|
17
|
+
r((s) => !s), o?.current?.focus();
|
|
18
|
+
}, [o, r]), x = i(
|
|
19
|
+
(s) => {
|
|
20
|
+
m?.current?.contains(
|
|
21
|
+
s.relatedTarget || document.activeElement
|
|
22
|
+
) || t();
|
|
23
|
+
},
|
|
24
|
+
[t]
|
|
25
|
+
), O = i(
|
|
26
|
+
(s) => {
|
|
27
|
+
s.key === "Escape" && (t(), o?.current?.querySelector("button")?.focus());
|
|
28
|
+
},
|
|
29
|
+
[t]
|
|
30
|
+
), M = P(
|
|
31
|
+
() => ({
|
|
32
|
+
isOpen: l,
|
|
33
|
+
onClickToggle: a,
|
|
34
|
+
toggleRef: o,
|
|
35
|
+
closeMenu: t
|
|
36
|
+
}),
|
|
37
|
+
[l, a, o, t]
|
|
38
|
+
);
|
|
39
|
+
return /* @__PURE__ */ c(b.Provider, { value: M, children: /* @__PURE__ */ c(
|
|
40
|
+
"div",
|
|
41
|
+
{
|
|
42
|
+
className: R(
|
|
43
|
+
u["menu-primitive"],
|
|
44
|
+
{
|
|
45
|
+
[u["width-full"]]: n
|
|
46
|
+
},
|
|
47
|
+
g
|
|
48
|
+
),
|
|
49
|
+
onBlur: x,
|
|
50
|
+
onKeyUp: O,
|
|
51
|
+
ref: m,
|
|
52
|
+
...v,
|
|
53
|
+
children: d
|
|
54
|
+
}
|
|
55
|
+
) });
|
|
56
|
+
}, I = ({ children: e }) => {
|
|
57
|
+
const { toggleRef: n } = p();
|
|
58
|
+
return /* @__PURE__ */ c("div", { className: "hds-menu-primitive__toggle", ref: n, children: e });
|
|
59
|
+
}, S = ({ children: e }) => {
|
|
60
|
+
const { isOpen: n } = p();
|
|
61
|
+
return /* @__PURE__ */ c("div", { className: n ? u.isOpen : u.isClosed, tabIndex: -1, children: e });
|
|
62
|
+
};
|
|
63
|
+
export {
|
|
64
|
+
S as Content,
|
|
65
|
+
E as Provider,
|
|
66
|
+
I as Toggle
|
|
67
|
+
};
|
|
68
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/components/menu-primitive/index.tsx"],"sourcesContent":["'use client'\n\nimport {\n\tuseMemo,\n\tuseState,\n\tuseRef,\n\tuseCallback,\n\ttype ReactNode,\n\ttype FocusEvent,\n\ttype KeyboardEvent,\n\ttype HTMLAttributes,\n} from 'react'\nimport classNames from 'classnames'\nimport {\n\tMenuPrimitiveContext,\n\tuseMenuPrimitive,\n\ttype MenuPrimitiveContextState,\n} from './use-menu-primitive'\nimport s from './styles.module.css'\n\ninterface MenuPrimitiveProps extends HTMLAttributes<HTMLDivElement> {\n\tonClose?: () => void\n\tisFullWidth?: boolean\n\tchildren: ReactNode\n}\n\nconst Provider = ({\n\tonClose,\n\tisFullWidth,\n\tchildren,\n\tclassName,\n\t...rest\n}: MenuPrimitiveProps) => {\n\tconst [isOpen, setIsOpen] = useState(false)\n\tconst menuRef = useRef<HTMLDivElement | null>(null)\n\tconst toggleRef = useRef<HTMLDivElement | null>(null)\n\n\tconst closeMenu = useCallback(() => {\n\t\tsetIsOpen(false)\n\t\tif (onClose) {\n\t\t\tonClose()\n\t\t}\n\t}, [setIsOpen, onClose])\n\n\tconst onClickToggle = useCallback(() => {\n\t\tsetIsOpen((prevState) => !prevState)\n\t\ttoggleRef?.current?.focus()\n\t}, [toggleRef, setIsOpen])\n\n\tconst onFocusOut = useCallback(\n\t\t(event: FocusEvent) => {\n\t\t\tif (\n\t\t\t\t!menuRef?.current?.contains(\n\t\t\t\t\tevent.relatedTarget || document.activeElement\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\tcloseMenu()\n\t\t\t}\n\t\t},\n\t\t[closeMenu]\n\t)\n\n\tconst onKeyUp = useCallback(\n\t\t(event: KeyboardEvent) => {\n\t\t\tif (event.key === 'Escape') {\n\t\t\t\tcloseMenu()\n\t\t\t\ttoggleRef?.current?.querySelector('button')?.focus()\n\t\t\t}\n\t\t},\n\t\t[closeMenu]\n\t)\n\n\tconst contextValue: MenuPrimitiveContextState = useMemo(\n\t\t() => ({\n\t\t\tisOpen,\n\t\t\tonClickToggle,\n\t\t\ttoggleRef,\n\t\t\tcloseMenu,\n\t\t}),\n\t\t[isOpen, onClickToggle, toggleRef, closeMenu]\n\t)\n\n\treturn (\n\t\t<MenuPrimitiveContext.Provider value={contextValue}>\n\t\t\t<div\n\t\t\t\tclassName={classNames(\n\t\t\t\t\ts['menu-primitive'],\n\t\t\t\t\t{\n\t\t\t\t\t\t[s['width-full']]: isFullWidth,\n\t\t\t\t\t},\n\t\t\t\t\tclassName\n\t\t\t\t)}\n\t\t\t\tonBlur={onFocusOut}\n\t\t\t\tonKeyUp={onKeyUp}\n\t\t\t\tref={menuRef}\n\t\t\t\t{...rest}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</div>\n\t\t</MenuPrimitiveContext.Provider>\n\t)\n}\n\nconst Toggle = ({ children }: { children: ReactNode }) => {\n\tconst { toggleRef } = useMenuPrimitive()\n\treturn (\n\t\t<div className=\"hds-menu-primitive__toggle\" ref={toggleRef}>\n\t\t\t{children}\n\t\t</div>\n\t)\n}\n\nconst Content = ({ children }: { children: ReactNode }) => {\n\tconst { isOpen } = useMenuPrimitive()\n\treturn (\n\t\t<div className={isOpen ? s.isOpen : s.isClosed} tabIndex={-1}>\n\t\t\t{children}\n\t\t</div>\n\t)\n}\n\nexport { Provider, Toggle, Content }\n"],"names":["Provider","onClose","isFullWidth","children","className","rest","isOpen","setIsOpen","useState","menuRef","useRef","toggleRef","closeMenu","useCallback","prevState","event","contextValue","useMemo","onClickToggle","jsx","MenuPrimitiveContext","classNames","s","onFocusOut","onKeyUp","useMenuPrimitive"],"mappings":";;;;;;AA0BkB,MACjBA,IAAA,CAAA;AAAA,EACA,SAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACD,GAAAC;AACC,MAAA;AACA,QAAM,CAAAC,GAAAC,KAA4CC,EAAA,EAAA,GAC5CC,IAAAC,EAAY,OAEZC,IAAYD,EAAA,OACjBE,IAAeC,EAAA,MAAA;AACf,IAAAN,IAAa,QAEbN,EAAA;AAAA,EAGD,GAAA,CAAAM,GAAMN,CAAgB,CAAA,OACVY,QAAwB;AACnC,IAAAN,EAAA,CAAWO,MAAS,CAAAA,CAAM,GAC3BH,GAAI,SAAW,MAAU;AAAA,EAEzB,GAAA,CAAAA,GAAMJ,CAAa,CAAA,OACKM;AAAA,IACtB,CAAAE,MACE;AAAkB,MAClBN,GAAM;QACPM,EACC,iBAAA,SAAA;AAAA,MACD,KACDH,EAAA;AAAA,IAED;AAAA,IACD,CAAAA,CAAA;AAAA,EAEA,OAC2BC;AAAA,IACzB,CAAAE,MAAI;AACH,gBAAU,aACVH,EAAA,GACDD,GAAA,SAAA,cAAA,QAAA,GAAA,MAAA;AAAA,IAED;AAAA,IACD,CAAAC,CAAA;AAAA,EAEA,GACCI,IAAOC;AAAA,IAAA,OACN;AAAA,MACA,QAAAX;AAAA,MACA,eAAAY;AAAA,MACA,WAAAP;AAAA,MACD,WAAAC;AAAA,IACA;AAAA,IACD,CAAAN,GAAAY,GAAAP,GAAAC,CAAA;AAAA,EAEA;AAEE,SAAC,gBAAAO,EAAAC,EAAA,UAAA,EAAA,OAAAJ,GAAA,UAAA,gBAAAG;AAAA,IAAA;AAAA,IAAA;AAAA,MACW,WACRE;AAAA,QACFC,EAAA,gBAAA;AAAA,QAAA;AAAA,UAEA,CAAAA,EAAA,YAAA,CAAA,GAAApB;AAAA,QACA;AAAA,QACDE;AAAA,MACA;AAAA,MACA,QAAAmB;AAAA,MACA,SAAAC;AAAA,MACC,KAAGf;AAAA,MAEH,GAAAJ;AAAA,MAAA,UAAAF;AAAA;EAIL,EAAA,CAAA;AAEA,OACS,CAAA,EAAA,UAAAA;AACR,6BACM;AAIP,SAAA,gBAAAgB,EAAA,OAAA,EAAA,WAAA,8BAAA,KAAAR,GAAA,UAAAR,EAAA,CAAA;AAEA,OACS,CAAA,EAAO,UAAAA;AACf,QAAA,EAAA,QAAAG,EAAA,IAAAmB,EACM;AAIP,SAAA,gBAAAN,EAAA,OAAA,EAAA,WAAAb,IAAAgB,EAAA,SAAAA,EAAA,UAAA,UAAA,IAAA,UAAAnB,EAAA,CAAA;;"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
const i = "isOpen__Dbse-", s = "isClosed__HWTqi", e = {
|
|
2
|
+
"menu-primitive": "menu-primitive__EJFpE",
|
|
3
|
+
"width-full": "width-full__35Qjo",
|
|
4
|
+
isOpen: i,
|
|
5
|
+
isClosed: s
|
|
6
|
+
};
|
|
7
|
+
export {
|
|
8
|
+
e as default,
|
|
9
|
+
s as isClosed,
|
|
10
|
+
i as isOpen
|
|
11
|
+
};
|
|
12
|
+
//# sourceMappingURL=styles.module.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"styles.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { createContext as i, useContext as n } from "react";
|
|
3
|
+
const t = i(void 0);
|
|
4
|
+
t.displayName = "MenuPrimitiveContext";
|
|
5
|
+
function r() {
|
|
6
|
+
const e = n(t);
|
|
7
|
+
if (e === void 0)
|
|
8
|
+
throw new Error(
|
|
9
|
+
"useMenuPrimitive must be used within a MenuPrimitiveContext.Provider"
|
|
10
|
+
);
|
|
11
|
+
return e;
|
|
12
|
+
}
|
|
13
|
+
export {
|
|
14
|
+
t as MenuPrimitiveContext,
|
|
15
|
+
r as useMenuPrimitive
|
|
16
|
+
};
|
|
17
|
+
//# sourceMappingURL=use-menu-primitive.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-menu-primitive.js","sources":["../../../src/components/menu-primitive/use-menu-primitive.ts"],"sourcesContent":["'use client'\n\nimport {\n\tcreateContext,\n\tuseContext,\n\ttype MouseEventHandler,\n\ttype RefObject,\n} from 'react'\n\nexport interface MenuPrimitiveContextState {\n\tisOpen: boolean\n\tonClickToggle: MouseEventHandler<HTMLButtonElement>\n\ttoggleRef: RefObject<HTMLDivElement>\n\tcloseMenu: () => void\n}\n\nexport const MenuPrimitiveContext = createContext<\n\tMenuPrimitiveContextState | undefined\n>(undefined)\nMenuPrimitiveContext.displayName = 'MenuPrimitiveContext'\n\nexport function useMenuPrimitive(): MenuPrimitiveContextState {\n\tconst context = useContext(MenuPrimitiveContext)\n\tif (context === undefined) {\n\t\tthrow new Error(\n\t\t\t'useMenuPrimitive must be used within a MenuPrimitiveContext.Provider'\n\t\t)\n\t}\n\treturn context\n}\n"],"names":["MenuPrimitiveContext","createContext","useMenuPrimitive","context","useContext"],"mappings":";;AAmBA,MAAAA,IAAqBC,EAAc,MAAA;AAE5BD,gBAAuD;AAC7D,SAAME;AACN,QAAIC,IAAYC,EAAWJ,CAAA;AAC1B,MAAAG,MAAU;AAAA,UACT,IAAA;AAAA,MACD;AAAA,IACD;AAED,SAAAA;;"}
|