@hashicorp/mds-react 0.9.1 → 0.9.3
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/index.js +73 -115
- package/components/index.js.map +1 -1
- package/index-B9mPJh9w.js +579 -0
- package/index-B9mPJh9w.js.map +1 -0
- package/index-BHBlMMNF.js +16 -0
- package/index-BHBlMMNF.js.map +1 -0
- package/index-C4GBbW3N.js +3567 -0
- package/index-C4GBbW3N.js.map +1 -0
- package/{utils/mds-context/index.js → index-DBjAbGt7.js} +19 -20
- package/index-DBjAbGt7.js.map +1 -0
- package/index-WkGIywHj.js +767 -0
- package/index-WkGIywHj.js.map +1 -0
- package/index.js +100 -153
- package/index.js.map +1 -1
- package/package.json +1 -1
- package/patterns/index.js +22 -32
- package/patterns/index.js.map +1 -1
- package/style.css +1 -0
- package/styles/mixins/button.scss +1 -6
- package/use-screen-size-BOnkX_K-.js +9 -0
- package/use-screen-size-BOnkX_K-.js.map +1 -0
- package/utils/index.js +7 -7
- package/assets/style-DD7hNwDr.css +0 -1
- package/components/accordion/index.js +0 -9
- package/components/accordion/index.js.map +0 -1
- package/components/accordion/item/button.js +0 -44
- package/components/accordion/item/button.js.map +0 -1
- package/components/accordion/item/index.js +0 -59
- package/components/accordion/item/index.js.map +0 -1
- package/components/accordion/style.module.scss.js +0 -24
- package/components/accordion/style.module.scss.js.map +0 -1
- package/components/alert/alert.module.scss.js +0 -29
- package/components/alert/alert.module.scss.js.map +0 -1
- package/components/alert/icon.js +0 -34
- package/components/alert/icon.js.map +0 -1
- package/components/alert/index.js +0 -97
- package/components/alert/index.js.map +0 -1
- package/components/badge/index.js +0 -53
- package/components/badge/index.js.map +0 -1
- package/components/badge/style.module.scss.js +0 -22
- package/components/badge/style.module.scss.js.map +0 -1
- package/components/badge-count/index.js +0 -29
- package/components/badge-count/index.js.map +0 -1
- package/components/badge-count/style.module.scss.js +0 -15
- package/components/badge-count/style.module.scss.js.map +0 -1
- package/components/breadcrumbs/index.js +0 -38
- package/components/breadcrumbs/index.js.map +0 -1
- package/components/breadcrumbs/item/index.js +0 -32
- package/components/breadcrumbs/item/index.js.map +0 -1
- package/components/breadcrumbs/style.module.scss.js +0 -27
- package/components/breadcrumbs/style.module.scss.js.map +0 -1
- package/components/breadcrumbs/truncation-button/index.js +0 -25
- package/components/breadcrumbs/truncation-button/index.js.map +0 -1
- package/components/button/index.js +0 -119
- package/components/button/index.js.map +0 -1
- package/components/button/styles.module.scss.js +0 -32
- package/components/button/styles.module.scss.js.map +0 -1
- package/components/card/card-thumbnail/card-thumbnail.module.css.js +0 -8
- package/components/card/card-thumbnail/card-thumbnail.module.css.js.map +0 -1
- package/components/card/card-thumbnail/index.js +0 -23
- package/components/card/card-thumbnail/index.js.map +0 -1
- package/components/card/index.js +0 -157
- package/components/card/index.js.map +0 -1
- package/components/card/styles.module.css.js +0 -29
- package/components/card/styles.module.css.js.map +0 -1
- package/components/code-block/code-block.module.scss.js +0 -34
- package/components/code-block/code-block.module.scss.js.map +0 -1
- package/components/code-block/code-lines/index.js +0 -59
- package/components/code-block/code-lines/index.js.map +0 -1
- package/components/code-block/code-lines/utils/split-html-into-lines.js +0 -19
- package/components/code-block/code-lines/utils/split-html-into-lines.js.map +0 -1
- package/components/code-block/code-lines/utils/split-jsx-into-lines.js +0 -31
- package/components/code-block/code-lines/utils/split-jsx-into-lines.js.map +0 -1
- package/components/code-block/hidden-copy-content/index.js +0 -13
- package/components/code-block/hidden-copy-content/index.js.map +0 -1
- package/components/code-block/index.js +0 -88
- package/components/code-block/index.js.map +0 -1
- package/components/code-block/utils/parse-highlighted-lines.js +0 -39
- package/components/code-block/utils/parse-highlighted-lines.js.map +0 -1
- package/components/code-block/utils/process-snippet.js +0 -20
- package/components/code-block/utils/process-snippet.js.map +0 -1
- package/components/code-block/utils/shellwords.js +0 -33
- package/components/code-block/utils/shellwords.js.map +0 -1
- package/components/combo-box-primitive/index.js +0 -302
- package/components/combo-box-primitive/index.js.map +0 -1
- package/components/dialog-primitive/dialog.module.scss.js +0 -12
- package/components/dialog-primitive/dialog.module.scss.js.map +0 -1
- package/components/dialog-primitive/index.js +0 -15
- package/components/dialog-primitive/index.js.map +0 -1
- package/components/disclosure-primitive/index.js +0 -57
- package/components/disclosure-primitive/index.js.map +0 -1
- package/components/disclosure-primitive/styles.module.css.js +0 -7
- package/components/disclosure-primitive/styles.module.css.js.map +0 -1
- package/components/disclosure-primitive/use-disclosure-primitive.js +0 -17
- package/components/disclosure-primitive/use-disclosure-primitive.js.map +0 -1
- package/components/dismiss-button/index.js +0 -22
- package/components/dismiss-button/index.js.map +0 -1
- package/components/dismiss-button/styles.module.scss.js +0 -7
- package/components/dismiss-button/styles.module.scss.js.map +0 -1
- package/components/dropdown/index.js +0 -79
- package/components/dropdown/index.js.map +0 -1
- package/components/dropdown/list-item/custom.js +0 -9
- package/components/dropdown/list-item/custom.js.map +0 -1
- package/components/dropdown/list-item/index.js +0 -14
- package/components/dropdown/list-item/index.js.map +0 -1
- package/components/dropdown/list-item/interactive.js +0 -49
- package/components/dropdown/list-item/interactive.js.map +0 -1
- package/components/dropdown/list-item/separator.js +0 -17
- package/components/dropdown/list-item/separator.js.map +0 -1
- package/components/dropdown/list-item/styles.module.css.js +0 -26
- package/components/dropdown/list-item/styles.module.css.js.map +0 -1
- package/components/dropdown/list-item/title.js +0 -9
- package/components/dropdown/list-item/title.js.map +0 -1
- package/components/dropdown/styles.module.css.js +0 -24
- package/components/dropdown/styles.module.css.js.map +0 -1
- package/components/dropdown/toggle-button/index.js +0 -54
- package/components/dropdown/toggle-button/index.js.map +0 -1
- package/components/dropdown/toggle-button/styles.module.scss.js +0 -14
- package/components/dropdown/toggle-button/styles.module.scss.js.map +0 -1
- package/components/flight-icon/flight-icon.module.css.js +0 -12
- package/components/flight-icon/flight-icon.module.css.js.map +0 -1
- package/components/flight-icon/index.js +0 -58
- package/components/flight-icon/index.js.map +0 -1
- package/components/form/checkbox/form-checkbox.module.css.js +0 -8
- package/components/form/checkbox/form-checkbox.module.css.js.map +0 -1
- package/components/form/checkbox/index.js +0 -109
- package/components/form/checkbox/index.js.map +0 -1
- package/components/form/error/form-error.module.css.js +0 -14
- package/components/form/error/form-error.module.css.js.map +0 -1
- package/components/form/error/index.js +0 -22
- package/components/form/error/index.js.map +0 -1
- package/components/form/field/form-field.module.css.js +0 -17
- package/components/form/field/form-field.module.css.js.map +0 -1
- package/components/form/field/index.js +0 -46
- package/components/form/field/index.js.map +0 -1
- package/components/form/fieldset/form-fieldset.module.css.js +0 -19
- package/components/form/fieldset/form-fieldset.module.css.js.map +0 -1
- package/components/form/fieldset/index.js +0 -65
- package/components/form/fieldset/index.js.map +0 -1
- package/components/form/file-input/form-file-input.module.scss.js +0 -7
- package/components/form/file-input/form-file-input.module.scss.js.map +0 -1
- package/components/form/file-input/index.js +0 -68
- package/components/form/file-input/index.js.map +0 -1
- package/components/form/helper-text/form-helper-text.module.css.js +0 -7
- package/components/form/helper-text/form-helper-text.module.css.js.map +0 -1
- package/components/form/helper-text/index.js +0 -22
- package/components/form/helper-text/index.js.map +0 -1
- package/components/form/indicator/form-indicator.module.css.js +0 -8
- package/components/form/indicator/form-indicator.module.css.js.map +0 -1
- package/components/form/indicator/index.js +0 -23
- package/components/form/indicator/index.js.map +0 -1
- package/components/form/label/form-label.module.css.js +0 -10
- package/components/form/label/form-label.module.css.js.map +0 -1
- package/components/form/label/index.js +0 -33
- package/components/form/label/index.js.map +0 -1
- package/components/form/legend/form-legend.module.css.js +0 -10
- package/components/form/legend/form-legend.module.css.js.map +0 -1
- package/components/form/legend/index.js +0 -19
- package/components/form/legend/index.js.map +0 -1
- package/components/form/radio/form-radio.module.scss.js +0 -8
- package/components/form/radio/form-radio.module.scss.js.map +0 -1
- package/components/form/radio/index.js +0 -100
- package/components/form/radio/index.js.map +0 -1
- package/components/form/radio-card/description.js +0 -10
- package/components/form/radio-card/description.js.map +0 -1
- package/components/form/radio-card/form-radio-card.module.css.js +0 -30
- package/components/form/radio-card/form-radio-card.module.css.js.map +0 -1
- package/components/form/radio-card/group.js +0 -31
- package/components/form/radio-card/group.js.map +0 -1
- package/components/form/radio-card/index.js +0 -67
- package/components/form/radio-card/index.js.map +0 -1
- package/components/form/radio-card/label.js +0 -10
- package/components/form/radio-card/label.js.map +0 -1
- package/components/form/select/form-select.module.css.js +0 -14
- package/components/form/select/form-select.module.css.js.map +0 -1
- package/components/form/select/index.js +0 -79
- package/components/form/select/index.js.map +0 -1
- package/components/form/super-select/form-super-select.module.css.js +0 -22
- package/components/form/super-select/form-super-select.module.css.js.map +0 -1
- package/components/form/super-select/index.js +0 -170
- package/components/form/super-select/index.js.map +0 -1
- package/components/form/text-input/index.js +0 -91
- package/components/form/text-input/index.js.map +0 -1
- package/components/form/text-input/styles.module.css.js +0 -15
- package/components/form/text-input/styles.module.css.js.map +0 -1
- package/components/form/textarea/form-textarea.module.css.js +0 -14
- package/components/form/textarea/form-textarea.module.css.js.map +0 -1
- package/components/form/textarea/index.js +0 -74
- package/components/form/textarea/index.js.map +0 -1
- package/components/form/toggle/form-toggle.module.scss.js +0 -12
- package/components/form/toggle/form-toggle.module.scss.js.map +0 -1
- package/components/form/toggle/index.js +0 -102
- package/components/form/toggle/index.js.map +0 -1
- package/components/hds/wrappers/tooltip.js +0 -51
- package/components/hds/wrappers/tooltip.js.map +0 -1
- package/components/icon-tile/index.js +0 -50
- package/components/icon-tile/index.js.map +0 -1
- package/components/icon-tile/style.module.scss.js +0 -29
- package/components/icon-tile/style.module.scss.js.map +0 -1
- package/components/inline-link/index.js +0 -33
- package/components/inline-link/index.js.map +0 -1
- package/components/inline-link/inline-link.module.css.js +0 -11
- package/components/inline-link/inline-link.module.css.js.map +0 -1
- package/components/interactive/index.js +0 -59
- package/components/interactive/index.js.map +0 -1
- package/components/legacy-button/index.js +0 -65
- package/components/legacy-button/index.js.map +0 -1
- package/components/legacy-button/utils.js +0 -39
- package/components/legacy-button/utils.js.map +0 -1
- package/components/menu-primitive/index.js +0 -68
- package/components/menu-primitive/index.js.map +0 -1
- package/components/menu-primitive/styles.module.css.js +0 -12
- package/components/menu-primitive/styles.module.css.js.map +0 -1
- package/components/menu-primitive/use-menu-primitive.js +0 -17
- package/components/menu-primitive/use-menu-primitive.js.map +0 -1
- package/components/modal/index.js +0 -61
- package/components/modal/index.js.map +0 -1
- package/components/modal/modal.module.css.js +0 -8
- package/components/modal/modal.module.css.js.map +0 -1
- package/components/modal/use-modal.js +0 -17
- package/components/modal/use-modal.js.map +0 -1
- package/components/separator/index.js +0 -15
- package/components/separator/index.js.map +0 -1
- package/components/separator/separator.module.css.js +0 -10
- package/components/separator/separator.module.css.js.map +0 -1
- package/components/standalone-link/index.js +0 -54
- package/components/standalone-link/index.js.map +0 -1
- package/components/standalone-link/styles.module.scss.js +0 -17
- package/components/standalone-link/styles.module.scss.js.map +0 -1
- package/components/table/index.js +0 -52
- package/components/table/index.js.map +0 -1
- package/components/table/table.module.scss.js +0 -33
- package/components/table/table.module.scss.js.map +0 -1
- package/components/table/td.js +0 -28
- package/components/table/td.js.map +0 -1
- package/components/table/th-button-tooltip.js +0 -24
- package/components/table/th-button-tooltip.js.map +0 -1
- package/components/table/th.js +0 -43
- package/components/table/th.js.map +0 -1
- package/components/table/tr.js +0 -9
- package/components/table/tr.js.map +0 -1
- package/components/table/utils.js +0 -28
- package/components/table/utils.js.map +0 -1
- package/components/tabs/index.js +0 -117
- package/components/tabs/index.js.map +0 -1
- package/components/tabs/tab-panel.js +0 -35
- package/components/tabs/tab-panel.js.map +0 -1
- package/components/tabs/tab.js +0 -70
- package/components/tabs/tab.js.map +0 -1
- package/components/tabs/tabs.module.scss.js +0 -22
- package/components/tabs/tabs.module.scss.js.map +0 -1
- package/components/tabs/use-tabs-context.js +0 -16
- package/components/tabs/use-tabs-context.js.map +0 -1
- package/components/text/index.js +0 -112
- package/components/text/index.js.map +0 -1
- package/components/text/style.module.scss.js +0 -9
- package/components/text/style.module.scss.js.map +0 -1
- package/components/visualizations/bar-chart/horizontal-chart/dataset-value/index.js +0 -62
- package/components/visualizations/bar-chart/horizontal-chart/dataset-value/index.js.map +0 -1
- package/components/visualizations/bar-chart/horizontal-chart/dataset-value/style.module.css.js +0 -20
- package/components/visualizations/bar-chart/horizontal-chart/dataset-value/style.module.css.js.map +0 -1
- package/components/visualizations/bar-chart/horizontal-chart/index.js +0 -104
- package/components/visualizations/bar-chart/horizontal-chart/index.js.map +0 -1
- package/components/visualizations/bar-chart/horizontal-chart/legend/index.js +0 -13
- package/components/visualizations/bar-chart/horizontal-chart/legend/index.js.map +0 -1
- package/components/visualizations/bar-chart/horizontal-chart/legend/style.module.css.js +0 -14
- package/components/visualizations/bar-chart/horizontal-chart/legend/style.module.css.js.map +0 -1
- package/components/visualizations/bar-chart/horizontal-chart/style.module.css.js +0 -28
- package/components/visualizations/bar-chart/horizontal-chart/style.module.css.js.map +0 -1
- package/components/visualizations/bar-chart/index.js +0 -37
- package/components/visualizations/bar-chart/index.js.map +0 -1
- package/components/visualizations/bar-chart/style.module.css.js +0 -12
- package/components/visualizations/bar-chart/style.module.css.js.map +0 -1
- package/components/visualizations/donut-chart/components/arc-tooltip/index.js +0 -14
- package/components/visualizations/donut-chart/components/arc-tooltip/index.js.map +0 -1
- package/components/visualizations/donut-chart/components/arc-tooltip/styles.module.css.js +0 -10
- package/components/visualizations/donut-chart/components/arc-tooltip/styles.module.css.js.map +0 -1
- package/components/visualizations/donut-chart/components/external-arc-label/index.js +0 -58
- package/components/visualizations/donut-chart/components/external-arc-label/index.js.map +0 -1
- package/components/visualizations/donut-chart/components/external-arc-label/styles.module.css.js +0 -16
- package/components/visualizations/donut-chart/components/external-arc-label/styles.module.css.js.map +0 -1
- package/components/visualizations/donut-chart/components/internal-arc-label/index.js +0 -42
- package/components/visualizations/donut-chart/components/internal-arc-label/index.js.map +0 -1
- package/components/visualizations/donut-chart/components/internal-arc-label/styles.module.css.js +0 -14
- package/components/visualizations/donut-chart/components/internal-arc-label/styles.module.css.js.map +0 -1
- package/components/visualizations/donut-chart/index.js +0 -90
- package/components/visualizations/donut-chart/index.js.map +0 -1
- package/components/visualizations/donut-chart/styles.module.css.js +0 -20
- package/components/visualizations/donut-chart/styles.module.css.js.map +0 -1
- package/hooks/use-media-query/index.js +0 -16
- package/hooks/use-media-query/index.js.map +0 -1
- package/patterns/card/newsroom-card/index.js +0 -26
- package/patterns/card/newsroom-card/index.js.map +0 -1
- package/patterns/card/newsroom-card/style.module.css.js +0 -8
- package/patterns/card/newsroom-card/style.module.css.js.map +0 -1
- package/patterns/card/partner-card/index.js +0 -42
- package/patterns/card/partner-card/index.js.map +0 -1
- package/patterns/card/partner-card/style.module.css.js +0 -12
- package/patterns/card/partner-card/style.module.css.js.map +0 -1
- package/patterns/card/person-card/index.js +0 -52
- package/patterns/card/person-card/index.js.map +0 -1
- package/patterns/card/person-card/style.module.css.js +0 -12
- package/patterns/card/person-card/style.module.css.js.map +0 -1
- package/patterns/card/primitives.js +0 -77
- package/patterns/card/primitives.js.map +0 -1
- package/patterns/card/promo-card/index.js +0 -36
- package/patterns/card/promo-card/index.js.map +0 -1
- package/patterns/card/resource-card/index.js +0 -26
- package/patterns/card/resource-card/index.js.map +0 -1
- package/patterns/card/style.module.css.js +0 -30
- package/patterns/card/style.module.css.js.map +0 -1
- package/patterns/card/thumbnails/index.js +0 -25
- package/patterns/card/thumbnails/index.js.map +0 -1
- package/patterns/card/unified-card/index.js +0 -37
- package/patterns/card/unified-card/index.js.map +0 -1
- package/patterns/copy-button/clipboard.js +0 -78
- package/patterns/copy-button/clipboard.js.map +0 -1
- package/patterns/copy-button/index.js +0 -57
- package/patterns/copy-button/index.js.map +0 -1
- package/patterns/copy-button/style.module.css.js +0 -13
- package/patterns/copy-button/style.module.css.js.map +0 -1
- package/patterns/layout/index.js +0 -47
- package/patterns/layout/index.js.map +0 -1
- package/patterns/layout/layout.module.css.js +0 -20
- package/patterns/layout/layout.module.css.js.map +0 -1
- package/patterns/product-badge/index.js +0 -22
- package/patterns/product-badge/index.js.map +0 -1
- package/patterns/product-badge/style.module.css.js +0 -8
- package/patterns/product-badge/style.module.css.js.map +0 -1
- package/patterns/product-logo/index.js +0 -130
- package/patterns/product-logo/index.js.map +0 -1
- package/patterns/product-logo/product-logo.module.css.js +0 -13
- package/patterns/product-logo/product-logo.module.css.js.map +0 -1
- package/patterns/related-content/index.js +0 -65
- package/patterns/related-content/index.js.map +0 -1
- package/patterns/related-content/style.module.css.js +0 -22
- package/patterns/related-content/style.module.css.js.map +0 -1
- package/utils/get-contrast-yiq.js +0 -13
- package/utils/get-contrast-yiq.js.map +0 -1
- package/utils/hooks/use-screen-size.js +0 -10
- package/utils/hooks/use-screen-size.js.map +0 -1
- package/utils/i18n/constants/index.js +0 -98
- package/utils/i18n/constants/index.js.map +0 -1
- package/utils/i18n/helpers/locale-provider.js +0 -9
- package/utils/i18n/helpers/locale-provider.js.map +0 -1
- package/utils/i18n/helpers/to-smart-sentence-case.js +0 -12
- package/utils/i18n/helpers/to-smart-sentence-case.js.map +0 -1
- package/utils/i18n/helpers/to-smart-title-case.js +0 -10
- package/utils/i18n/helpers/to-smart-title-case.js.map +0 -1
- package/utils/i18n/helpers/use-locale.js +0 -14
- package/utils/i18n/helpers/use-locale.js.map +0 -1
- package/utils/i18n/index.js +0 -41
- package/utils/i18n/index.js.map +0 -1
- package/utils/i18n/index2.js +0 -33
- package/utils/i18n/index2.js.map +0 -1
- package/utils/make-normalizer/index.js +0 -34
- package/utils/make-normalizer/index.js.map +0 -1
- package/utils/mds-context/index.js.map +0 -1
package/components/card/index.js
DELETED
|
@@ -1,157 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import { jsxs as d, jsx as a, Fragment as v } from "react/jsx-runtime";
|
|
3
|
-
import { forwardRef as x } from "react";
|
|
4
|
-
import { CardThumbnail as k } from "./card-thumbnail/index.js";
|
|
5
|
-
import { useMDSLink as A } from "../../utils/mds-context/index.js";
|
|
6
|
-
import { Text as c } from "../text/index.js";
|
|
7
|
-
import g from "classnames";
|
|
8
|
-
import { Badge as E } from "../badge/index.js";
|
|
9
|
-
import { StandaloneLink as u } from "../standalone-link/index.js";
|
|
10
|
-
import { IconArrowRight24 as L } from "@hashicorp/flight-icons/svg-react/arrow-right-24";
|
|
11
|
-
import e from "./styles.module.css.js";
|
|
12
|
-
const f = x(
|
|
13
|
-
({
|
|
14
|
-
children: r,
|
|
15
|
-
className: o,
|
|
16
|
-
content: i,
|
|
17
|
-
ctaLabel: t,
|
|
18
|
-
href: n,
|
|
19
|
-
standaloneLink: l,
|
|
20
|
-
isExternal: s,
|
|
21
|
-
onClickCapture: m,
|
|
22
|
-
"aria-label": C
|
|
23
|
-
}, b) => {
|
|
24
|
-
const w = A(), p = n && !t, N = s ? { target: "_blank", rel: "noopener noreferrer" } : {};
|
|
25
|
-
return /* @__PURE__ */ d(
|
|
26
|
-
"div",
|
|
27
|
-
{
|
|
28
|
-
ref: b,
|
|
29
|
-
className: g(
|
|
30
|
-
e.card,
|
|
31
|
-
{ [e.interactive]: p },
|
|
32
|
-
o
|
|
33
|
-
),
|
|
34
|
-
children: [
|
|
35
|
-
p && /* @__PURE__ */ a(
|
|
36
|
-
w,
|
|
37
|
-
{
|
|
38
|
-
href: n,
|
|
39
|
-
className: e.link,
|
|
40
|
-
draggable: "false",
|
|
41
|
-
onClickCapture: m,
|
|
42
|
-
"aria-label": C,
|
|
43
|
-
...N
|
|
44
|
-
}
|
|
45
|
-
),
|
|
46
|
-
i && /* @__PURE__ */ a(
|
|
47
|
-
P,
|
|
48
|
-
{
|
|
49
|
-
badges: i.badges,
|
|
50
|
-
description: i.description,
|
|
51
|
-
eyebrow: i.eyebrow,
|
|
52
|
-
heading: i.heading,
|
|
53
|
-
subheading: i.subheading,
|
|
54
|
-
thumbnail: i.thumbnail,
|
|
55
|
-
showArrow: i.showArrow && !!p,
|
|
56
|
-
cta: {
|
|
57
|
-
ctaLabel: t,
|
|
58
|
-
href: n,
|
|
59
|
-
standaloneLink: l,
|
|
60
|
-
onClickCapture: m,
|
|
61
|
-
isExternal: s
|
|
62
|
-
}
|
|
63
|
-
}
|
|
64
|
-
),
|
|
65
|
-
r,
|
|
66
|
-
r && /* @__PURE__ */ a(
|
|
67
|
-
h,
|
|
68
|
-
{
|
|
69
|
-
ctaLabel: t,
|
|
70
|
-
href: n,
|
|
71
|
-
standaloneLink: l,
|
|
72
|
-
onClickCapture: m,
|
|
73
|
-
isExternal: s
|
|
74
|
-
}
|
|
75
|
-
)
|
|
76
|
-
]
|
|
77
|
-
}
|
|
78
|
-
);
|
|
79
|
-
}
|
|
80
|
-
);
|
|
81
|
-
f.displayName = "Card";
|
|
82
|
-
const P = ({
|
|
83
|
-
badges: r,
|
|
84
|
-
description: o,
|
|
85
|
-
eyebrow: i,
|
|
86
|
-
heading: t,
|
|
87
|
-
thumbnail: n,
|
|
88
|
-
subheading: l,
|
|
89
|
-
cta: s,
|
|
90
|
-
showArrow: m
|
|
91
|
-
}) => /* @__PURE__ */ d("div", { className: g(e.content, { [e["has-thumbnail"]]: n }), children: [
|
|
92
|
-
n && /* @__PURE__ */ a(k, { ...n }),
|
|
93
|
-
/* @__PURE__ */ d("div", { className: e.contentLockup, children: [
|
|
94
|
-
/* @__PURE__ */ a(B, { children: i }),
|
|
95
|
-
/* @__PURE__ */ a(z, { children: t }),
|
|
96
|
-
/* @__PURE__ */ a(D, { children: l }),
|
|
97
|
-
/* @__PURE__ */ a(T, { children: o }),
|
|
98
|
-
/* @__PURE__ */ a(j, { badges: r }),
|
|
99
|
-
s && /* @__PURE__ */ a(
|
|
100
|
-
h,
|
|
101
|
-
{
|
|
102
|
-
ctaLabel: s.ctaLabel,
|
|
103
|
-
href: s.href,
|
|
104
|
-
standaloneLink: s.standaloneLink,
|
|
105
|
-
isExternal: s.isExternal,
|
|
106
|
-
onClickCapture: s.onClickCapture
|
|
107
|
-
}
|
|
108
|
-
),
|
|
109
|
-
m ? /* @__PURE__ */ a("div", { className: e.arrow, children: /* @__PURE__ */ a(L, {}) }) : null
|
|
110
|
-
] })
|
|
111
|
-
] }), h = ({
|
|
112
|
-
href: r,
|
|
113
|
-
ctaLabel: o,
|
|
114
|
-
standaloneLink: i,
|
|
115
|
-
isExternal: t,
|
|
116
|
-
onClickCapture: n
|
|
117
|
-
}) => {
|
|
118
|
-
const l = r && !o;
|
|
119
|
-
if (i) {
|
|
120
|
-
const s = {
|
|
121
|
-
...i,
|
|
122
|
-
icon: i.icon || "chevron-right",
|
|
123
|
-
iconPosition: i.iconPosition || "trailing"
|
|
124
|
-
};
|
|
125
|
-
return /* @__PURE__ */ a(u, { className: e.cta, ...s });
|
|
126
|
-
}
|
|
127
|
-
return r && !l && o ? /* @__PURE__ */ a(
|
|
128
|
-
u,
|
|
129
|
-
{
|
|
130
|
-
className: e.cta,
|
|
131
|
-
text: o,
|
|
132
|
-
href: r,
|
|
133
|
-
icon: "chevron-right",
|
|
134
|
-
iconPosition: "trailing",
|
|
135
|
-
color: "secondary",
|
|
136
|
-
onClickCapture: n,
|
|
137
|
-
isHrefExternal: t
|
|
138
|
-
}
|
|
139
|
-
) : null;
|
|
140
|
-
}, B = ({ children: r }) => r ? Array.isArray(r) ? /* @__PURE__ */ a(S, { items: Array.from(r) }) : /* @__PURE__ */ a(y, { children: r }) : null, S = ({ items: r }) => /* @__PURE__ */ a("ul", { className: e.meta, children: r.map((o, i) => /* @__PURE__ */ d("li", { children: [
|
|
141
|
-
/* @__PURE__ */ a(y, { children: o }),
|
|
142
|
-
i < r.length - 1 ? /* @__PURE__ */ a("span", { className: e.metaSeparator, "aria-hidden": !0, children: "|" }) : null
|
|
143
|
-
] }, o)) }), y = ({ children: r }) => r ? /* @__PURE__ */ a(c.Label, { color: "faint", weight: "medium", children: r }) : null, z = ({ children: r }) => r ? /* @__PURE__ */ a(
|
|
144
|
-
c.DisplayExpressive,
|
|
145
|
-
{
|
|
146
|
-
tag: "span",
|
|
147
|
-
size: "200",
|
|
148
|
-
weight: "semibold",
|
|
149
|
-
color: "strong",
|
|
150
|
-
children: r
|
|
151
|
-
}
|
|
152
|
-
) : null, D = ({ children: r }) => r ? /* @__PURE__ */ a(c.Body, { tag: "span", size: "200", className: e.subheading, color: "primary", children: r }) : null, T = ({ children: r }) => r ? typeof r == "string" ? /* @__PURE__ */ a(c.Body, { tag: "span", size: "200", color: "primary", children: r }) : /* @__PURE__ */ a(v, { children: r }) : null, j = ({ badges: r }) => r && r.length > 0 ? /* @__PURE__ */ a("div", { className: e.badges, children: r.map((o) => /* @__PURE__ */ a(E, { ...o }, o.text)) }) : null;
|
|
153
|
-
f.displayName = "Card";
|
|
154
|
-
export {
|
|
155
|
-
f as Card
|
|
156
|
-
};
|
|
157
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/components/card/index.tsx"],"sourcesContent":["'use client'\n\nimport { forwardRef, type PropsWithChildren } from 'react'\nimport type { CardContentProps, CardProps, CardCtaProps } from './types'\nimport { CardThumbnail } from './card-thumbnail'\nimport { useMDSLink } from '../../utils/mds-context'\nimport { Text } from '../text'\nimport classNames from 'classnames'\nimport { Badge } from '../badge'\nimport { StandaloneLink } from '../standalone-link'\nimport { IconArrowRight24 } from '@hashicorp/flight-icons/svg-react/arrow-right-24'\nimport s from './styles.module.css'\n\nconst Card = forwardRef<HTMLDivElement, CardProps>(\n\t(\n\t\t{\n\t\t\tchildren,\n\t\t\tclassName,\n\t\t\tcontent,\n\t\t\tctaLabel,\n\t\t\thref,\n\t\t\tstandaloneLink,\n\t\t\tisExternal,\n\t\t\tonClickCapture,\n\t\t\t'aria-label': ariaLabel,\n\t\t},\n\t\tref\n\t) => {\n\t\tconst Link = useMDSLink()\n\n\t\tconst isCardLink = href && !ctaLabel\n\n\t\tconst linkProps = isExternal\n\t\t\t? { target: '_blank', rel: 'noopener noreferrer' }\n\t\t\t: {}\n\n\t\treturn (\n\t\t\t<div\n\t\t\t\tref={ref}\n\t\t\t\tclassName={classNames(\n\t\t\t\t\ts.card,\n\t\t\t\t\t{ [s.interactive]: isCardLink },\n\t\t\t\t\tclassName\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{isCardLink && (\n\t\t\t\t\t<Link\n\t\t\t\t\t\thref={href}\n\t\t\t\t\t\tclassName={s.link}\n\t\t\t\t\t\tdraggable=\"false\"\n\t\t\t\t\t\tonClickCapture={onClickCapture}\n\t\t\t\t\t\taria-label={ariaLabel}\n\t\t\t\t\t\t{...linkProps}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t{content && (\n\t\t\t\t\t<CardContent\n\t\t\t\t\t\tbadges={content.badges}\n\t\t\t\t\t\tdescription={content.description}\n\t\t\t\t\t\teyebrow={content.eyebrow}\n\t\t\t\t\t\theading={content.heading}\n\t\t\t\t\t\tsubheading={content.subheading}\n\t\t\t\t\t\tthumbnail={content.thumbnail}\n\t\t\t\t\t\tshowArrow={content.showArrow && !!isCardLink}\n\t\t\t\t\t\tcta={{\n\t\t\t\t\t\t\tctaLabel,\n\t\t\t\t\t\t\thref,\n\t\t\t\t\t\t\tstandaloneLink,\n\t\t\t\t\t\t\tonClickCapture,\n\t\t\t\t\t\t\tisExternal,\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t{children}\n\t\t\t\t{children && (\n\t\t\t\t\t<CardCta\n\t\t\t\t\t\tctaLabel={ctaLabel}\n\t\t\t\t\t\thref={href}\n\t\t\t\t\t\tstandaloneLink={standaloneLink}\n\t\t\t\t\t\tonClickCapture={onClickCapture}\n\t\t\t\t\t\tisExternal={isExternal}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t)\n\t}\n)\n\nCard.displayName = 'Card'\n\nconst CardContent = ({\n\tbadges,\n\tdescription,\n\teyebrow,\n\theading,\n\tthumbnail,\n\tsubheading,\n\tcta,\n\tshowArrow,\n}: CardContentProps) => {\n\treturn (\n\t\t<div className={classNames(s.content, { [s['has-thumbnail']]: thumbnail })}>\n\t\t\t{thumbnail && <CardThumbnail {...thumbnail} />}\n\t\t\t<div className={s.contentLockup}>\n\t\t\t\t<CardEyebrow>{eyebrow}</CardEyebrow>\n\t\t\t\t<CardHeading>{heading}</CardHeading>\n\t\t\t\t<CardSubheading>{subheading}</CardSubheading>\n\t\t\t\t<CardDescription>{description}</CardDescription>\n\t\t\t\t<Badges badges={badges} />\n\t\t\t\t{cta && (\n\t\t\t\t\t<CardCta\n\t\t\t\t\t\tctaLabel={cta.ctaLabel}\n\t\t\t\t\t\thref={cta.href}\n\t\t\t\t\t\tstandaloneLink={cta.standaloneLink}\n\t\t\t\t\t\tisExternal={cta.isExternal}\n\t\t\t\t\t\tonClickCapture={cta.onClickCapture}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t{showArrow ? (\n\t\t\t\t\t<div className={s.arrow}>\n\t\t\t\t\t\t<IconArrowRight24 />\n\t\t\t\t\t</div>\n\t\t\t\t) : null}\n\t\t\t</div>\n\t\t</div>\n\t)\n}\n\nconst CardCta = ({\n\thref,\n\tctaLabel,\n\tstandaloneLink,\n\tisExternal,\n\tonClickCapture,\n}: CardCtaProps) => {\n\tconst isCardLink = href && !ctaLabel\n\n\tif (standaloneLink) {\n\t\tconst standaloneLinkProps = {\n\t\t\t...standaloneLink,\n\t\t\ticon: standaloneLink.icon || 'chevron-right',\n\t\t\ticonPosition: standaloneLink.iconPosition || 'trailing',\n\t\t}\n\n\t\treturn <StandaloneLink className={s.cta} {...standaloneLinkProps} />\n\t}\n\n\tif (href && !isCardLink && ctaLabel) {\n\t\treturn (\n\t\t\t<StandaloneLink\n\t\t\t\tclassName={s.cta}\n\t\t\t\ttext={ctaLabel}\n\t\t\t\thref={href}\n\t\t\t\ticon=\"chevron-right\"\n\t\t\t\ticonPosition=\"trailing\"\n\t\t\t\tcolor=\"secondary\"\n\t\t\t\tonClickCapture={onClickCapture}\n\t\t\t\tisHrefExternal={isExternal}\n\t\t\t/>\n\t\t)\n\t}\n\n\treturn null\n}\n\nconst CardEyebrow = ({ children }: PropsWithChildren) => {\n\tif (!children) {\n\t\treturn null\n\t}\n\n\tif (Array.isArray(children)) {\n\t\treturn <CardEyebrowList items={Array.from(children)} />\n\t}\n\n\treturn <CardEyebrowText>{children}</CardEyebrowText>\n}\n\nconst CardEyebrowList = ({ items }: { items: string[] }) => (\n\t<ul className={s.meta}>\n\t\t{items.map((item, idx) => (\n\t\t\t<li key={item}>\n\t\t\t\t<CardEyebrowText>{item}</CardEyebrowText>\n\t\t\t\t{idx < items.length - 1 ? (\n\t\t\t\t\t<span className={s.metaSeparator} aria-hidden={true}>\n\t\t\t\t\t\t|\n\t\t\t\t\t</span>\n\t\t\t\t) : null}\n\t\t\t</li>\n\t\t))}\n\t</ul>\n)\n\nconst CardEyebrowText = ({ children }: PropsWithChildren) =>\n\tchildren ? (\n\t\t<Text.Label color=\"faint\" weight=\"medium\">\n\t\t\t{children}\n\t\t</Text.Label>\n\t) : null\n\nconst CardHeading = ({ children }: PropsWithChildren) =>\n\tchildren ? (\n\t\t<Text.DisplayExpressive\n\t\t\ttag=\"span\"\n\t\t\tsize=\"200\"\n\t\t\tweight=\"semibold\"\n\t\t\tcolor=\"strong\"\n\t\t>\n\t\t\t{children}\n\t\t</Text.DisplayExpressive>\n\t) : null\n\nconst CardSubheading = ({ children }: PropsWithChildren) =>\n\tchildren ? (\n\t\t<Text.Body tag=\"span\" size=\"200\" className={s.subheading} color=\"primary\">\n\t\t\t{children}\n\t\t</Text.Body>\n\t) : null\n\nconst CardDescription = ({ children }: PropsWithChildren) => {\n\tif (!children) {\n\t\treturn null\n\t}\n\n\tif (typeof children === 'string') {\n\t\treturn (\n\t\t\t<Text.Body tag=\"span\" size=\"200\" color=\"primary\">\n\t\t\t\t{children}\n\t\t\t</Text.Body>\n\t\t)\n\t}\n\n\treturn <>{children}</>\n}\n\nconst Badges = ({ badges }: { badges: CardContentProps['badges'] }) =>\n\tbadges && badges.length > 0 ? (\n\t\t<div className={s.badges}>\n\t\t\t{badges.map((badge) => (\n\t\t\t\t<Badge key={badge.text} {...badge} />\n\t\t\t))}\n\t\t</div>\n\t) : null\n\nCard.displayName = 'Card'\nexport { Card }\n"],"names":["Card","forwardRef","children","className","content","ctaLabel","href","standaloneLink","isExternal","onClickCapture","ariaLabel","ref","Link","useMDSLink","isCardLink","jsxs","classNames","s","jsx","linkProps","CardContent","CardCta","badges","description","eyebrow","heading","thumbnail","subheading","cta","showArrow","CardThumbnail","CardEyebrow","CardHeading","CardSubheading","CardDescription","IconArrowRight24","standaloneLinkProps","StandaloneLink","CardEyebrowList","CardEyebrowText","items","item","idx","Text","Fragment","Badges","badge","Badge"],"mappings":"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"}
|
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
const t = "card__HomZw", a = "interactive__Irpce", n = "arrow__qnBL7", c = "link__Dz3Nf", e = "cta__UfNG2", o = "content__SiycH", _ = "subheading__MM0J8", s = "contentLockup__08EYi", r = "badges__GrCpe", i = "meta__8eKyE", d = "metaSeparator__44API", m = {
|
|
2
|
-
card: t,
|
|
3
|
-
interactive: a,
|
|
4
|
-
arrow: n,
|
|
5
|
-
link: c,
|
|
6
|
-
cta: e,
|
|
7
|
-
content: o,
|
|
8
|
-
"has-thumbnail": "has-thumbnail__ftF14",
|
|
9
|
-
subheading: _,
|
|
10
|
-
contentLockup: s,
|
|
11
|
-
badges: r,
|
|
12
|
-
meta: i,
|
|
13
|
-
metaSeparator: d
|
|
14
|
-
};
|
|
15
|
-
export {
|
|
16
|
-
n as arrow,
|
|
17
|
-
r as badges,
|
|
18
|
-
t as card,
|
|
19
|
-
o as content,
|
|
20
|
-
s as contentLockup,
|
|
21
|
-
e as cta,
|
|
22
|
-
m as default,
|
|
23
|
-
a as interactive,
|
|
24
|
-
c as link,
|
|
25
|
-
i as meta,
|
|
26
|
-
d as metaSeparator,
|
|
27
|
-
_ as subheading
|
|
28
|
-
};
|
|
29
|
-
//# sourceMappingURL=styles.module.css.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"styles.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;"}
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
const e = "dark__aBMo7", n = "token__aGMSy", t = "title__nX-Ny", i = "description__-44hG", _ = "header__42Fek", a = "body__pLFmP", l = "code__J06se", o = {
|
|
2
|
-
"code-block": "code-block__dOm6M",
|
|
3
|
-
"line-highlight": "line-highlight__a84m6",
|
|
4
|
-
dark: e,
|
|
5
|
-
"language-css": "language-css__8iYaN",
|
|
6
|
-
token: n,
|
|
7
|
-
"language-javascript": "language-javascript__EWK5u",
|
|
8
|
-
"language-markup": "language-markup__E7NSA",
|
|
9
|
-
"language-html": "language-html__rLwMK",
|
|
10
|
-
"is-standalone": "is-standalone__WLWxy",
|
|
11
|
-
title: t,
|
|
12
|
-
description: i,
|
|
13
|
-
header: _,
|
|
14
|
-
body: a,
|
|
15
|
-
code: l,
|
|
16
|
-
"copy-button": "copy-button__nMsTD",
|
|
17
|
-
"line-highlight-first": "line-highlight-first__OMDUP",
|
|
18
|
-
"line-highlight-last": "line-highlight-last__qC6nm",
|
|
19
|
-
"line-numbers": "line-numbers__a9m-I",
|
|
20
|
-
"line-numbers-rows": "line-numbers-rows__MjGTO",
|
|
21
|
-
"line-of-code": "line-of-code__mDztA",
|
|
22
|
-
"line-number": "line-number__-g7V-"
|
|
23
|
-
};
|
|
24
|
-
export {
|
|
25
|
-
a as body,
|
|
26
|
-
l as code,
|
|
27
|
-
e as dark,
|
|
28
|
-
o as default,
|
|
29
|
-
i as description,
|
|
30
|
-
_ as header,
|
|
31
|
-
t as title,
|
|
32
|
-
n as token
|
|
33
|
-
};
|
|
34
|
-
//# sourceMappingURL=code-block.module.scss.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"code-block.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,59 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import { jsxs as c, Fragment as L, jsx as e } from "react/jsx-runtime";
|
|
3
|
-
import { useMemo as d } from "react";
|
|
4
|
-
import u from "classnames";
|
|
5
|
-
import G from "../utils/parse-highlighted-lines.js";
|
|
6
|
-
import N from "./utils/split-jsx-into-lines.js";
|
|
7
|
-
import b from "./utils/split-html-into-lines.js";
|
|
8
|
-
import h from "../code-block.module.scss.js";
|
|
9
|
-
const S = ({
|
|
10
|
-
value: n,
|
|
11
|
-
hasLineNumbers: I,
|
|
12
|
-
highlightLines: f
|
|
13
|
-
}) => {
|
|
14
|
-
const o = G(f), m = d(() => (typeof n == "string" ? b(n) : N(n)).map((g, l) => {
|
|
15
|
-
const t = l + 1, s = o.indexOf(t) !== -1;
|
|
16
|
-
return { children: g, highlight: s };
|
|
17
|
-
}).map(({ highlight: g, ...l }, t, s) => {
|
|
18
|
-
const p = t === 0 ? null : s[t - 1], a = t === s.length - 1 ? null : s[t + 1];
|
|
19
|
-
return {
|
|
20
|
-
...l,
|
|
21
|
-
highlight: g,
|
|
22
|
-
highlightIsFirstInGroup: !p || !p.highlight,
|
|
23
|
-
highlightIsLastInGroup: !a || !a.highlight
|
|
24
|
-
};
|
|
25
|
-
}), [n, o]);
|
|
26
|
-
return /* @__PURE__ */ c(L, { children: [
|
|
27
|
-
I ? /* @__PURE__ */ e("span", { "aria-hidden": "true", className: h["line-numbers-rows"], children: m.map((i, r) => /* @__PURE__ */ e(
|
|
28
|
-
"span",
|
|
29
|
-
{
|
|
30
|
-
className: u(h["line-number"], {
|
|
31
|
-
[h["line-highlight"]]: i.highlight,
|
|
32
|
-
[h["line-highlight-first"]]: i.highlightIsFirstInGroup,
|
|
33
|
-
[h["line-highlight-last"]]: i.highlightIsLastInGroup
|
|
34
|
-
})
|
|
35
|
-
},
|
|
36
|
-
r
|
|
37
|
-
)) }) : null,
|
|
38
|
-
/* @__PURE__ */ e("span", { children: m.map((i, r) => /* @__PURE__ */ c(
|
|
39
|
-
"span",
|
|
40
|
-
{
|
|
41
|
-
className: u(h["line-of-code"], {
|
|
42
|
-
[h["line-highlight"]]: i.highlight,
|
|
43
|
-
[h["line-highlight-first"]]: i.highlightIsFirstInGroup,
|
|
44
|
-
[h["line-highlight-last"]]: i.highlightIsLastInGroup
|
|
45
|
-
}),
|
|
46
|
-
children: [
|
|
47
|
-
i.children,
|
|
48
|
-
`
|
|
49
|
-
`
|
|
50
|
-
]
|
|
51
|
-
},
|
|
52
|
-
r
|
|
53
|
-
)) })
|
|
54
|
-
] });
|
|
55
|
-
};
|
|
56
|
-
export {
|
|
57
|
-
S as CodeLines
|
|
58
|
-
};
|
|
59
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/components/code-block/code-lines/index.tsx"],"sourcesContent":["'use client'\n\n/**\n * Note: lines of code are expected to be stable. If we need to work with\n * dynamic code blocks in the future, we could assign random unique IDs\n * to each line during the `linesOfCode` `useMemo` function.\n *\n * For now, we disable react/no-array-index key for the entire file.\n */\n/* eslint-disable react/no-array-index-key */\n\nimport { useMemo, type ReactNode } from 'react'\nimport classNames from 'classnames'\nimport parseHighlightedLines from '../utils/parse-highlighted-lines'\nimport splitJsxIntoLines from './utils/split-jsx-into-lines'\nimport splitHtmlIntoLines from './utils/split-html-into-lines'\nimport s from '../code-block.module.scss'\n\ninterface CodeLinesProps {\n\tvalue: ReactNode\n\thasLineNumbers?: boolean\n\thighlightLines?: string\n}\n\n/**\n * Render the provided code into separate line elements,\n * accounting for all provided options.\n */\nconst CodeLines = ({\n\tvalue,\n\thasLineNumbers: lineNumbers,\n\thighlightLines: highlight,\n}: CodeLinesProps) => {\n\t// Parse out an array of integers representing which lines to highlight\n\tconst highlightedLines = parseHighlightedLines(highlight) as number[]\n\n\t/**\n\t * Split the incoming code into lines.\n\t * We need to do this in order to render each line of code in a\n\t * separate element, which is necessary for features such as highlighting\n\t * specific lines and allowing code to wrap.\n\t */\n\tconst linesOfCode = useMemo(() => {\n\t\tconst isHtmlString = typeof value === 'string'\n\t\tconst lineElements = isHtmlString\n\t\t\t? splitHtmlIntoLines(value)\n\t\t\t: splitJsxIntoLines(value)\n\t\treturn lineElements\n\t\t\t.map((children, index) => {\n\t\t\t\tconst number = index + 1\n\t\t\t\tconst highlight = highlightedLines.indexOf(number) !== -1\n\t\t\t\treturn { children, highlight }\n\t\t\t})\n\t\t\t.map(({ highlight, ...rest }, index, lines) => {\n\t\t\t\t// Add properties to help with highlighting adjacent lines of code,\n\t\t\t\t// in which case we want to apply a border to the first and last lines,\n\t\t\t\t// but not the lines in the middle of the group.\n\t\t\t\tconst prevLine = index === 0 ? null : lines[index - 1]\n\t\t\t\tconst nextLine = index === lines.length - 1 ? null : lines[index + 1]\n\t\t\t\treturn {\n\t\t\t\t\t...rest,\n\t\t\t\t\thighlight,\n\t\t\t\t\thighlightIsFirstInGroup: !prevLine || !prevLine.highlight,\n\t\t\t\t\thighlightIsLastInGroup: !nextLine || !nextLine.highlight,\n\t\t\t\t}\n\t\t\t})\n\t}, [value, highlightedLines])\n\n\t/**\n\t * For overflowing code, we use a two-column layout.\n\t * The first column contains line numbers, and is effectively fixed.\n\t * The second column contains the lines themselves, and is an overflow\n\t * container to allow extra long lines to scroll as needed.\n\t */\n\treturn (\n\t\t<>\n\t\t\t{lineNumbers ? (\n\t\t\t\t<span aria-hidden=\"true\" className={s['line-numbers-rows']}>\n\t\t\t\t\t{linesOfCode.map((line, idx) => (\n\t\t\t\t\t\t<span\n\t\t\t\t\t\t\tkey={idx}\n\t\t\t\t\t\t\tclassName={classNames(s['line-number'], {\n\t\t\t\t\t\t\t\t[s['line-highlight']]: line.highlight,\n\t\t\t\t\t\t\t\t[s['line-highlight-first']]: line.highlightIsFirstInGroup,\n\t\t\t\t\t\t\t\t[s['line-highlight-last']]: line.highlightIsLastInGroup,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\t\t\t\t</span>\n\t\t\t) : null}\n\t\t\t<span>\n\t\t\t\t{linesOfCode.map((line, idx) => (\n\t\t\t\t\t<span\n\t\t\t\t\t\tkey={idx}\n\t\t\t\t\t\tclassName={classNames(s['line-of-code'], {\n\t\t\t\t\t\t\t[s['line-highlight']]: line.highlight,\n\t\t\t\t\t\t\t[s['line-highlight-first']]: line.highlightIsFirstInGroup,\n\t\t\t\t\t\t\t[s['line-highlight-last']]: line.highlightIsLastInGroup,\n\t\t\t\t\t\t})}\n\t\t\t\t\t>\n\t\t\t\t\t\t{line.children}\n\t\t\t\t\t\t{/* We are _not_ rendering our lines as block elements, so we need\n\t\t\t\t\t\t to add a trailing newline to all lines. As well, trailing\n\t\t\t\t\t\t\t\tnewlines are necessary for some browsers (FireFox)\n\t\t\t\t\t\t to preserve whitespace during select-and-copy of code */}\n\t\t\t\t\t\t{'\\n'}\n\t\t\t\t\t</span>\n\t\t\t\t))}\n\t\t\t</span>\n\t\t</>\n\t)\n}\n\nexport { CodeLines }\n"],"names":["CodeLines","value","lineNumbers","highlight","highlightedLines","parseHighlightedLines","useMemo","splitHtmlIntoLines","splitJsxIntoLines","children","index","number","highlight2","rest","prevLine","lines","nextLine","jsxs","Fragment","jsx","s","linesOfCode","line","idx","classNames"],"mappings":";;;;;;;;AA4BmB,MAClBA,IAAA,CAAA;AAAA,EACA,OAAAC;AAAA,EACA,gBAAgBC;AAAA,EACjB,gBAAsBC;AAErB;AAQA,QAAMC,IAAcC,EAAcF,CAAA,OAC3BG,EAAe,OACA,OAAAL,KAClB,WAGcM,EAAUN,CAAA,IAAAO,EAAAP,CAAA,GACV,KAAQQ,GAAAC,MAAA;AACvB,UAAMP,IAAAA,IAAY,OACCC,UAAUO,CAAA,MAAA;AAC7B,aACO,UAAAF,GAAAN,WAAAA;EAIP,CAAA,EAAA,IAAA,CAAM,EAAA,WAAWS,GAAc,GAAAC,EAAO,GAAAH,SAAe;AACrD,UAAMI,IAAWJ,MAAU,IAAA,OAAMK,MAAa,CAAO,GACrDC,IAAON,MAAAK,EAAA,SAAA,IAAA,OAAAA,EAAAL,IAAA,CAAA;AAAA,WACH;AAAA,MACH,GAAAG;AAAA,MACA,WAAAD;AAAA,MACA,yBAAyB,MAAa,GAAS;AAAA,MAChD,wBAAA,CAAAI,KAAA,CAAAA,EAAA;AAAA,IACA;AAAA,EACH,CAAG,QASF,CAAA;AACE,SAAA,gBAAAC,EAAAC,GACC,EAAA,UAAK;AAAA,IAEJhB,IAAC,gBAAAiB,EAAA,QAAA,EAAA,eAAA,QAAA,WAAAC,EAAA,mBAAA,GAAA,UAAAC,EAAA,IAAA,CAAAC,GAAAC,MAAA,gBAAAJ;AAAA,MAAA;AAAA,MAAA;AAAA,QAEwC,WACpCK,EAAiBJ,EAAA,aAAQ,GAAA;AAAA,UAC5B,CAACA,EAAE,gBAAA,CAAA,GAAAE,EAAuB;AAAA,UAC1B,CAACF,EAAE,sBAAsB,CAAA,KAAQ;AAAA,UACjC,CAAAA,EAAA,qBAAA,CAAA,GAAAE,EAAA;AAAA,QAAA,CAAA;AAAA,MALI;AAAA;IASL,CAAA,EAAA,CAAA,IAAA;AAAA,IAGD,gBAAAH,EAAA,QAAA,EAAA,UAAAE,EAAA,IAAA,CAAAC,GAAAC,MAAA,gBAAAN;AAAA,MAAA;AAAA,MAAA;AAAA,QAEyC,WACrCO,EAAiBJ,EAAA,cAAQ,GAAA;AAAA,UAC5B,CAACA,EAAE,gBAAA,CAAA,GAAAE,EAAuB;AAAA,UAC1B,CAACF,EAAE,sBAAsB,CAAA,KAAQ;AAAA,UACjC,CAAAA,EAAA,qBAAA,CAAA,GAAAE,EAAA;AAAA,QAEA;QAAA,UAAK;AAAA,UAKLA,EAAA;AAAA,UAAA;AAAA;AAAA,QAAA;AAAA,MAZI;AAAA,MAcNC;AAAA,KAEH,EAAA,CAAA;AAAA,EAEF,EAAA,CAAA;;"}
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
import { jsx as e } from "react/jsx-runtime";
|
|
2
|
-
const r = '<span class="line"></span>';
|
|
3
|
-
function p(t) {
|
|
4
|
-
const s = t.split(`
|
|
5
|
-
`);
|
|
6
|
-
return s.map((n, i) => i == s.length - 1 && n == "" ? null : /* @__PURE__ */ e(
|
|
7
|
-
"span",
|
|
8
|
-
{
|
|
9
|
-
dangerouslySetInnerHTML: {
|
|
10
|
-
__html: n === "" || n === r ? " " : n
|
|
11
|
-
}
|
|
12
|
-
},
|
|
13
|
-
i
|
|
14
|
-
));
|
|
15
|
-
}
|
|
16
|
-
export {
|
|
17
|
-
p as default
|
|
18
|
-
};
|
|
19
|
-
//# sourceMappingURL=split-html-into-lines.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"split-html-into-lines.js","sources":["../../../../../src/components/code-block/code-lines/utils/split-html-into-lines.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\n\nconst SHIKI_BLANK_LINE = '<span class=\"line\"></span>'\n/**\n * Given a string of HTML, split it on newlines,\n * and return an array of React <span> elements,\n * each of which will contain a single line.\n *\n * Note that HTML tokens should not be multi-line,\n * ie, all newline characters should be surfaced\n * to the top level rather than nested in syntax\n * highlighting tokens (otherwise the line-by-line\n * markup we render would be invalid). We have\n * a rehype plugin we use with our highlightString()\n * utility to ensure newlines are surfaced in this way.\n *\n * @param {string} codeHtml String of HTML\n * @returns Array of JSX <span> elements\n */\nfunction splitHtmlIntoLines(codeHtml: string): (ReactNode | null)[] {\n\tconst lineParts = codeHtml.split('\\n')\n\treturn lineParts.map((lineHtml, stableIdx) => {\n\t\t// Cut trailing newlines\n\t\tconst isLastLine = stableIdx == lineParts.length - 1\n\t\tconst isTrailingNewline = isLastLine && lineHtml == ''\n\t\tif (isTrailingNewline) return null\n\t\t// Otherwise, render the line\n\t\treturn (\n\t\t\t<span\n\t\t\t\t// This array is stable, so we can use index as key\n\t\t\t\t// eslint-disable-next-line react/no-array-index-key\n\t\t\t\tkey={stableIdx}\n\t\t\t\tdangerouslySetInnerHTML={{\n\t\t\t\t\t__html:\n\t\t\t\t\t\tlineHtml === '' || lineHtml === SHIKI_BLANK_LINE\n\t\t\t\t\t\t\t? ' '\n\t\t\t\t\t\t\t: lineHtml,\n\t\t\t\t}}\n\t\t\t/>\n\t\t)\n\t})\n}\n\nexport default splitHtmlIntoLines\n"],"names":["SHIKI_BLANK_LINE","splitHtmlIntoLines","codeHtml","lineParts","lineHtml","stableIdx","jsx"],"mappings":";AAEA,MAAMA,IAAmB;AAiBzB,SAASC,EAAmBC,GAAwC;AACnE,QAAMC,IAAYD,EAAS,MAAM;AAAA,CAAI;AACrC,SAAOC,EAAU,IAAI,CAACC,GAAUC,MAEZA,KAAaF,EAAU,SAAS,KACXC,KAAY,KACtB,OAG7B,gBAAAE;AAAA,IAAC;AAAA,IAAA;AAAA,MAIA,yBAAyB;AAAA,QACxB,QACCF,MAAa,MAAMA,MAAaJ,IAC7B,WACAI;AAAA,MAAA;AAAA,IACL;AAAA,IANKC;AAAA,EAAA,CASP;AACF;"}
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
import { Children as f } from "react";
|
|
2
|
-
function h(u) {
|
|
3
|
-
const i = f.toArray(u).map((e) => typeof e == "object" && "props" in e && e.props.className?.includes("empty-line") ? `
|
|
4
|
-
` : e);
|
|
5
|
-
return i.reduce(
|
|
6
|
-
(e, n, o) => {
|
|
7
|
-
const s = o === i.length - 1, t = n === `
|
|
8
|
-
`, r = n !== `
|
|
9
|
-
`;
|
|
10
|
-
t && e.consecutiveNewlines++;
|
|
11
|
-
const p = t && s, N = e.consecutiveNewlines > 0;
|
|
12
|
-
if ((r || p) && N) {
|
|
13
|
-
e.currentLine.length > 0 && (e.lines.push(e.currentLine), e.currentLine = []);
|
|
14
|
-
for (let l = 1; l < e.consecutiveNewlines; l++)
|
|
15
|
-
e.lines.push("");
|
|
16
|
-
e.consecutiveNewlines = 0;
|
|
17
|
-
}
|
|
18
|
-
return r && (e.currentLine.push(n), s && e.lines.push(e.currentLine)), e;
|
|
19
|
-
},
|
|
20
|
-
{
|
|
21
|
-
lines: [],
|
|
22
|
-
currentLine: [],
|
|
23
|
-
consecutiveNewlines: 1
|
|
24
|
-
// Start at 1 to handle leading newlines
|
|
25
|
-
}
|
|
26
|
-
).lines;
|
|
27
|
-
}
|
|
28
|
-
export {
|
|
29
|
-
h as default
|
|
30
|
-
};
|
|
31
|
-
//# sourceMappingURL=split-jsx-into-lines.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"split-jsx-into-lines.js","sources":["../../../../../src/components/code-block/code-lines/utils/split-jsx-into-lines.ts"],"sourcesContent":["import { Children, type ReactNode } from 'react'\n\n/**\n * Given an array of React children,\n * split the array on newlines, grouping consecutive\n * non-newline tokens in individual line elements,\n * and return an array of React <span> elements,\n * each of which will contain a single line.\n *\n * Note that JSX tokens should not be multi-line,\n * ie, all newline characters should be surfaced\n * to the top level rather than nested in syntax\n * highlighting tokens (otherwise the line-by-line\n * markup we render would be invalid). We have\n * a rehype plugin we include with our markdown defaults\n * to ensure newlines are surfaced in this way.\n *\n * @param {*} codeJsx Array of JSX elements, some of which may be newline strings\n * @returns Array of JSX <span> elements representing individual lines\n */\nfunction splitJsxIntoLines(codeJsx: React.ReactNode | React.ReactNode[]) {\n\tconst linesArray = Children.toArray(codeJsx)\n\t/**\n\t * Many newlines take the form of a literal newline string, `\\n`.\n\t * However, some newlines take different forms. We expect these to be tagged\n\t * with an `empty-line` className by our rehype code plugins.\n\t * Here we detect the latter types of newline, and convert them to the former.\n\t */\n\tconst withNormalizedNewlines = linesArray.map((token) => {\n\t\t// If our token has an `empty-line` className, use a literal newline\n\t\t// rather than the token itself (which would render, but with zero height)\n\t\tif (typeof token === 'object' && 'props' in token) {\n\t\t\tif (token.props.className?.includes('empty-line')) {\n\t\t\t\treturn '\\n'\n\t\t\t}\n\t\t}\n\t\t// Otherwise, return the token unmodified\n\t\treturn token\n\t})\n\t// Filter out any surfaces newlines, that are \"in between\"\n\t// other lines of code. Special exceptions should be made for:\n\t// 1. newlines at start or end of array - should be rendered as blank lines\n\t// 2. consecutive newlines - \"n\" consecutive newlines should be rendered\n\t// as \"n - 1\" blank lines.\n\tconst accumulatedLines = withNormalizedNewlines.reduce(\n\t\t(acc, token, idx) => {\n\t\t\tconst isLastLine = idx === withNormalizedNewlines.length - 1\n\t\t\tconst isNewline = token === '\\n'\n\t\t\tconst isInlineToken = token !== '\\n'\n\t\t\t// For newlines, increment the consecutive newline counter\n\t\t\tif (isNewline) acc.consecutiveNewlines++\n\t\t\t// If this token is an inline token, and we have\n\t\t\t// pending newlines, then start a new line,\n\t\t\t// adding blank lines for consecutive newlines as needed\n\t\t\tconst isFinalNewline = isNewline && isLastLine\n\t\t\tconst hasNewlines = acc.consecutiveNewlines > 0\n\t\t\tconst needsNewlines = (isInlineToken || isFinalNewline) && hasNewlines\n\t\t\tif (needsNewlines) {\n\t\t\t\t// If there are any tokens in the current line, add them as a new line\n\t\t\t\tif (acc.currentLine.length > 0) {\n\t\t\t\t\tacc.lines.push(acc.currentLine)\n\t\t\t\t\tacc.currentLine = []\n\t\t\t\t}\n\t\t\t\t// Add blank lines for each consecutive newline, then reset the counter\n\t\t\t\tfor (let i = 1; i < acc.consecutiveNewlines; i++) {\n\t\t\t\t\tacc.lines.push('')\n\t\t\t\t}\n\t\t\t\tacc.consecutiveNewlines = 0\n\t\t\t}\n\t\t\t// If this token is an inline token,\n\t\t\t// append it to the current line\n\t\t\tif (isInlineToken) {\n\t\t\t\tacc.currentLine.push(token)\n\t\t\t\t// If this is the last line,\n\t\t\t\t// then ensure the current line\n\t\t\t\t// has been pushed to the lines array\n\t\t\t\tif (isLastLine) acc.lines.push(acc.currentLine)\n\t\t\t}\n\t\t\treturn acc\n\t\t},\n\t\t{\n\t\t\tlines: [] as ReactNode[],\n\t\t\tcurrentLine: [] as ReactNode[],\n\t\t\tconsecutiveNewlines: 1, // Start at 1 to handle leading newlines\n\t\t}\n\t)\n\treturn accumulatedLines.lines\n}\n\nexport default splitJsxIntoLines\n"],"names":["splitJsxIntoLines","codeJsx","withNormalizedNewlines","Children","token","acc","idx","isLastLine","isNewline","isInlineToken","isFinalNewline","hasNewlines","i"],"mappings":";AAoBA,SAASA,EAAkBC,GAA8C;AAQxE,QAAMC,IAPaC,EAAS,QAAQF,CAAO,EAOD,IAAI,CAACG,MAG1C,OAAOA,KAAU,YAAY,WAAWA,KACvCA,EAAM,MAAM,WAAW,SAAS,YAAY,IACxC;AAAA,IAIFA,CACP;AAgDD,SA1CyBF,EAAuB;AAAA,IAC/C,CAACG,GAAKD,GAAOE,MAAQ;AACpB,YAAMC,IAAaD,MAAQJ,EAAuB,SAAS,GACrDM,IAAYJ,MAAU;AAAA,GACtBK,IAAgBL,MAAU;AAAA;AAEhC,MAAII,KAAWH,EAAI;AAInB,YAAMK,IAAiBF,KAAaD,GAC9BI,IAAcN,EAAI,sBAAsB;AAE9C,WADuBI,KAAiBC,MAAmBC,GACxC;AAElB,QAAIN,EAAI,YAAY,SAAS,MAC5BA,EAAI,MAAM,KAAKA,EAAI,WAAW,GAC9BA,EAAI,cAAc,CAAA;AAGnB,iBAASO,IAAI,GAAGA,IAAIP,EAAI,qBAAqBO;AAC5C,UAAAP,EAAI,MAAM,KAAK,EAAE;AAElB,QAAAA,EAAI,sBAAsB;AAAA,MAC3B;AAGA,aAAII,MACHJ,EAAI,YAAY,KAAKD,CAAK,GAItBG,KAAYF,EAAI,MAAM,KAAKA,EAAI,WAAW,IAExCA;AAAA,IACR;AAAA,IACA;AAAA,MACC,OAAO,CAAA;AAAA,MACP,aAAa,CAAA;AAAA,MACb,qBAAqB;AAAA;AAAA,IAAA;AAAA,EACtB,EAEuB;AACzB;"}
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import { jsx as t } from "react/jsx-runtime";
|
|
3
|
-
import { forwardRef as s, useState as i, useEffect as l } from "react";
|
|
4
|
-
const f = ({ code: e }, n) => {
|
|
5
|
-
const [r, o] = i(!1);
|
|
6
|
-
return l(() => {
|
|
7
|
-
o(!0);
|
|
8
|
-
}, []), r ? /* @__PURE__ */ t("pre", { ref: n, style: { display: "none" }, children: typeof e == "string" ? /* @__PURE__ */ t("span", { dangerouslySetInnerHTML: { __html: e } }) : e }) : null;
|
|
9
|
-
}, C = s(f);
|
|
10
|
-
export {
|
|
11
|
-
C as HiddenCopyContent
|
|
12
|
-
};
|
|
13
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/components/code-block/hidden-copy-content/index.tsx"],"sourcesContent":["'use client'\n\nimport { forwardRef, useEffect, useState, type ReactNode } from 'react'\n\n/**\n * This hidden element acts solely as a container\n * that we can fetch textContent to copy to clipboard.\n * This allows to ignore the \"how will we copy this cleanly\"\n * concern when splitting code into lines, and adding\n * line numbers and so on in other parts of code-block.\n */\nconst HiddenCopyContentComponent = (\n\t{ code }: { code: ReactNode },\n\tcopyRef: React.ForwardedRef<HTMLPreElement>\n) => {\n\tconst [isClient, setIsClient] = useState(false)\n\n\tuseEffect(() => {\n\t\tsetIsClient(true)\n\t}, [])\n\n\t/**\n\t * We are avoiding SSR here as this component is only used for the copy-to-clipboard interaction, and so rendering\n\t * the text content of the code introduces duplicate markup and some difficult-to-debug hydration mismatches.\n\t * By the time someone interacts with the copy-to-clipboard functionality, this should be rendered.\n\t */\n\tif (!isClient) return null\n\n\treturn (\n\t\t<pre ref={copyRef} style={{ display: 'none' }}>\n\t\t\t{typeof code === 'string' ? (\n\t\t\t\t<span dangerouslySetInnerHTML={{ __html: code }} />\n\t\t\t) : (\n\t\t\t\tcode\n\t\t\t)}\n\t\t</pre>\n\t)\n}\n\nconst HiddenCopyContent = forwardRef(HiddenCopyContentComponent)\n\nexport { HiddenCopyContent }\n"],"names":["HiddenCopyContentComponent","code","copyRef","isClient","setIsClient","useState","useEffect","jsx"],"mappings":";;;AAeC,MAAAA,IAAgC,CAAA,EAAA,MAAAC,EAAS,GAAAC,MAAK;AAE9C,QAAA,CAAAC,GAAgBC,CAAA,IAAAC,EAAA,EAAA;AAWhB,SAVCC,EAAA,MAAY;AACb,IAAAF,EAAK,EAAA;AAAA,EAOL,GAAA,CAAI,CAAC,OAWN,gBAAAG,EAAA,OAAA,EAAA,KAAAL,GAAA,OAAA,EAAA,SAAA,OAAA,GAAA,UAAA,OAAAD,KAAA,WAAA,gBAAAM,EAAA,QAAA,EAAA,yBAAA,EAAA,QAAAN,EAAA,EAAA,CAAA,IAAAA,EAAA,CAAA;AAEA;"}
|
|
@@ -1,88 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import { jsxs as t, jsx as o } from "react/jsx-runtime";
|
|
3
|
-
import { useRef as h, useId as x } from "react";
|
|
4
|
-
import N from "classnames";
|
|
5
|
-
import { Text as a } from "../text/index.js";
|
|
6
|
-
import { CodeLines as b } from "./code-lines/index.js";
|
|
7
|
-
import { HiddenCopyContent as k } from "./hidden-copy-content/index.js";
|
|
8
|
-
import B from "./utils/process-snippet.js";
|
|
9
|
-
import { CopyButton as g } from "../../patterns/copy-button/index.js";
|
|
10
|
-
import e from "./code-block.module.scss.js";
|
|
11
|
-
const w = ({
|
|
12
|
-
title: r,
|
|
13
|
-
description: s,
|
|
14
|
-
language: c,
|
|
15
|
-
value: i,
|
|
16
|
-
isStandalone: p = !0,
|
|
17
|
-
hasCopyButton: f,
|
|
18
|
-
hasLineNumbers: n = !0,
|
|
19
|
-
highlightLines: u,
|
|
20
|
-
maxHeight: y = "auto",
|
|
21
|
-
className: C
|
|
22
|
-
}) => {
|
|
23
|
-
const d = h(null), l = x();
|
|
24
|
-
return /* @__PURE__ */ t(
|
|
25
|
-
"div",
|
|
26
|
-
{
|
|
27
|
-
className: N(
|
|
28
|
-
e["code-block"],
|
|
29
|
-
e.dark,
|
|
30
|
-
{
|
|
31
|
-
[e[`language-${c}`]]: c,
|
|
32
|
-
[e["is-standalone"]]: p,
|
|
33
|
-
[e["line-numbers"]]: n
|
|
34
|
-
},
|
|
35
|
-
C
|
|
36
|
-
),
|
|
37
|
-
children: [
|
|
38
|
-
/* @__PURE__ */ t("div", { className: e.header, children: [
|
|
39
|
-
r && /* @__PURE__ */ o(
|
|
40
|
-
a.HDSBody,
|
|
41
|
-
{
|
|
42
|
-
size: "200",
|
|
43
|
-
tag: "p",
|
|
44
|
-
weight: "semibold",
|
|
45
|
-
className: e.title,
|
|
46
|
-
children: r
|
|
47
|
-
}
|
|
48
|
-
),
|
|
49
|
-
s && /* @__PURE__ */ o(a.HDSBody, { tag: "p", size: "100", className: e.description, children: s })
|
|
50
|
-
] }),
|
|
51
|
-
/* @__PURE__ */ t("div", { className: e.body, children: [
|
|
52
|
-
/* @__PURE__ */ o(k, { code: i, ref: d }),
|
|
53
|
-
/* @__PURE__ */ o("pre", { className: e.code, id: l, style: { maxHeight: y }, children: /* @__PURE__ */ o("code", { children: /* @__PURE__ */ o(
|
|
54
|
-
b,
|
|
55
|
-
{
|
|
56
|
-
value: i,
|
|
57
|
-
highlightLines: u,
|
|
58
|
-
hasLineNumbers: n
|
|
59
|
-
}
|
|
60
|
-
) }) }),
|
|
61
|
-
f && /* @__PURE__ */ o(
|
|
62
|
-
g,
|
|
63
|
-
{
|
|
64
|
-
className: e["copy-button"],
|
|
65
|
-
"aria-describedby": l,
|
|
66
|
-
getTextFn: () => {
|
|
67
|
-
const m = d.current?.textContent;
|
|
68
|
-
if (!m)
|
|
69
|
-
throw new Error(
|
|
70
|
-
"`code-block` - Couldn't find text content to copy."
|
|
71
|
-
);
|
|
72
|
-
return B(m);
|
|
73
|
-
},
|
|
74
|
-
text: "Copy",
|
|
75
|
-
isIconOnly: !0,
|
|
76
|
-
size: "small"
|
|
77
|
-
}
|
|
78
|
-
)
|
|
79
|
-
] })
|
|
80
|
-
]
|
|
81
|
-
}
|
|
82
|
-
);
|
|
83
|
-
};
|
|
84
|
-
w.displayName = "CodeBlock";
|
|
85
|
-
export {
|
|
86
|
-
w as CodeBlock
|
|
87
|
-
};
|
|
88
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/components/code-block/index.tsx"],"sourcesContent":["'use client'\n\nimport { useId, useRef, type ReactNode } from 'react'\nimport classNames from 'classnames'\nimport { Text } from '../text'\nimport { CodeLines } from './code-lines'\nimport { HiddenCopyContent } from './hidden-copy-content'\nimport processSnippet from './utils/process-snippet'\nimport { CopyButton } from '../../patterns/copy-button'\nimport s from './code-block.module.scss'\n\n/**\n * ALERT: This component is a combination of logic from the official HashiCorp\n * Design System CodeBlock component and the CodeBlock component written by the\n * Web Presence Team. The official component relies on client-side rendering\n * for the calculation of line-heights for line numbers, but this is something\n * we want to be able to achieve without client-side rendering.\n */\n\ninterface CodeBlockProps {\n\t/**\n\t * The text/code content for the CodeBlock. The component encodes this\n\t * argument before displaying it. Should be a pre-highlighted string\n\t * generated by Prism.js or Shiki.\n\t */\n\tvalue: ReactNode\n\n\t/**\n\t * The coding language to use for syntax highlighting. If you need\n\t * additional languages contact the Design Systems Team.\n\t */\n\tlanguage?: string\n\n\t/**\n\t * Applies rounded borders to the component. When used within another\n\t * component or when the context requires it, you can turn it off.\n\t */\n\tisStandalone?: boolean\n\n\t/**\n\t * Used to control whether a copy button for copying the code/text content\n\t * will be displayed.\n\t */\n\thasCopyButton?: boolean\n\n\t/**\n\t * Used to control display of line numbers.\n\t */\n\thasLineNumbers?: boolean\n\n\t/**\n\t * Accepts a list or range of line numbers to highlight.\n\t * (Examples: `2, 4`,`6-10`)\n\t */\n\thighlightLines?: string\n\n\t/**\n\t * Accepts any valid CSS unit. If the CodeBlock content exceeds the maximum\n\t * height a vertical scrollbar is enabled. This value applies to the code\n\t * content only and does not include the header element (title and/or description).\n\t */\n\tmaxHeight?: string\n\ttitle?: ReactNode\n\tdescription?: ReactNode\n\tclassName?: string\n}\n\nconst CodeBlock = ({\n\ttitle,\n\tdescription,\n\tlanguage,\n\tvalue,\n\tisStandalone = true,\n\thasCopyButton,\n\thasLineNumbers = true,\n\thighlightLines,\n\tmaxHeight = 'auto',\n\tclassName,\n}: CodeBlockProps) => {\n\tconst copyRef = useRef<HTMLPreElement>(null)\n\tconst preCodeId = useId()\n\n\treturn (\n\t\t<div\n\t\t\tclassName={classNames(\n\t\t\t\ts['code-block'],\n\t\t\t\ts.dark,\n\t\t\t\t{\n\t\t\t\t\t[s[`language-${language}`]]: language,\n\t\t\t\t\t[s['is-standalone']]: isStandalone,\n\t\t\t\t\t[s['line-numbers']]: hasLineNumbers,\n\t\t\t\t},\n\t\t\t\tclassName\n\t\t\t)}\n\t\t>\n\t\t\t<div className={s.header}>\n\t\t\t\t{title && (\n\t\t\t\t\t<Text.HDSBody\n\t\t\t\t\t\tsize=\"200\"\n\t\t\t\t\t\ttag=\"p\"\n\t\t\t\t\t\tweight=\"semibold\"\n\t\t\t\t\t\tclassName={s.title}\n\t\t\t\t\t>\n\t\t\t\t\t\t{title}\n\t\t\t\t\t</Text.HDSBody>\n\t\t\t\t)}\n\t\t\t\t{description && (\n\t\t\t\t\t<Text.HDSBody tag=\"p\" size=\"100\" className={s.description}>\n\t\t\t\t\t\t{description}\n\t\t\t\t\t</Text.HDSBody>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t\t<div className={s.body}>\n\t\t\t\t{/**\n\t\t\t\t * NOTE: ideally we'd keep the markup of this component in lockstep\n\t\t\t\t * with the markup of the Helios code block. However, we also need\n\t\t\t\t * to support \"clever\" copying of snippets, parsing out shell\n\t\t\t\t * prompt characters like `$` from output, as this is a common\n\t\t\t\t * practice in our tutorial and documentation content. So, this\n\t\t\t\t * HiddenCopyContent component is one divergence from the markup\n\t\t\t\t * of the Helios code block.\n\t\t\t\t */}\n\t\t\t\t<HiddenCopyContent code={value} ref={copyRef} />\n\t\t\t\t<pre className={s.code} id={preCodeId} style={{ maxHeight }}>\n\t\t\t\t\t<code>\n\t\t\t\t\t\t<CodeLines\n\t\t\t\t\t\t\tvalue={value}\n\t\t\t\t\t\t\thighlightLines={highlightLines}\n\t\t\t\t\t\t\thasLineNumbers={hasLineNumbers}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</code>\n\t\t\t\t</pre>\n\t\t\t\t{hasCopyButton && (\n\t\t\t\t\t<CopyButton\n\t\t\t\t\t\tclassName={s['copy-button']}\n\t\t\t\t\t\taria-describedby={preCodeId}\n\t\t\t\t\t\tgetTextFn={() => {\n\t\t\t\t\t\t\tconst rawSnippet = copyRef.current?.textContent\n\t\t\t\t\t\t\tif (!rawSnippet) {\n\t\t\t\t\t\t\t\tthrow new Error(\n\t\t\t\t\t\t\t\t\t\"`code-block` - Couldn't find text content to copy.\"\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\treturn processSnippet(rawSnippet)\n\t\t\t\t\t\t}}\n\t\t\t\t\t\ttext=\"Copy\"\n\t\t\t\t\t\tisIconOnly\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</div>\n\t)\n}\n\nCodeBlock.displayName = 'CodeBlock'\n\nexport type { CodeBlockProps }\nexport { CodeBlock }\n"],"names":["CodeBlock","title","description","language","value","isStandalone","hasCopyButton","hasLineNumbers","highlightLines","maxHeight","className","copyRef","jsxs","classNames","s","jsx","Text","HiddenCopyContent","preCodeId","CodeLines","CopyButton","rawSnippet","processSnippet"],"mappings":";;;;;;;;;;AAmEmB,MAClBA,IAAA,CAAA;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,cAAAC,IAAA;AAAA,EACA,eAAAC;AAAA,EACA,gBAAAC,IAAA;AAAA,EACA,gBAAAC;AAAA,EACA,WAAAC,IAAA;AAAA,EACD,WAAAC;AACC;AACA,QAAMC,MAAY,IAAM,SAGvB;AAAA,SAAC,gBAAAC;AAAA,IAAA;AAAA,IAAA;AAAA,MACW,WACRC;AAAA,QACFC,EAAE,YAAA;AAAA,QACFA,EAAA;AAAA,QAAA;AAAA,UAEC,CAACA,EAAE,YAAAX,CAAmB,EAAA,CAAA,GAAAA;AAAA,UACtB,CAACW,EAAE,eAAe,CAAA,GAAGT;AAAA,UACtB,CAAAS,EAAA,cAAA,CAAA,GAAAP;AAAA,QACA;AAAA,QACDG;AAAA,MAEA;AAAA,MAAA,UAAA;AAAA,iCAEE,EAAA,WAAAI,EAAA,QAAA,UAAA;AAAA,UAAAb,KAAM,gBAAAc;AAAA,YAALC,EAAA;AAAA,YAAA;AAAA,cAEA,MAAI;AAAA,cACJ,KAAA;AAAA,cACA,QAAA;AAAA,cAEC,WAAAF,EAAA;AAAA,cAAA,UAAAb;AAAA,YACF;AAAA,UAEA;AAAA,eAKF,gBAAAc,EAAAC,EAAA,SAAA,EAAA,KAAA,KAAA,MAAA,OAAA,WAAAF,EAAA,aAAA,UAAAZ,EAAA,CAAA;AAAA,QAAA,EAAA,CAAA;AAAA,QAWC,gBAAAU,EAAA,OAAC,EAAA,WAAAE,EAAkB,MAAM,UAAO;AAAA,UAChC,gBAAAC,EAACE,GAAI,EAAW,MAAEb,GAAU,KAAAO,EAAW,CAAA;AAAA,UAEpC,gBAAAI,EAAA,OAAA,EAAA,WAAAD,EAAA,MAAA,IAAAI,GAAA,OAAA,EAAA,WAAAT,EAAA,GAAA,UAAA,gBAAAM,EAAA,QAAA,EAAA,UAAA,gBAAAA;AAAA,YAAAI;AAAA,YAAA;AAAA,cAEA,OAAAf;AAAA,cACA,gBAAAI;AAAA,cAAA,gBAAAD;AAAA;UAIF,EAAA,CAAA,EAAA,CAAA;AAAA,UACAD,KAAC,gBAAAS;AAAA,YAAAK;AAAA,YAAA;AAAA,cAEA,WAAAN,EAAA,aAAkB;AAAA,cAClB,oBAAiBI;AAAA,cAChB,WAAM,MAAA;AACN,sBAAKG,IAAYV,EAAA,SAAA;AAChB,oBAAA,CAAAU;AAAU,wBACT,IAAA;AAAA,oBACD;AAAA,kBACD;AAED,uBAAAC,EAAAD,CAAA;AAAA,cACA;AAAA,cACA,MAAA;AAAA,cACA,YAAK;AAAA,cAAA,MAAA;AAAA,YAAA;AAAA,UACN;AAAA,QAEF,EAAA,CAAA;AAAA,MAAA;AAAA,IACD;AAAA,EAEF;AAEA;;"}
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
function g(e) {
|
|
2
|
-
if (typeof e > "u" || e === !1 || e === "")
|
|
3
|
-
return [];
|
|
4
|
-
if (typeof e != "string")
|
|
5
|
-
throw new Error(
|
|
6
|
-
`The highlight prop must be a string. Received a value of type "${typeof e}" instead.`
|
|
7
|
-
);
|
|
8
|
-
if (!/^[-,0-9\s]+$/.test(e))
|
|
9
|
-
throw new Error(
|
|
10
|
-
`The highlight prop must be a comma-separated list of single integers or ranges with a single dash between two integers. Found invalid characters: "${e}".`
|
|
11
|
-
);
|
|
12
|
-
return e.split(",").reduce((t, r) => t.concat(i(r)), []);
|
|
13
|
-
}
|
|
14
|
-
function i(e) {
|
|
15
|
-
const s = e.split("-");
|
|
16
|
-
if (s.length > 2)
|
|
17
|
-
throw new Error(
|
|
18
|
-
`Each comma-separated value in the highlight prop must be either a single integer, or a range with a single dash between two integers. Found a value with multiple dashes: "${e}".`
|
|
19
|
-
);
|
|
20
|
-
if (s.length == 1) {
|
|
21
|
-
const a = parseInt(e);
|
|
22
|
-
if (a !== a)
|
|
23
|
-
throw new Error(
|
|
24
|
-
`Each comma-separated value in the highlight prop must be either a single integer, or a range with a single dash between two integers. Found a value that parsed to NaN: "${e === "" ? "<empty string>" : e}".`
|
|
25
|
-
);
|
|
26
|
-
return [a];
|
|
27
|
-
}
|
|
28
|
-
const [t, r] = s.map((a) => parseInt(a));
|
|
29
|
-
if (t !== t || r !== r)
|
|
30
|
-
throw new Error(
|
|
31
|
-
`Each comma-separated value in the highlight prop must be either a single integer, or a range with a single dash between two integers. Found a range that produced a NaN: "${e}".`
|
|
32
|
-
);
|
|
33
|
-
const h = r - t + 1;
|
|
34
|
-
return [...Array(h).keys()].map((a) => a + t);
|
|
35
|
-
}
|
|
36
|
-
export {
|
|
37
|
-
g as default
|
|
38
|
-
};
|
|
39
|
-
//# sourceMappingURL=parse-highlighted-lines.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"parse-highlighted-lines.js","sources":["../../../../src/components/code-block/utils/parse-highlighted-lines.ts"],"sourcesContent":["function parseHighlightedLines(string?: string | boolean) {\n\tif (typeof string == 'undefined' || string === false || string === '') {\n\t\treturn []\n\t}\n\n\tif (typeof string !== 'string') {\n\t\tthrow new Error(\n\t\t\t`The highlight prop must be a string. Received a value of type \"${typeof string}\" instead.`\n\t\t)\n\t}\n\n\tconst hasValidChars = /^[-,0-9\\s]+$/.test(string)\n\tif (!hasValidChars) {\n\t\tthrow new Error(\n\t\t\t`The highlight prop must be a comma-separated list of single integers or ranges with a single dash between two integers. Found invalid characters: \"${string}\".`\n\t\t)\n\t}\n\n\tconst parts = string.split(',')\n\treturn parts.reduce((acc, part) => {\n\t\treturn acc.concat(parsePart(part))\n\t}, [] as number[])\n}\n\nfunction parsePart(string: string): number[] {\n\tconst dashParts = string.split('-')\n\tif (dashParts.length > 2) {\n\t\tthrow new Error(\n\t\t\t`Each comma-separated value in the highlight prop must be either a single integer, or a range with a single dash between two integers. Found a value with multiple dashes: \"${string}\".`\n\t\t)\n\t}\n\t// Single integers are easy, just parse and return\n\tconst isSingle = dashParts.length == 1\n\tif (isSingle) {\n\t\tconst parsedInt = parseInt(string)\n\t\tconst isNaN = parsedInt !== parsedInt\n\t\tif (isNaN) {\n\t\t\tthrow new Error(\n\t\t\t\t`Each comma-separated value in the highlight prop must be either a single integer, or a range with a single dash between two integers. Found a value that parsed to NaN: \"${\n\t\t\t\t\tstring === '' ? '<empty string>' : string\n\t\t\t\t}\".`\n\t\t\t)\n\t\t}\n\t\treturn [parsedInt]\n\t}\n\t// Ranges require a little more logic\n\tconst [startVal, endVal] = dashParts.map((v) => parseInt(v))\n\tconst hasNaNStart = startVal !== startVal\n\tconst hasNaNEnd = endVal !== endVal\n\tif (hasNaNStart || hasNaNEnd) {\n\t\tthrow new Error(\n\t\t\t`Each comma-separated value in the highlight prop must be either a single integer, or a range with a single dash between two integers. Found a range that produced a NaN: \"${string}\".`\n\t\t)\n\t}\n\tconst length = endVal - startVal + 1\n\tconst values = [...Array(length).keys()].map((int) => int + startVal)\n\treturn values\n}\n\nexport default parseHighlightedLines\n"],"names":["parseHighlightedLines","string","acc","part","parsePart","dashParts","parsedInt","startVal","endVal","v","length","int"],"mappings":"AAAA,SAASA,EAAsBC,GAA2B;AACzD,MAAI,OAAOA,IAAU,OAAeA,MAAW,MAASA,MAAW;AAClE,WAAO,CAAA;AAGR,MAAI,OAAOA,KAAW;AACrB,UAAM,IAAI;AAAA,MACT,kEAAkE,OAAOA,CAAM;AAAA,IAAA;AAKjF,MAAI,CADkB,eAAe,KAAKA,CAAM;AAE/C,UAAM,IAAI;AAAA,MACT,sJAAsJA,CAAM;AAAA,IAAA;AAK9J,SADcA,EAAO,MAAM,GAAG,EACjB,OAAO,CAACC,GAAKC,MAClBD,EAAI,OAAOE,EAAUD,CAAI,CAAC,GAC/B,CAAA,CAAc;AAClB;AAEA,SAASC,EAAUH,GAA0B;AAC5C,QAAMI,IAAYJ,EAAO,MAAM,GAAG;AAClC,MAAII,EAAU,SAAS;AACtB,UAAM,IAAI;AAAA,MACT,8KAA8KJ,CAAM;AAAA,IAAA;AAKtL,MADiBI,EAAU,UAAU,GACvB;AACb,UAAMC,IAAY,SAASL,CAAM;AAEjC,QADcK,MAAcA;AAE3B,YAAM,IAAI;AAAA,QACT,4KACCL,MAAW,KAAK,mBAAmBA,CACpC;AAAA,MAAA;AAGF,WAAO,CAACK,CAAS;AAAA,EAClB;AAEA,QAAM,CAACC,GAAUC,CAAM,IAAIH,EAAU,IAAI,CAACI,MAAM,SAASA,CAAC,CAAC;AAG3D,MAFoBF,MAAaA,KACfC,MAAWA;AAE5B,UAAM,IAAI;AAAA,MACT,6KAA6KP,CAAM;AAAA,IAAA;AAGrL,QAAMS,IAASF,IAASD,IAAW;AAEnC,SADe,CAAC,GAAG,MAAMG,CAAM,EAAE,MAAM,EAAE,IAAI,CAACC,MAAQA,IAAMJ,CAAQ;AAErE;"}
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import { escape as l, split as o } from "./shellwords.js";
|
|
2
|
-
function m(t) {
|
|
3
|
-
return t.split(`
|
|
4
|
-
`)[0].startsWith("$ ") ? r(t) : t;
|
|
5
|
-
}
|
|
6
|
-
function r(t) {
|
|
7
|
-
const e = t.split(`
|
|
8
|
-
`), i = e[0];
|
|
9
|
-
if (i.endsWith("\\") || i.endsWith("EOF")) {
|
|
10
|
-
const n = l(t).replace("\\$\\", "");
|
|
11
|
-
return o(n).join(" ");
|
|
12
|
-
}
|
|
13
|
-
const s = /^\$ /;
|
|
14
|
-
return e.filter((n) => n.match(s)).map((n) => n.replace(s, "")).join(`
|
|
15
|
-
`);
|
|
16
|
-
}
|
|
17
|
-
export {
|
|
18
|
-
m as default
|
|
19
|
-
};
|
|
20
|
-
//# sourceMappingURL=process-snippet.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"process-snippet.js","sources":["../../../../src/components/code-block/utils/process-snippet.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport { escape, split } from './shellwords'\n\n/**\n * Given a snippet of code,\n * process it based on the detected language,\n * returning a modified snippet that has is\n * more suited to direct execution.\n */\nfunction processSnippet(snippet: string): string {\n\tconst isShell = snippet.split('\\n')[0].startsWith('$ ')\n\treturn isShell ? parseShellSnippet(snippet) : snippet\n}\n\n/**\n * Given a snippet of shell code that begins with `$ `,\n * return the snippet with all non-executable shell-symbols removed\n */\nfunction parseShellSnippet(snippet: string): string {\n\tconst lines = snippet.split('\\n')\n\t/**\n\t * Handle multi-line snippets.\n\t *\n\t * TODO: ideally we would detect many multi-line commands throughout\n\t * a snippet. We could potentially build some complex string-based logic to\n\t * do this... but it might be more efficient and effective to instead\n\t * process the `code` passed to `HiddenCopyContent`:\n\t * - We have incoming highlighted HTML or JSX, so we might be able to use\n\t * the highlight token classes (eg \"shell-symbol\") to only copy commands.\n\t * - However, our highlighter currently doesn't distinguish between\n\t * \"commands\" and \"output\" tokens for the \"shell-session\" language...\n\t * So maybe complex string-based logic would be the way to go if\n\t * we want to support multiple multi-line commands in a single snippet?\n\t * - Or maybe just need to look into `shellwords` use here?\n\t * (Full disclosure, I didn't set it up, so am not familiar.\n\t * it seems like it could be part of some solution?)\n\t *\n\t * ref: https://github.com/jimmycuadra/shellwords (really light on docs)\n\t * ref: https://ruby-doc.org/stdlib-1.9.3/libdoc/shellwords/rdoc/Shellwords.html\n\t * (ruby module of same name, seems to have better docs)\n\t *\n\t * Related task:\n\t * https://app.asana.com/0/1100423001970639/1199504357822173/f\n\t *\n\t */\n\tconst firstLine = lines[0]\n\tconst isMultiLineCommand =\n\t\tfirstLine.endsWith('\\\\') || firstLine.endsWith('EOF')\n\tif (isMultiLineCommand) {\n\t\t/**\n\t\t * If this is a multi-line snippet, return it formatted with\n\t\t * shellwords escape & split\n\t\t */\n\t\tconst multiLineFmt = escape(snippet).replace('\\\\$\\\\', '')\n\t\treturn split(multiLineFmt).join(' ')\n\t}\n\t/**\n\t * Otherwise, we return only lines of the shell snippet that start with `$`.\n\t * We remove the `$ ` at the start of each line.\n\t * We lines that don't start with `$ ` - these are assumed to be output lines.\n\t */\n\tconst commandRegex = /^\\$ /\n\treturn lines\n\t\t.filter((line) => line.match(commandRegex))\n\t\t.map((line) => line.replace(commandRegex, ''))\n\t\t.join('\\n')\n}\n\nexport default processSnippet\n"],"names":["processSnippet","snippet","parseShellSnippet","lines","firstLine","multiLineFmt","escape","split","commandRegex","line"],"mappings":";AAaA,SAASA,EAAeC,GAAyB;AAEhD,SADgBA,EAAQ,MAAM;AAAA,CAAI,EAAE,CAAC,EAAE,WAAW,IAAI,IACrCC,EAAkBD,CAAO,IAAIA;AAC/C;AAMA,SAASC,EAAkBD,GAAyB;AACnD,QAAME,IAAQF,EAAQ,MAAM;AAAA,CAAI,GA0B1BG,IAAYD,EAAM,CAAC;AAGzB,MADCC,EAAU,SAAS,IAAI,KAAKA,EAAU,SAAS,KAAK,GAC7B;AAKvB,UAAMC,IAAeC,EAAOL,CAAO,EAAE,QAAQ,SAAS,EAAE;AACxD,WAAOM,EAAMF,CAAY,EAAE,KAAK,GAAG;AAAA,EACpC;AAMA,QAAMG,IAAe;AACrB,SAAOL,EACL,OAAO,CAACM,MAASA,EAAK,MAAMD,CAAY,CAAC,EACzC,IAAI,CAACC,MAASA,EAAK,QAAQD,GAAc,EAAE,CAAC,EAC5C,KAAK;AAAA,CAAI;AACZ;"}
|