@salt-ds/lab 1.0.0-alpha.103 → 1.0.0-alpha.104

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (49) hide show
  1. package/CHANGELOG.md +35 -0
  2. package/css/salt-lab.css +133 -106
  3. package/dist-cjs/avatar-group/AvatarGroup.css.js +6 -0
  4. package/dist-cjs/avatar-group/AvatarGroup.css.js.map +1 -0
  5. package/dist-cjs/avatar-group/AvatarGroup.js +31 -0
  6. package/dist-cjs/avatar-group/AvatarGroup.js.map +1 -0
  7. package/dist-cjs/avatar-group/AvatarGroupCount.css.js +6 -0
  8. package/dist-cjs/avatar-group/AvatarGroupCount.css.js.map +1 -0
  9. package/dist-cjs/avatar-group/AvatarGroupCount.js +39 -0
  10. package/dist-cjs/avatar-group/AvatarGroupCount.js.map +1 -0
  11. package/dist-cjs/color-chooser/DictTabs.js +9 -1
  12. package/dist-cjs/color-chooser/DictTabs.js.map +1 -1
  13. package/dist-cjs/common-hooks/useSelection.js.map +1 -1
  14. package/dist-cjs/index.js +4 -2
  15. package/dist-cjs/index.js.map +1 -1
  16. package/dist-cjs/list/useList.js +2 -3
  17. package/dist-cjs/list/useList.js.map +1 -1
  18. package/dist-es/avatar-group/AvatarGroup.css.js +4 -0
  19. package/dist-es/avatar-group/AvatarGroup.css.js.map +1 -0
  20. package/dist-es/avatar-group/AvatarGroup.js +29 -0
  21. package/dist-es/avatar-group/AvatarGroup.js.map +1 -0
  22. package/dist-es/avatar-group/AvatarGroupCount.css.js +4 -0
  23. package/dist-es/avatar-group/AvatarGroupCount.css.js.map +1 -0
  24. package/dist-es/avatar-group/AvatarGroupCount.js +37 -0
  25. package/dist-es/avatar-group/AvatarGroupCount.js.map +1 -0
  26. package/dist-es/color-chooser/DictTabs.js +9 -1
  27. package/dist-es/color-chooser/DictTabs.js.map +1 -1
  28. package/dist-es/common-hooks/useSelection.js.map +1 -1
  29. package/dist-es/index.js +2 -1
  30. package/dist-es/index.js.map +1 -1
  31. package/dist-es/list/useList.js +2 -3
  32. package/dist-es/list/useList.js.map +1 -1
  33. package/dist-types/avatar-group/AvatarGroup.d.ts +14 -0
  34. package/dist-types/avatar-group/AvatarGroupCount.d.ts +15 -0
  35. package/dist-types/avatar-group/index.d.ts +2 -0
  36. package/dist-types/combo-box-deprecated/internal/useComboBox.d.ts +45 -45
  37. package/dist-types/combo-box-deprecated/internal/useMultiSelectComboBox.d.ts +91 -91
  38. package/dist-types/index.d.ts +1 -1
  39. package/package.json +11 -8
  40. package/dist-cjs/link-button/LinkButton.css.js +0 -6
  41. package/dist-cjs/link-button/LinkButton.css.js.map +0 -1
  42. package/dist-cjs/link-button/LinkButton.js +0 -78
  43. package/dist-cjs/link-button/LinkButton.js.map +0 -1
  44. package/dist-es/link-button/LinkButton.css.js +0 -4
  45. package/dist-es/link-button/LinkButton.css.js.map +0 -1
  46. package/dist-es/link-button/LinkButton.js +0 -76
  47. package/dist-es/link-button/LinkButton.js.map +0 -1
  48. package/dist-types/link-button/LinkButton.d.ts +0 -26
  49. package/dist-types/link-button/index.d.ts +0 -1
@@ -319,18 +319,58 @@ export declare const useMultiSelectComboBox: <Item>(props: Omit<UseMultiSelectCo
319
319
  "aria-describedby"?: string | undefined;
320
320
  };
321
321
  onKeyDown: (event: KeyboardEvent<HTMLInputElement | HTMLButtonElement | HTMLDivElement>) => void;
322
+ disabled?: boolean | undefined;
322
323
  children?: import("react").ReactNode;
323
- nonce?: string | undefined | undefined;
324
324
  slot?: string | undefined | undefined;
325
325
  style?: import("react").CSSProperties | undefined;
326
326
  title?: string | undefined | undefined;
327
- disabled?: boolean | undefined;
328
- className?: string | undefined | undefined;
327
+ dir?: string | undefined | undefined;
328
+ role?: import("react").AriaRole | undefined;
329
+ defaultChecked?: boolean | undefined | undefined;
330
+ defaultValue?: string | number | readonly string[] | undefined;
331
+ suppressContentEditableWarning?: boolean | undefined | undefined;
329
332
  suppressHydrationWarning?: boolean | undefined | undefined;
330
- color?: string | undefined | undefined;
333
+ accessKey?: string | undefined | undefined;
334
+ autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
335
+ autoFocus?: boolean | undefined | undefined;
336
+ className?: string | undefined | undefined;
337
+ contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
338
+ contextMenu?: string | undefined | undefined;
339
+ draggable?: (boolean | "true" | "false") | undefined;
340
+ enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
341
+ hidden?: boolean | undefined | undefined;
331
342
  lang?: string | undefined | undefined;
332
- role?: import("react").AriaRole | undefined;
343
+ nonce?: string | undefined | undefined;
344
+ spellCheck?: (boolean | "true" | "false") | undefined;
333
345
  tabIndex?: number | undefined | undefined;
346
+ translate?: "yes" | "no" | undefined | undefined;
347
+ radioGroup?: string | undefined | undefined;
348
+ about?: string | undefined | undefined;
349
+ content?: string | undefined | undefined;
350
+ datatype?: string | undefined | undefined;
351
+ inlist?: any;
352
+ prefix?: string | undefined | undefined;
353
+ property?: string | undefined | undefined;
354
+ rel?: string | undefined | undefined;
355
+ resource?: string | undefined | undefined;
356
+ rev?: string | undefined | undefined;
357
+ typeof?: string | undefined | undefined;
358
+ vocab?: string | undefined | undefined;
359
+ autoCorrect?: string | undefined | undefined;
360
+ autoSave?: string | undefined | undefined;
361
+ color?: string | undefined | undefined;
362
+ itemProp?: string | undefined | undefined;
363
+ itemScope?: boolean | undefined | undefined;
364
+ itemType?: string | undefined | undefined;
365
+ itemID?: string | undefined | undefined;
366
+ itemRef?: string | undefined | undefined;
367
+ results?: number | undefined | undefined;
368
+ security?: string | undefined | undefined;
369
+ unselectable?: "on" | "off" | undefined | undefined;
370
+ inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
371
+ is?: string | undefined | undefined;
372
+ exportparts?: string | undefined | undefined;
373
+ part?: string | undefined | undefined;
334
374
  "aria-activedescendant"?: string | undefined | undefined;
335
375
  "aria-atomic"?: (boolean | "true" | "false") | undefined;
336
376
  "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined;
@@ -543,52 +583,12 @@ export declare const useMultiSelectComboBox: <Item>(props: Omit<UseMultiSelectCo
543
583
  onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
544
584
  onTransitionEnd?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
545
585
  onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
546
- defaultChecked?: boolean | undefined | undefined;
547
- defaultValue?: string | number | readonly string[] | undefined;
548
- suppressContentEditableWarning?: boolean | undefined | undefined;
549
- accessKey?: string | undefined | undefined;
550
- autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
551
- autoFocus?: boolean | undefined | undefined;
552
- contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
553
- contextMenu?: string | undefined | undefined;
554
- dir?: string | undefined | undefined;
555
- draggable?: (boolean | "true" | "false") | undefined;
556
- enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
557
- hidden?: boolean | undefined | undefined;
558
- spellCheck?: (boolean | "true" | "false") | undefined;
559
- translate?: "yes" | "no" | undefined | undefined;
560
- radioGroup?: string | undefined | undefined;
561
- about?: string | undefined | undefined;
562
- content?: string | undefined | undefined;
563
- datatype?: string | undefined | undefined;
564
- inlist?: any;
565
- prefix?: string | undefined | undefined;
566
- property?: string | undefined | undefined;
567
- rel?: string | undefined | undefined;
568
- resource?: string | undefined | undefined;
569
- rev?: string | undefined | undefined;
570
- typeof?: string | undefined | undefined;
571
- vocab?: string | undefined | undefined;
572
- autoCorrect?: string | undefined | undefined;
573
- autoSave?: string | undefined | undefined;
574
- itemProp?: string | undefined | undefined;
575
- itemScope?: boolean | undefined | undefined;
576
- itemType?: string | undefined | undefined;
577
- itemID?: string | undefined | undefined;
578
- itemRef?: string | undefined | undefined;
579
- results?: number | undefined | undefined;
580
- security?: string | undefined | undefined;
581
- unselectable?: "on" | "off" | undefined | undefined;
582
- inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
583
- is?: string | undefined | undefined;
584
- exportparts?: string | undefined | undefined;
585
- part?: string | undefined | undefined;
586
586
  expanded?: boolean | undefined;
587
587
  focused?: boolean | undefined;
588
- inputRef?: Ref<HTMLInputElement> | undefined;
589
588
  itemToString?: import("../..").ItemToString<Item> | undefined;
590
589
  highlightedIndex?: number | undefined;
591
590
  onClear?: import("react").ReactEventHandler | undefined;
591
+ inputRef?: Ref<HTMLInputElement> | undefined;
592
592
  onInputFocus?: import("react").FocusEventHandler<HTMLInputElement> | undefined;
593
593
  onInputBlur?: import("react").FocusEventHandler<HTMLInputElement> | undefined;
594
594
  onInputChange?: import("react").ChangeEventHandler<HTMLInputElement> | undefined;
@@ -635,18 +635,58 @@ export declare const useMultiSelectComboBox: <Item>(props: Omit<UseMultiSelectCo
635
635
  restoreLastFocus?: boolean | undefined;
636
636
  virtualized?: boolean | undefined;
637
637
  width?: number | string | undefined;
638
+ id?: string | undefined | undefined;
638
639
  children?: import("react").ReactNode;
639
- nonce?: string | undefined | undefined;
640
640
  slot?: string | undefined | undefined;
641
641
  style?: import("react").CSSProperties | undefined;
642
642
  title?: string | undefined | undefined;
643
- className?: string | undefined | undefined;
643
+ dir?: string | undefined | undefined;
644
+ role: string;
645
+ defaultChecked?: boolean | undefined | undefined;
646
+ defaultValue?: string | number | readonly string[] | undefined;
647
+ suppressContentEditableWarning?: boolean | undefined | undefined;
644
648
  suppressHydrationWarning?: boolean | undefined | undefined;
645
- color?: string | undefined | undefined;
646
- id?: string | undefined | undefined;
649
+ accessKey?: string | undefined | undefined;
650
+ autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
651
+ autoFocus?: boolean | undefined | undefined;
652
+ className?: string | undefined | undefined;
653
+ contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
654
+ contextMenu?: string | undefined | undefined;
655
+ draggable?: (boolean | "true" | "false") | undefined;
656
+ enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
657
+ hidden?: boolean | undefined | undefined;
647
658
  lang?: string | undefined | undefined;
648
- role: string;
659
+ nonce?: string | undefined | undefined;
660
+ spellCheck?: (boolean | "true" | "false") | undefined;
649
661
  tabIndex?: number | undefined | undefined;
662
+ translate?: "yes" | "no" | undefined | undefined;
663
+ radioGroup?: string | undefined | undefined;
664
+ about?: string | undefined | undefined;
665
+ content?: string | undefined | undefined;
666
+ datatype?: string | undefined | undefined;
667
+ inlist?: any;
668
+ prefix?: string | undefined | undefined;
669
+ property?: string | undefined | undefined;
670
+ rel?: string | undefined | undefined;
671
+ resource?: string | undefined | undefined;
672
+ rev?: string | undefined | undefined;
673
+ typeof?: string | undefined | undefined;
674
+ vocab?: string | undefined | undefined;
675
+ autoCorrect?: string | undefined | undefined;
676
+ autoSave?: string | undefined | undefined;
677
+ color?: string | undefined | undefined;
678
+ itemProp?: string | undefined | undefined;
679
+ itemScope?: boolean | undefined | undefined;
680
+ itemType?: string | undefined | undefined;
681
+ itemID?: string | undefined | undefined;
682
+ itemRef?: string | undefined | undefined;
683
+ results?: number | undefined | undefined;
684
+ security?: string | undefined | undefined;
685
+ unselectable?: "on" | "off" | undefined | undefined;
686
+ inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
687
+ is?: string | undefined | undefined;
688
+ exportparts?: string | undefined | undefined;
689
+ part?: string | undefined | undefined;
650
690
  "aria-atomic"?: (boolean | "true" | "false") | undefined;
651
691
  "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined;
652
692
  "aria-braillelabel"?: string | undefined | undefined;
@@ -857,45 +897,5 @@ export declare const useMultiSelectComboBox: <Item>(props: Omit<UseMultiSelectCo
857
897
  onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
858
898
  onTransitionEnd?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
859
899
  onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
860
- defaultChecked?: boolean | undefined | undefined;
861
- defaultValue?: string | number | readonly string[] | undefined;
862
- suppressContentEditableWarning?: boolean | undefined | undefined;
863
- accessKey?: string | undefined | undefined;
864
- autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
865
- autoFocus?: boolean | undefined | undefined;
866
- contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
867
- contextMenu?: string | undefined | undefined;
868
- dir?: string | undefined | undefined;
869
- draggable?: (boolean | "true" | "false") | undefined;
870
- enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
871
- hidden?: boolean | undefined | undefined;
872
- spellCheck?: (boolean | "true" | "false") | undefined;
873
- translate?: "yes" | "no" | undefined | undefined;
874
- radioGroup?: string | undefined | undefined;
875
- about?: string | undefined | undefined;
876
- content?: string | undefined | undefined;
877
- datatype?: string | undefined | undefined;
878
- inlist?: any;
879
- prefix?: string | undefined | undefined;
880
- property?: string | undefined | undefined;
881
- rel?: string | undefined | undefined;
882
- resource?: string | undefined | undefined;
883
- rev?: string | undefined | undefined;
884
- typeof?: string | undefined | undefined;
885
- vocab?: string | undefined | undefined;
886
- autoCorrect?: string | undefined | undefined;
887
- autoSave?: string | undefined | undefined;
888
- itemProp?: string | undefined | undefined;
889
- itemScope?: boolean | undefined | undefined;
890
- itemType?: string | undefined | undefined;
891
- itemID?: string | undefined | undefined;
892
- itemRef?: string | undefined | undefined;
893
- results?: number | undefined | undefined;
894
- security?: string | undefined | undefined;
895
- unselectable?: "on" | "off" | undefined | undefined;
896
- inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
897
- is?: string | undefined | undefined;
898
- exportparts?: string | undefined | undefined;
899
- part?: string | undefined | undefined;
900
900
  };
901
901
  };
@@ -1,4 +1,5 @@
1
1
  export * from "./app-header";
2
+ export * from "./avatar-group";
2
3
  export * from "./button-bar";
3
4
  export * from "./cascading-menu";
4
5
  export * from "./color-chooser";
@@ -17,7 +18,6 @@ export * from "./form-group";
17
18
  export * from "./formatted-input";
18
19
  export { InputLegacy as Input, type InputLegacyProps as InputProps, StaticInputAdornment, } from "./input-legacy";
19
20
  export * from "./layer-layout";
20
- export * from "./link-button";
21
21
  export * from "./list";
22
22
  export type { ListChangeHandler as ListChangeHandlerDeprecated, ListSelectHandler as ListSelectHandlerDeprecated, } from "./list-deprecated";
23
23
  export { ListItemBase as ListItemBaseDeprecated, useListItem as useListItemDeprecated, } from "./list-deprecated";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@salt-ds/lab",
3
- "version": "1.0.0-alpha.103",
3
+ "version": "1.0.0-alpha.104",
4
4
  "license": "Apache-2.0",
5
5
  "repository": {
6
6
  "type": "git",
@@ -8,20 +8,23 @@
8
8
  "directory": "packages/lab"
9
9
  },
10
10
  "bugs": "https://github.com/jpmorganchase/salt-ds/issues",
11
+ "forbiddenDependencies": [
12
+ "@salt-ds/lab"
13
+ ],
11
14
  "main": "dist-cjs/index.js",
15
+ "typings": "dist-types/index.d.ts",
12
16
  "files": [
13
17
  "css",
14
18
  "dist-cjs",
15
19
  "dist-es",
16
- "dist-types",
17
- "CHANGELOG.md"
20
+ "dist-types"
18
21
  ],
19
22
  "sideEffects": [
20
23
  "*.css"
21
24
  ],
22
25
  "dependencies": {
23
26
  "@floating-ui/react": "^0.27.19",
24
- "@salt-ds/core": "^1.70.0",
27
+ "@salt-ds/core": "^1.71.0",
25
28
  "@salt-ds/icons": "^1.18.2",
26
29
  "@salt-ds/styles": "0.4.0",
27
30
  "@salt-ds/window": "0.1.1",
@@ -46,13 +49,13 @@
46
49
  }
47
50
  },
48
51
  "publishConfig": {
49
- "directory": "../../dist/salt-ds-lab",
52
+ "main": "dist-cjs/index.js",
53
+ "module": "dist-es/index.js",
50
54
  "provenance": true
51
55
  },
52
56
  "scripts": {
53
57
  "build": "yarn node ../../scripts/build.mjs",
54
58
  "bundle:css": "yarn node ./scripts/build.mjs"
55
59
  },
56
- "module": "dist-es/index.js",
57
- "typings": "dist-types/index.d.ts"
58
- }
60
+ "module": "dist-es/index.js"
61
+ }
@@ -1,6 +0,0 @@
1
- 'use strict';
2
-
3
- var css_248z = ".saltLinkButton {\n --linkButton-borderWidth: var(--salt-size-fixed-100);\n\n align-items: var(--saltLinkButton-alignItems, center);\n appearance: none;\n background: var(--saltLinkButton-background, var(--linkButton-background));\n border-color: var(--saltLinkButton-borderColor, var(--linkButton-borderColor, transparent));\n border-style: var(--saltLinkButton-borderStyle, solid);\n border-width: var(--saltLinkButton-borderWidth, var(--linkButton-borderWidth));\n border-radius: var(--saltLinkButton-borderRadius, var(--salt-palette-corner-weak, 0));\n color: var(--saltLinkButton-text-color, var(--linkButton-text-color));\n display: inline-flex;\n gap: var(--salt-spacing-50);\n justify-content: var(--saltLinkButton-justifyContent, center);\n font-size: var(--saltLinkButton-fontSize, var(--salt-text-fontSize));\n font-family: var(--saltLinkButton-fontFamily, var(--salt-text-action-fontFamily));\n line-height: var(--saltLinkButton-lineHeight, var(--salt-text-lineHeight));\n letter-spacing: var(--saltLinkButton-letterSpacing, var(--salt-text-action-letterSpacing));\n text-transform: var(--saltLinkButton-textTransform, var(--salt-text-action-textTransform));\n padding: 0 var(--saltLinkButton-padding, calc(var(--salt-spacing-100) - var(--saltLinkButton-borderWidth, var(--linkButton-borderWidth))));\n margin: var(--saltLinkButton-margin, 0);\n height: var(--saltLinkButton-height, var(--salt-size-base));\n min-width: var(--saltLinkButton-minWidth, unset);\n position: relative;\n text-align: var(--saltLinkButton-textAlign, var(--salt-text-action-textAlign));\n text-decoration: var(--linkButton-textDecoration, var(--salt-text-link-textDecoration));\n text-underline-offset: var(--salt-spacing-fixed-200);\n transition: none;\n width: var(--saltLinkButton-width, auto);\n -webkit-appearance: none;\n -webkit-tap-highlight-color: transparent;\n /* Styles applied to align children*/\n font-weight: var(--saltLinkButton-fontWeight, var(--salt-text-action-fontWeight));\n}\n\n.saltLinkButton-underlineDefault {\n --linkButton-textDecoration: var(--salt-text-link-textDecoration);\n --linkButton-textDecoration-hover: var(--salt-typography-textDecoration-none);\n --linkButton-textDecoration-focus: var(--linkButton-textDecoration-hover);\n}\n\n.saltLinkButton-underlineNever {\n --linkButton-textDecoration: var(--salt-typography-textDecoration-none);\n --linkButton-textDecoration-hover: var(--salt-typography-textDecoration-none);\n --linkButton-textDecoration-focus: var(--salt-typography-textDecoration-none);\n}\n\n/* Class for ADA content - visually hidden but accessible to screen readers.\n Uses clip-path and prevents user selection so the text isn't included\n when users copy the link button's visible content. */\n.saltLinkButton-externalLinkADA {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n clip-path: inset(50%);\n white-space: nowrap;\n border: 0;\n user-select: none;\n -webkit-user-select: none;\n}\n\n@media (hover: hover) {\n /* Pseudo-class applied to the root element on hover when LinkButton is not active or disabled */\n .saltLinkButton:hover {\n background: var(--saltLinkButton-background-hover, var(--linkButton-background-hover));\n color: var(--saltLinkButton-text-color-hover, var(--linkButton-text-color-hover));\n border-color: var(--saltLinkButton-borderColor-hover, var(--linkButton-borderColor-hover));\n cursor: var(--salt-cursor-hover);\n text-decoration: var(--linkButton-textDecoration-hover, var(--salt-typography-textDecoration-none));\n }\n}\n\n/* Pseudo-class applied to the root element on focus */\n.saltLinkButton:focus-visible {\n outline: var(--salt-focused-outline);\n\n background: var(--saltLinkButton-background-hover, var(--linkButton-background-hover));\n color: var(--saltLinkButton-text-color-hover, var(--linkButton-text-color-hover));\n border-color: var(--saltLinkButton-borderColor-hover, var(--linkButton-borderColor-hover));\n text-decoration: var(--linkButton-textDecoration-focus, var(--salt-typography-textDecoration-none));\n}\n\n/* Pseudo-class applied to the root element when LinkButton is active */\n.saltLinkButton.saltLinkButton-active:focus-visible,\n.saltLinkButton:focus-visible:active,\n.saltLinkButton:active,\n.saltLinkButton.saltLinkButton-active {\n background: var(--saltLinkButton-background-active, var(--linkButton-background-active));\n color: var(--saltLinkButton-text-color-active, var(--linkButton-text-color-active));\n border-color: var(--saltLinkButton-borderColor-active, var(--linkButton-borderColor-active));\n cursor: var(--salt-cursor-active);\n}\n\n.saltLinkButton-neutral {\n --linkButton-text-color: var(--salt-actionable-subtle-foreground);\n --linkButton-text-color-hover: var(--salt-actionable-subtle-foreground-hover);\n --linkButton-text-color-active: var(--salt-actionable-subtle-foreground-active);\n --linkButton-background: var(--salt-actionable-subtle-background);\n --linkButton-background-hover: var(--salt-actionable-subtle-background-hover);\n --linkButton-background-active: var(--salt-actionable-subtle-background-active);\n --linkButton-borderColor: var(--salt-actionable-subtle-borderColor);\n --linkButton-borderColor-hover: var(--salt-actionable-subtle-borderColor-hover);\n --linkButton-borderColor-active: var(--salt-actionable-subtle-borderColor-active);\n}\n\n.saltLinkButton-accented {\n --linkButton-text-color: var(--salt-actionable-accented-subtle-foreground);\n --linkButton-text-color-hover: var(--salt-actionable-accented-subtle-foreground-hover);\n --linkButton-text-color-active: var(--salt-actionable-accented-subtle-foreground-active);\n --linkButton-background: var(--salt-actionable-accented-subtle-background);\n --linkButton-background-hover: var(--salt-actionable-accented-subtle-background-hover);\n --linkButton-background-active: var(--salt-actionable-accented-subtle-background-active);\n --linkButton-borderColor: var(--salt-actionable-accented-subtle-borderColor);\n --linkButton-borderColor-hover: var(--salt-actionable-accented-subtle-borderColor-hover);\n --linkButton-borderColor-active: var(--salt-actionable-accented-subtle-borderColor-active);\n}\n";
4
-
5
- module.exports = css_248z;
6
- //# sourceMappingURL=LinkButton.css.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"LinkButton.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
@@ -1,78 +0,0 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
- var core = require('@salt-ds/core');
5
- var styles = require('@salt-ds/styles');
6
- var window = require('@salt-ds/window');
7
- var clsx = require('clsx');
8
- var react = require('react');
9
- var LinkButton$1 = require('./LinkButton.css.js');
10
-
11
- const withBaseName = core.makePrefixer("saltLinkButton");
12
- const LinkButton = react.forwardRef(
13
- function LinkButton2(props, ref) {
14
- const {
15
- children,
16
- className,
17
- IconComponent,
18
- onBlur,
19
- onClick,
20
- onKeyDown,
21
- onKeyUp,
22
- sentiment = "neutral",
23
- target = "_self",
24
- underline = "default",
25
- ...rest
26
- } = props;
27
- const { active, buttonProps } = core.useButton({
28
- onBlur,
29
- onClick,
30
- onKeyDown,
31
- onKeyUp
32
- });
33
- const { tabIndex: _tabIndex, ...activeStateProps } = buttonProps;
34
- const targetWindow = window.useWindow();
35
- styles.useComponentCssInjection({
36
- testId: "salt-link-button",
37
- css: LinkButton$1,
38
- window: targetWindow
39
- });
40
- const { ExternalIcon } = core.useIcon();
41
- const LinkButtonIconComponent = IconComponent === void 0 ? ExternalIcon : IconComponent;
42
- const linkButton = core.renderProps("a", {
43
- className: clsx.clsx(
44
- withBaseName(),
45
- withBaseName(sentiment),
46
- withBaseName(`underline${core.capitalize(underline)}`),
47
- { [withBaseName("active")]: active },
48
- className
49
- ),
50
- ...activeStateProps,
51
- ...rest,
52
- ref,
53
- target,
54
- children
55
- });
56
- if (linkButton.props.target !== "_blank") {
57
- return linkButton;
58
- }
59
- return react.cloneElement(
60
- linkButton,
61
- void 0,
62
- /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
63
- linkButton.props.children,
64
- LinkButtonIconComponent && /* @__PURE__ */ jsxRuntime.jsx(
65
- LinkButtonIconComponent,
66
- {
67
- className: withBaseName("icon"),
68
- "aria-hidden": true
69
- }
70
- ),
71
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: withBaseName("externalLinkADA"), children: "Opens in a new tab" })
72
- ] })
73
- );
74
- }
75
- );
76
-
77
- exports.LinkButton = LinkButton;
78
- //# sourceMappingURL=LinkButton.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"LinkButton.js","sources":["../src/link-button/LinkButton.tsx"],"sourcesContent":["import {\n capitalize,\n makePrefixer,\n type RenderPropsType,\n renderProps,\n useButton,\n useIcon,\n} from \"@salt-ds/core\";\nimport type { IconProps } from \"@salt-ds/icons\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n type ComponentType,\n cloneElement,\n forwardRef,\n} from \"react\";\n\nimport linkButtonCss from \"./LinkButton.css\";\n\nconst withBaseName = makePrefixer(\"saltLinkButton\");\n\nexport interface LinkButtonProps extends ComponentPropsWithoutRef<\"a\"> {\n /**\n * Icon component displayed when `target=\"_blank\"`. Defaults to `ExternalIcon` from `SemanticIconProvider`.\n */\n IconComponent?: ComponentType<IconProps> | null;\n /**\n * The sentiment of the button. Options are 'accented' and 'neutral'.\n * 'neutral' is the default value.\n */\n sentiment?: \"accented\" | \"neutral\";\n /**\n * Render prop to enable customisation of anchor element.\n */\n render?: RenderPropsType[\"render\"];\n /**\n * Either \"default\" or \"never\".\n * Determines when underline should be applied to the link button.\n *\n * @default \"default\".\n */\n underline?: \"default\" | \"never\";\n}\n\nexport const LinkButton = forwardRef<HTMLAnchorElement, LinkButtonProps>(\n function LinkButton(props, ref) {\n const {\n children,\n className,\n IconComponent,\n onBlur,\n onClick,\n onKeyDown,\n onKeyUp,\n sentiment = \"neutral\",\n target = \"_self\",\n underline = \"default\",\n ...rest\n } = props;\n\n const { active, buttonProps } = useButton<HTMLAnchorElement>({\n onBlur,\n onClick,\n onKeyDown,\n onKeyUp,\n });\n // Native anchors with an href do not require tabIndex=\"0\".\n const { tabIndex: _tabIndex, ...activeStateProps } = buttonProps;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-link-button\",\n css: linkButtonCss,\n window: targetWindow,\n });\n const { ExternalIcon } = useIcon();\n\n const LinkButtonIconComponent =\n IconComponent === undefined ? ExternalIcon : IconComponent;\n\n const linkButton = renderProps(\"a\", {\n className: clsx(\n withBaseName(),\n withBaseName(sentiment),\n withBaseName(`underline${capitalize(underline)}`),\n { [withBaseName(\"active\")]: active },\n className,\n ),\n ...activeStateProps,\n ...rest,\n ref,\n target,\n children,\n });\n\n if (linkButton.props.target !== \"_blank\") {\n return linkButton;\n }\n\n return cloneElement(\n linkButton,\n undefined,\n <>\n {linkButton.props.children}\n {LinkButtonIconComponent && (\n <LinkButtonIconComponent\n className={withBaseName(\"icon\")}\n aria-hidden\n />\n )}\n <span className={withBaseName(\"externalLinkADA\")}>\n Opens in a new tab\n </span>\n </>,\n );\n },\n);\n"],"names":["makePrefixer","forwardRef","LinkButton","useButton","useWindow","useComponentCssInjection","linkButtonCss","useIcon","renderProps","clsx","capitalize","cloneElement","jsxs","Fragment","jsx"],"mappings":";;;;;;;;;;AAqBA,MAAM,YAAA,GAAeA,kBAAa,gBAAgB,CAAA;AAyB3C,MAAM,UAAA,GAAaC,gBAAA;AAAA,EACxB,SAASC,WAAAA,CAAW,KAAA,EAAO,GAAA,EAAK;AAC9B,IAAA,MAAM;AAAA,MACJ,QAAA;AAAA,MACA,SAAA;AAAA,MACA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAA;AAAA,MACA,SAAA;AAAA,MACA,OAAA;AAAA,MACA,SAAA,GAAY,SAAA;AAAA,MACZ,MAAA,GAAS,OAAA;AAAA,MACT,SAAA,GAAY,SAAA;AAAA,MACZ,GAAG;AAAA,KACL,GAAI,KAAA;AAEJ,IAAA,MAAM,EAAE,MAAA,EAAQ,WAAA,EAAY,GAAIC,cAAA,CAA6B;AAAA,MAC3D,MAAA;AAAA,MACA,OAAA;AAAA,MACA,SAAA;AAAA,MACA;AAAA,KACD,CAAA;AAED,IAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,GAAG,kBAAiB,GAAI,WAAA;AAErD,IAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,kBAAA;AAAA,MACR,GAAA,EAAKC,YAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AACD,IAAA,MAAM,EAAE,YAAA,EAAa,GAAIC,YAAA,EAAQ;AAEjC,IAAA,MAAM,uBAAA,GACJ,aAAA,KAAkB,MAAA,GAAY,YAAA,GAAe,aAAA;AAE/C,IAAA,MAAM,UAAA,GAAaC,iBAAY,GAAA,EAAK;AAAA,MAClC,SAAA,EAAWC,SAAA;AAAA,QACT,YAAA,EAAa;AAAA,QACb,aAAa,SAAS,CAAA;AAAA,QACtB,YAAA,CAAa,CAAA,SAAA,EAAYC,eAAA,CAAW,SAAS,CAAC,CAAA,CAAE,CAAA;AAAA,QAChD,EAAE,CAAC,YAAA,CAAa,QAAQ,CAAC,GAAG,MAAA,EAAO;AAAA,QACnC;AAAA,OACF;AAAA,MACA,GAAG,gBAAA;AAAA,MACH,GAAG,IAAA;AAAA,MACH,GAAA;AAAA,MACA,MAAA;AAAA,MACA;AAAA,KACD,CAAA;AAED,IAAA,IAAI,UAAA,CAAW,KAAA,CAAM,MAAA,KAAW,QAAA,EAAU;AACxC,MAAA,OAAO,UAAA;AAAA,IACT;AAEA,IAAA,OAAOC,kBAAA;AAAA,MACL,UAAA;AAAA,MACA,MAAA;AAAA,sBACAC,eAAA,CAAAC,mBAAA,EAAA,EACG,QAAA,EAAA;AAAA,QAAA,UAAA,CAAW,KAAA,CAAM,QAAA;AAAA,QACjB,uBAAA,oBACCC,cAAA;AAAA,UAAC,uBAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,YAC9B,aAAA,EAAW;AAAA;AAAA,SACb;AAAA,uCAED,MAAA,EAAA,EAAK,SAAA,EAAW,YAAA,CAAa,iBAAiB,GAAG,QAAA,EAAA,oBAAA,EAElD;AAAA,OAAA,EACF;AAAA,KACF;AAAA,EACF;AACF;;;;"}
@@ -1,4 +0,0 @@
1
- var css_248z = ".saltLinkButton {\n --linkButton-borderWidth: var(--salt-size-fixed-100);\n\n align-items: var(--saltLinkButton-alignItems, center);\n appearance: none;\n background: var(--saltLinkButton-background, var(--linkButton-background));\n border-color: var(--saltLinkButton-borderColor, var(--linkButton-borderColor, transparent));\n border-style: var(--saltLinkButton-borderStyle, solid);\n border-width: var(--saltLinkButton-borderWidth, var(--linkButton-borderWidth));\n border-radius: var(--saltLinkButton-borderRadius, var(--salt-palette-corner-weak, 0));\n color: var(--saltLinkButton-text-color, var(--linkButton-text-color));\n display: inline-flex;\n gap: var(--salt-spacing-50);\n justify-content: var(--saltLinkButton-justifyContent, center);\n font-size: var(--saltLinkButton-fontSize, var(--salt-text-fontSize));\n font-family: var(--saltLinkButton-fontFamily, var(--salt-text-action-fontFamily));\n line-height: var(--saltLinkButton-lineHeight, var(--salt-text-lineHeight));\n letter-spacing: var(--saltLinkButton-letterSpacing, var(--salt-text-action-letterSpacing));\n text-transform: var(--saltLinkButton-textTransform, var(--salt-text-action-textTransform));\n padding: 0 var(--saltLinkButton-padding, calc(var(--salt-spacing-100) - var(--saltLinkButton-borderWidth, var(--linkButton-borderWidth))));\n margin: var(--saltLinkButton-margin, 0);\n height: var(--saltLinkButton-height, var(--salt-size-base));\n min-width: var(--saltLinkButton-minWidth, unset);\n position: relative;\n text-align: var(--saltLinkButton-textAlign, var(--salt-text-action-textAlign));\n text-decoration: var(--linkButton-textDecoration, var(--salt-text-link-textDecoration));\n text-underline-offset: var(--salt-spacing-fixed-200);\n transition: none;\n width: var(--saltLinkButton-width, auto);\n -webkit-appearance: none;\n -webkit-tap-highlight-color: transparent;\n /* Styles applied to align children*/\n font-weight: var(--saltLinkButton-fontWeight, var(--salt-text-action-fontWeight));\n}\n\n.saltLinkButton-underlineDefault {\n --linkButton-textDecoration: var(--salt-text-link-textDecoration);\n --linkButton-textDecoration-hover: var(--salt-typography-textDecoration-none);\n --linkButton-textDecoration-focus: var(--linkButton-textDecoration-hover);\n}\n\n.saltLinkButton-underlineNever {\n --linkButton-textDecoration: var(--salt-typography-textDecoration-none);\n --linkButton-textDecoration-hover: var(--salt-typography-textDecoration-none);\n --linkButton-textDecoration-focus: var(--salt-typography-textDecoration-none);\n}\n\n/* Class for ADA content - visually hidden but accessible to screen readers.\n Uses clip-path and prevents user selection so the text isn't included\n when users copy the link button's visible content. */\n.saltLinkButton-externalLinkADA {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n clip-path: inset(50%);\n white-space: nowrap;\n border: 0;\n user-select: none;\n -webkit-user-select: none;\n}\n\n@media (hover: hover) {\n /* Pseudo-class applied to the root element on hover when LinkButton is not active or disabled */\n .saltLinkButton:hover {\n background: var(--saltLinkButton-background-hover, var(--linkButton-background-hover));\n color: var(--saltLinkButton-text-color-hover, var(--linkButton-text-color-hover));\n border-color: var(--saltLinkButton-borderColor-hover, var(--linkButton-borderColor-hover));\n cursor: var(--salt-cursor-hover);\n text-decoration: var(--linkButton-textDecoration-hover, var(--salt-typography-textDecoration-none));\n }\n}\n\n/* Pseudo-class applied to the root element on focus */\n.saltLinkButton:focus-visible {\n outline: var(--salt-focused-outline);\n\n background: var(--saltLinkButton-background-hover, var(--linkButton-background-hover));\n color: var(--saltLinkButton-text-color-hover, var(--linkButton-text-color-hover));\n border-color: var(--saltLinkButton-borderColor-hover, var(--linkButton-borderColor-hover));\n text-decoration: var(--linkButton-textDecoration-focus, var(--salt-typography-textDecoration-none));\n}\n\n/* Pseudo-class applied to the root element when LinkButton is active */\n.saltLinkButton.saltLinkButton-active:focus-visible,\n.saltLinkButton:focus-visible:active,\n.saltLinkButton:active,\n.saltLinkButton.saltLinkButton-active {\n background: var(--saltLinkButton-background-active, var(--linkButton-background-active));\n color: var(--saltLinkButton-text-color-active, var(--linkButton-text-color-active));\n border-color: var(--saltLinkButton-borderColor-active, var(--linkButton-borderColor-active));\n cursor: var(--salt-cursor-active);\n}\n\n.saltLinkButton-neutral {\n --linkButton-text-color: var(--salt-actionable-subtle-foreground);\n --linkButton-text-color-hover: var(--salt-actionable-subtle-foreground-hover);\n --linkButton-text-color-active: var(--salt-actionable-subtle-foreground-active);\n --linkButton-background: var(--salt-actionable-subtle-background);\n --linkButton-background-hover: var(--salt-actionable-subtle-background-hover);\n --linkButton-background-active: var(--salt-actionable-subtle-background-active);\n --linkButton-borderColor: var(--salt-actionable-subtle-borderColor);\n --linkButton-borderColor-hover: var(--salt-actionable-subtle-borderColor-hover);\n --linkButton-borderColor-active: var(--salt-actionable-subtle-borderColor-active);\n}\n\n.saltLinkButton-accented {\n --linkButton-text-color: var(--salt-actionable-accented-subtle-foreground);\n --linkButton-text-color-hover: var(--salt-actionable-accented-subtle-foreground-hover);\n --linkButton-text-color-active: var(--salt-actionable-accented-subtle-foreground-active);\n --linkButton-background: var(--salt-actionable-accented-subtle-background);\n --linkButton-background-hover: var(--salt-actionable-accented-subtle-background-hover);\n --linkButton-background-active: var(--salt-actionable-accented-subtle-background-active);\n --linkButton-borderColor: var(--salt-actionable-accented-subtle-borderColor);\n --linkButton-borderColor-hover: var(--salt-actionable-accented-subtle-borderColor-hover);\n --linkButton-borderColor-active: var(--salt-actionable-accented-subtle-borderColor-active);\n}\n";
2
-
3
- export { css_248z as default };
4
- //# sourceMappingURL=LinkButton.css.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"LinkButton.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
@@ -1,76 +0,0 @@
1
- import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
2
- import { makePrefixer, useButton, useIcon, renderProps, capitalize } from '@salt-ds/core';
3
- import { useComponentCssInjection } from '@salt-ds/styles';
4
- import { useWindow } from '@salt-ds/window';
5
- import { clsx } from 'clsx';
6
- import { forwardRef, cloneElement } from 'react';
7
- import css_248z from './LinkButton.css.js';
8
-
9
- const withBaseName = makePrefixer("saltLinkButton");
10
- const LinkButton = forwardRef(
11
- function LinkButton2(props, ref) {
12
- const {
13
- children,
14
- className,
15
- IconComponent,
16
- onBlur,
17
- onClick,
18
- onKeyDown,
19
- onKeyUp,
20
- sentiment = "neutral",
21
- target = "_self",
22
- underline = "default",
23
- ...rest
24
- } = props;
25
- const { active, buttonProps } = useButton({
26
- onBlur,
27
- onClick,
28
- onKeyDown,
29
- onKeyUp
30
- });
31
- const { tabIndex: _tabIndex, ...activeStateProps } = buttonProps;
32
- const targetWindow = useWindow();
33
- useComponentCssInjection({
34
- testId: "salt-link-button",
35
- css: css_248z,
36
- window: targetWindow
37
- });
38
- const { ExternalIcon } = useIcon();
39
- const LinkButtonIconComponent = IconComponent === void 0 ? ExternalIcon : IconComponent;
40
- const linkButton = renderProps("a", {
41
- className: clsx(
42
- withBaseName(),
43
- withBaseName(sentiment),
44
- withBaseName(`underline${capitalize(underline)}`),
45
- { [withBaseName("active")]: active },
46
- className
47
- ),
48
- ...activeStateProps,
49
- ...rest,
50
- ref,
51
- target,
52
- children
53
- });
54
- if (linkButton.props.target !== "_blank") {
55
- return linkButton;
56
- }
57
- return cloneElement(
58
- linkButton,
59
- void 0,
60
- /* @__PURE__ */ jsxs(Fragment, { children: [
61
- linkButton.props.children,
62
- LinkButtonIconComponent && /* @__PURE__ */ jsx(
63
- LinkButtonIconComponent,
64
- {
65
- className: withBaseName("icon"),
66
- "aria-hidden": true
67
- }
68
- ),
69
- /* @__PURE__ */ jsx("span", { className: withBaseName("externalLinkADA"), children: "Opens in a new tab" })
70
- ] })
71
- );
72
- }
73
- );
74
-
75
- export { LinkButton };
76
- //# sourceMappingURL=LinkButton.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"LinkButton.js","sources":["../src/link-button/LinkButton.tsx"],"sourcesContent":["import {\n capitalize,\n makePrefixer,\n type RenderPropsType,\n renderProps,\n useButton,\n useIcon,\n} from \"@salt-ds/core\";\nimport type { IconProps } from \"@salt-ds/icons\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n type ComponentType,\n cloneElement,\n forwardRef,\n} from \"react\";\n\nimport linkButtonCss from \"./LinkButton.css\";\n\nconst withBaseName = makePrefixer(\"saltLinkButton\");\n\nexport interface LinkButtonProps extends ComponentPropsWithoutRef<\"a\"> {\n /**\n * Icon component displayed when `target=\"_blank\"`. Defaults to `ExternalIcon` from `SemanticIconProvider`.\n */\n IconComponent?: ComponentType<IconProps> | null;\n /**\n * The sentiment of the button. Options are 'accented' and 'neutral'.\n * 'neutral' is the default value.\n */\n sentiment?: \"accented\" | \"neutral\";\n /**\n * Render prop to enable customisation of anchor element.\n */\n render?: RenderPropsType[\"render\"];\n /**\n * Either \"default\" or \"never\".\n * Determines when underline should be applied to the link button.\n *\n * @default \"default\".\n */\n underline?: \"default\" | \"never\";\n}\n\nexport const LinkButton = forwardRef<HTMLAnchorElement, LinkButtonProps>(\n function LinkButton(props, ref) {\n const {\n children,\n className,\n IconComponent,\n onBlur,\n onClick,\n onKeyDown,\n onKeyUp,\n sentiment = \"neutral\",\n target = \"_self\",\n underline = \"default\",\n ...rest\n } = props;\n\n const { active, buttonProps } = useButton<HTMLAnchorElement>({\n onBlur,\n onClick,\n onKeyDown,\n onKeyUp,\n });\n // Native anchors with an href do not require tabIndex=\"0\".\n const { tabIndex: _tabIndex, ...activeStateProps } = buttonProps;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-link-button\",\n css: linkButtonCss,\n window: targetWindow,\n });\n const { ExternalIcon } = useIcon();\n\n const LinkButtonIconComponent =\n IconComponent === undefined ? ExternalIcon : IconComponent;\n\n const linkButton = renderProps(\"a\", {\n className: clsx(\n withBaseName(),\n withBaseName(sentiment),\n withBaseName(`underline${capitalize(underline)}`),\n { [withBaseName(\"active\")]: active },\n className,\n ),\n ...activeStateProps,\n ...rest,\n ref,\n target,\n children,\n });\n\n if (linkButton.props.target !== \"_blank\") {\n return linkButton;\n }\n\n return cloneElement(\n linkButton,\n undefined,\n <>\n {linkButton.props.children}\n {LinkButtonIconComponent && (\n <LinkButtonIconComponent\n className={withBaseName(\"icon\")}\n aria-hidden\n />\n )}\n <span className={withBaseName(\"externalLinkADA\")}>\n Opens in a new tab\n </span>\n </>,\n );\n },\n);\n"],"names":["LinkButton","linkButtonCss"],"mappings":";;;;;;;;AAqBA,MAAM,YAAA,GAAe,aAAa,gBAAgB,CAAA;AAyB3C,MAAM,UAAA,GAAa,UAAA;AAAA,EACxB,SAASA,WAAAA,CAAW,KAAA,EAAO,GAAA,EAAK;AAC9B,IAAA,MAAM;AAAA,MACJ,QAAA;AAAA,MACA,SAAA;AAAA,MACA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAA;AAAA,MACA,SAAA;AAAA,MACA,OAAA;AAAA,MACA,SAAA,GAAY,SAAA;AAAA,MACZ,MAAA,GAAS,OAAA;AAAA,MACT,SAAA,GAAY,SAAA;AAAA,MACZ,GAAG;AAAA,KACL,GAAI,KAAA;AAEJ,IAAA,MAAM,EAAE,MAAA,EAAQ,WAAA,EAAY,GAAI,SAAA,CAA6B;AAAA,MAC3D,MAAA;AAAA,MACA,OAAA;AAAA,MACA,SAAA;AAAA,MACA;AAAA,KACD,CAAA;AAED,IAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,GAAG,kBAAiB,GAAI,WAAA;AAErD,IAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,IAAA,wBAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,kBAAA;AAAA,MACR,GAAA,EAAKC,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AACD,IAAA,MAAM,EAAE,YAAA,EAAa,GAAI,OAAA,EAAQ;AAEjC,IAAA,MAAM,uBAAA,GACJ,aAAA,KAAkB,MAAA,GAAY,YAAA,GAAe,aAAA;AAE/C,IAAA,MAAM,UAAA,GAAa,YAAY,GAAA,EAAK;AAAA,MAClC,SAAA,EAAW,IAAA;AAAA,QACT,YAAA,EAAa;AAAA,QACb,aAAa,SAAS,CAAA;AAAA,QACtB,YAAA,CAAa,CAAA,SAAA,EAAY,UAAA,CAAW,SAAS,CAAC,CAAA,CAAE,CAAA;AAAA,QAChD,EAAE,CAAC,YAAA,CAAa,QAAQ,CAAC,GAAG,MAAA,EAAO;AAAA,QACnC;AAAA,OACF;AAAA,MACA,GAAG,gBAAA;AAAA,MACH,GAAG,IAAA;AAAA,MACH,GAAA;AAAA,MACA,MAAA;AAAA,MACA;AAAA,KACD,CAAA;AAED,IAAA,IAAI,UAAA,CAAW,KAAA,CAAM,MAAA,KAAW,QAAA,EAAU;AACxC,MAAA,OAAO,UAAA;AAAA,IACT;AAEA,IAAA,OAAO,YAAA;AAAA,MACL,UAAA;AAAA,MACA,MAAA;AAAA,sBACA,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,QAAA,UAAA,CAAW,KAAA,CAAM,QAAA;AAAA,QACjB,uBAAA,oBACC,GAAA;AAAA,UAAC,uBAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,YAC9B,aAAA,EAAW;AAAA;AAAA,SACb;AAAA,4BAED,MAAA,EAAA,EAAK,SAAA,EAAW,YAAA,CAAa,iBAAiB,GAAG,QAAA,EAAA,oBAAA,EAElD;AAAA,OAAA,EACF;AAAA,KACF;AAAA,EACF;AACF;;;;"}
@@ -1,26 +0,0 @@
1
- import { type RenderPropsType } from "@salt-ds/core";
2
- import type { IconProps } from "@salt-ds/icons";
3
- import { type ComponentPropsWithoutRef, type ComponentType } from "react";
4
- export interface LinkButtonProps extends ComponentPropsWithoutRef<"a"> {
5
- /**
6
- * Icon component displayed when `target="_blank"`. Defaults to `ExternalIcon` from `SemanticIconProvider`.
7
- */
8
- IconComponent?: ComponentType<IconProps> | null;
9
- /**
10
- * The sentiment of the button. Options are 'accented' and 'neutral'.
11
- * 'neutral' is the default value.
12
- */
13
- sentiment?: "accented" | "neutral";
14
- /**
15
- * Render prop to enable customisation of anchor element.
16
- */
17
- render?: RenderPropsType["render"];
18
- /**
19
- * Either "default" or "never".
20
- * Determines when underline should be applied to the link button.
21
- *
22
- * @default "default".
23
- */
24
- underline?: "default" | "never";
25
- }
26
- export declare const LinkButton: import("react").ForwardRefExoticComponent<LinkButtonProps & import("react").RefAttributes<HTMLAnchorElement>>;
@@ -1 +0,0 @@
1
- export * from "./LinkButton";