@govtechsg/sgds-web-component 3.19.0-rc.1 → 3.19.0-rc.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.
Files changed (96) hide show
  1. package/components/Stepper/index.umd.min.js +26 -26
  2. package/components/Stepper/index.umd.min.js.map +1 -1
  3. package/components/Stepper/sgds-stepper.d.ts +10 -0
  4. package/components/Stepper/sgds-stepper.js +46 -24
  5. package/components/Stepper/sgds-stepper.js.map +1 -1
  6. package/components/Stepper/step.js +1 -1
  7. package/components/index.umd.min.js +88 -88
  8. package/components/index.umd.min.js.map +1 -1
  9. package/css/fouc.css +2 -2
  10. package/custom-elements.json +761 -754
  11. package/index.umd.min.js +18 -18
  12. package/index.umd.min.js.map +1 -1
  13. package/package.json +1 -1
  14. package/react/accordion/index.d.ts +3 -1
  15. package/react/accordion-item/index.d.ts +3 -1
  16. package/react/alert/index.d.ts +3 -1
  17. package/react/alert-link/index.d.ts +3 -1
  18. package/react/badge/index.d.ts +3 -1
  19. package/react/breadcrumb/index.d.ts +3 -1
  20. package/react/breadcrumb-item/index.d.ts +3 -1
  21. package/react/button/index.d.ts +3 -1
  22. package/react/card/index.d.ts +3 -1
  23. package/react/checkbox/index.d.ts +3 -1
  24. package/react/checkbox-group/index.d.ts +3 -1
  25. package/react/close-button/index.d.ts +3 -1
  26. package/react/combo-box/index.d.ts +3 -1
  27. package/react/combo-box-option/index.d.ts +3 -1
  28. package/react/components/Stepper/sgds-stepper.cjs.js +45 -23
  29. package/react/components/Stepper/sgds-stepper.cjs.js.map +1 -1
  30. package/react/components/Stepper/sgds-stepper.js +46 -24
  31. package/react/components/Stepper/sgds-stepper.js.map +1 -1
  32. package/react/components/Stepper/step.cjs.js +1 -1
  33. package/react/components/Stepper/step.js +1 -1
  34. package/react/datepicker/index.d.ts +3 -1
  35. package/react/description-list/index.d.ts +3 -1
  36. package/react/description-list-group/index.d.ts +3 -1
  37. package/react/divider/index.d.ts +3 -1
  38. package/react/drawer/index.d.ts +3 -1
  39. package/react/dropdown/index.d.ts +3 -1
  40. package/react/dropdown-item/index.d.ts +3 -1
  41. package/react/file-upload/index.d.ts +3 -1
  42. package/react/footer/index.d.ts +3 -1
  43. package/react/footer-item/index.d.ts +3 -1
  44. package/react/icon/index.d.ts +3 -1
  45. package/react/icon-button/index.d.ts +3 -1
  46. package/react/icon-card/index.d.ts +3 -1
  47. package/react/icon-list/index.d.ts +3 -1
  48. package/react/image-card/index.d.ts +3 -1
  49. package/react/index.cjs.js +4 -4
  50. package/react/index.d.ts +2 -2
  51. package/react/index.js +2 -2
  52. package/react/input/index.d.ts +3 -1
  53. package/react/link/index.d.ts +3 -1
  54. package/react/mainnav/index.d.ts +3 -1
  55. package/react/mainnav-dropdown/index.d.ts +3 -1
  56. package/react/mainnav-item/index.d.ts +3 -1
  57. package/react/masthead/index.d.ts +3 -1
  58. package/react/modal/index.d.ts +3 -1
  59. package/react/overflow-menu/index.d.ts +3 -1
  60. package/react/pagination/index.d.ts +3 -1
  61. package/react/progress-bar/index.d.ts +3 -1
  62. package/react/quantity-toggle/index.d.ts +3 -1
  63. package/react/radio/index.d.ts +3 -1
  64. package/react/radio-group/index.d.ts +3 -1
  65. package/react/select/index.d.ts +3 -1
  66. package/react/select-option/index.d.ts +3 -1
  67. package/react/sidebar/index.d.ts +3 -1
  68. package/react/sidebar-group/index.d.ts +3 -1
  69. package/react/sidebar-item/index.d.ts +3 -1
  70. package/react/sidebar-section/index.d.ts +3 -1
  71. package/react/sidenav/index.d.ts +3 -1
  72. package/react/sidenav-item/index.d.ts +3 -1
  73. package/react/sidenav-link/index.d.ts +3 -1
  74. package/react/skeleton/index.d.ts +3 -1
  75. package/react/spinner/index.d.ts +3 -1
  76. package/react/step/index.d.ts +3 -1
  77. package/react/stepper/index.d.ts +3 -1
  78. package/react/subnav/index.d.ts +3 -1
  79. package/react/subnav-item/index.d.ts +3 -1
  80. package/react/switch/index.d.ts +3 -1
  81. package/react/system-banner/index.d.ts +3 -1
  82. package/react/system-banner-item/index.d.ts +3 -1
  83. package/react/tab/index.d.ts +3 -1
  84. package/react/tab-group/index.d.ts +3 -1
  85. package/react/tab-panel/index.d.ts +3 -1
  86. package/react/table/index.d.ts +3 -1
  87. package/react/table-cell/index.d.ts +3 -1
  88. package/react/table-head/index.d.ts +3 -1
  89. package/react/table-of-contents/index.d.ts +3 -1
  90. package/react/table-row/index.d.ts +3 -1
  91. package/react/textarea/index.d.ts +3 -1
  92. package/react/thumbnail-card/index.d.ts +3 -1
  93. package/react/toast/index.d.ts +3 -1
  94. package/react/toast-container/index.d.ts +3 -1
  95. package/react/tooltip/index.d.ts +3 -1
  96. package/types/react.d.ts +136 -136
@@ -919,86 +919,65 @@
919
919
  },
920
920
  {
921
921
  "kind": "javascript-module",
922
- "path": "src/components/Button/sgds-button.ts",
922
+ "path": "src/components/Badge/sgds-badge.ts",
923
923
  "declarations": [
924
924
  {
925
925
  "kind": "class",
926
926
  "description": "",
927
- "name": "SgdsButton",
927
+ "name": "SgdsBadge",
928
928
  "slots": [
929
929
  {
930
- "description": "The button's label.",
930
+ "description": "slot for badge",
931
931
  "name": "default"
932
932
  },
933
933
  {
934
- "description": "The slot for icon to the left of the button text",
935
- "name": "leftIcon"
936
- },
937
- {
938
- "description": "The slot for icon to the right of the button text",
939
- "name": "rightIcon"
934
+ "description": "The slot for icon to the left of the badge text",
935
+ "name": "icon"
940
936
  }
941
937
  ],
942
938
  "members": [
943
939
  {
944
940
  "kind": "field",
945
- "name": "type",
946
- "type": {
947
- "text": "\"button\" | \"submit\" | \"reset\""
948
- },
949
- "default": "\"button\"",
950
- "description": "The behavior of the button with default as `type='button', `reset` resets all the controls to their initial values and `submit` submits the form data to the server",
951
- "attribute": "type",
952
- "reflects": true
953
- },
954
- {
955
- "kind": "field",
956
- "name": "form",
957
- "type": {
958
- "text": "string"
959
- },
960
- "description": "The \"form owner\" to associate the button with. If omitted, the closest containing form will be used instead. The\nvalue of this attribute must be an id of a form in the same document or shadow root as the button.",
961
- "attribute": "form",
962
- "reflects": true
963
- },
964
- {
965
- "kind": "field",
966
- "name": "formAction",
941
+ "name": "show",
967
942
  "type": {
968
- "text": "string"
943
+ "text": "boolean"
969
944
  },
970
- "description": "Used to override the form owner's `action` attribute.",
971
- "attribute": "formaction",
945
+ "default": "false",
946
+ "description": "Controls the appearance of the dismissible badge. This prop only applies when dismissible is true",
947
+ "attribute": "show",
972
948
  "reflects": true
973
949
  },
974
950
  {
975
951
  "kind": "field",
976
- "name": "formMethod",
952
+ "name": "variant",
977
953
  "type": {
978
- "text": "\"post\" | \"get\""
954
+ "text": "\"primary\" | \"accent\" | \"success\" | \"danger\" | \"warning\" | \"cyan\" | \"purple\" | \"neutral\" | \"white\" | \"info\""
979
955
  },
980
- "description": "Used to override the form owner's `method` attribute.",
981
- "attribute": "formmethod",
956
+ "default": "\"primary\"",
957
+ "description": "One or more badge variant combinations.\nVariants include: `primary`, `accent`, `success`, `danger`, `warning`, `cyan`, `purple`, `neutral`, `white`, `info`.\n\n(@deprecated) The `info` variant is deprecated. Use `primary` instead.",
958
+ "attribute": "variant",
982
959
  "reflects": true
983
960
  },
984
961
  {
985
962
  "kind": "field",
986
- "name": "formNoValidate",
963
+ "name": "outlined",
987
964
  "type": {
988
965
  "text": "boolean"
989
966
  },
990
- "description": "Used to override the form owner's `novalidate` attribute.",
991
- "attribute": "formnovalidate",
967
+ "default": "false",
968
+ "description": "Manually set the outlined state to false",
969
+ "attribute": "outlined",
992
970
  "reflects": true
993
971
  },
994
972
  {
995
973
  "kind": "field",
996
- "name": "formTarget",
974
+ "name": "dismissible",
997
975
  "type": {
998
- "text": "| \"_self\"\n | \"_blank\"\n | \"_parent\"\n | \"_top\"\n | string"
976
+ "text": "boolean"
999
977
  },
1000
- "description": "Used to override the form owner's `target` attribute.",
1001
- "attribute": "formtarget",
978
+ "default": "false",
979
+ "description": "Manually set the dismissible state of the button to `false`",
980
+ "attribute": "dismissible",
1002
981
  "reflects": true
1003
982
  },
1004
983
  {
@@ -1008,331 +987,245 @@
1008
987
  "text": "boolean"
1009
988
  },
1010
989
  "default": "false",
1011
- "description": "When set, the button will be in full width.",
990
+ "description": "Manually enable full width",
1012
991
  "attribute": "fullWidth",
1013
992
  "reflects": true
1014
993
  },
1015
994
  {
1016
995
  "kind": "field",
1017
- "name": "hasLeftIconSlot",
996
+ "name": "truncated",
1018
997
  "type": {
1019
998
  "text": "boolean"
1020
999
  },
1021
- "default": "false",
1022
- "description": "Used only for SSR to indicate the presence of the `leftIcon` slot.",
1023
- "attribute": "hasLeftIconSlot"
1000
+ "privacy": "private",
1001
+ "default": "false"
1024
1002
  },
1025
1003
  {
1026
1004
  "kind": "field",
1027
- "name": "hasRightIconSlot",
1005
+ "name": "text",
1028
1006
  "type": {
1029
- "text": "boolean"
1007
+ "text": "string"
1030
1008
  },
1031
- "default": "false",
1032
- "description": "Used only for SSR to indicate the presence of the `rightIcon` slot.",
1033
- "attribute": "hasRightIconSlot"
1009
+ "privacy": "private",
1010
+ "default": "\"\""
1034
1011
  },
1035
1012
  {
1036
- "kind": "field",
1037
- "name": "hasSlotController",
1038
- "privacy": "private",
1039
- "default": "new HasSlotController(this, \"leftIcon\", \"rightIcon\")",
1013
+ "kind": "method",
1014
+ "name": "close",
1015
+ "privacy": "public",
1016
+ "description": "Closes the badge",
1040
1017
  "type": {}
1041
1018
  },
1042
1019
  {
1043
1020
  "kind": "method",
1044
- "name": "_handleClick",
1045
- "privacy": "protected",
1021
+ "name": "_handleLabelSlotChange",
1022
+ "privacy": "private",
1046
1023
  "parameters": [
1047
1024
  {
1048
- "name": "event",
1025
+ "name": "e",
1049
1026
  "type": {
1050
- "text": "MouseEvent"
1027
+ "text": "Event"
1051
1028
  }
1052
1029
  }
1053
1030
  ],
1054
- "type": {},
1055
- "inheritedFrom": {
1056
- "name": "ButtonElement",
1057
- "module": "src/base/button-element.ts"
1058
- }
1031
+ "type": {}
1059
1032
  },
1060
1033
  {
1061
- "kind": "field",
1062
- "name": "_clickHandler",
1034
+ "kind": "method",
1035
+ "name": "_renderBadge",
1063
1036
  "privacy": "private",
1064
1037
  "type": {}
1065
1038
  },
1066
1039
  {
1067
- "kind": "field",
1068
- "name": "variant",
1069
- "type": {
1070
- "text": "\"primary\" | \"outline\" | \"ghost\" | \"danger\""
1071
- },
1072
- "default": "\"primary\"",
1073
- "description": "Sets the visual variants such as: `primary`, `outline`, `ghost`. `danger` is @deprecated since v3.5.6",
1074
- "attribute": "variant",
1075
- "reflects": true,
1040
+ "kind": "method",
1041
+ "name": "emit",
1042
+ "parameters": [
1043
+ {
1044
+ "name": "name",
1045
+ "type": {
1046
+ "text": "string"
1047
+ }
1048
+ },
1049
+ {
1050
+ "name": "options",
1051
+ "optional": true,
1052
+ "type": {
1053
+ "text": "CustomEventInit<T>"
1054
+ }
1055
+ }
1056
+ ],
1057
+ "description": "Emits a custom event with more convenient defaults.",
1058
+ "type": {},
1076
1059
  "inheritedFrom": {
1077
- "name": "ButtonElement",
1078
- "module": "src/base/button-element.ts"
1060
+ "name": "SgdsElement",
1061
+ "module": "src/base/sgds-element.ts"
1079
1062
  }
1080
1063
  },
1081
1064
  {
1082
- "kind": "field",
1083
- "name": "tone",
1084
- "type": {
1085
- "text": "\"brand\" | \"danger\" | \"fixed-light\" | \"neutral\""
1086
- },
1087
- "default": "\"brand\"",
1088
- "description": "Sets the visual colour of the button: `brand`, `danger`, `fixed-light`, `neutral`",
1089
- "attribute": "tone",
1090
- "reflects": true,
1065
+ "kind": "method",
1066
+ "name": "define",
1067
+ "static": true,
1068
+ "parameters": [
1069
+ {
1070
+ "name": "name",
1071
+ "type": {
1072
+ "text": "string"
1073
+ }
1074
+ },
1075
+ {
1076
+ "name": "elementConstructor",
1077
+ "default": "this"
1078
+ },
1079
+ {
1080
+ "name": "options",
1081
+ "default": "{}",
1082
+ "type": {
1083
+ "text": "ElementDefinitionOptions"
1084
+ }
1085
+ }
1086
+ ],
1087
+ "type": {},
1091
1088
  "inheritedFrom": {
1092
- "name": "ButtonElement",
1093
- "module": "src/base/button-element.ts"
1089
+ "name": "SgdsElement",
1090
+ "module": "src/base/sgds-element.ts"
1094
1091
  }
1092
+ }
1093
+ ],
1094
+ "events": [
1095
+ {
1096
+ "description": "Emitted when the badge appears.",
1097
+ "name": "sgds-show",
1098
+ "reactName": "onSgdsShow"
1095
1099
  },
1096
1100
  {
1097
- "kind": "field",
1098
- "name": "size",
1099
- "type": {
1100
- "text": "\"xs\" | \"sm\" | \"md\" | \"lg\""
1101
- },
1102
- "default": "\"md\"",
1103
- "description": "Specifies a small, medium or large button, the size is medium by default.",
1104
- "attribute": "size",
1105
- "reflects": true,
1106
- "inheritedFrom": {
1107
- "name": "ButtonElement",
1108
- "module": "src/base/button-element.ts"
1109
- }
1101
+ "description": "Emitted when the badge is starting to close but has not closed.",
1102
+ "name": "sgds-hide",
1103
+ "reactName": "onSgdsHide"
1110
1104
  },
1111
1105
  {
1112
- "kind": "field",
1113
- "name": "active",
1106
+ "description": "Emitted after the badge has appeared",
1107
+ "name": "sgds-after-show",
1108
+ "reactName": "onSgdsAfterShow"
1109
+ },
1110
+ {
1111
+ "description": "Emitted after the badge has closed",
1112
+ "name": "sgds-after-hide",
1113
+ "reactName": "onSgdsAfterHide"
1114
+ }
1115
+ ],
1116
+ "attributes": [
1117
+ {
1118
+ "name": "show",
1114
1119
  "type": {
1115
1120
  "text": "boolean"
1116
1121
  },
1117
1122
  "default": "false",
1118
- "description": "Manually set the visual state of the button to `:active`",
1119
- "attribute": "active",
1120
- "reflects": true,
1121
- "inheritedFrom": {
1122
- "name": "ButtonElement",
1123
- "module": "src/base/button-element.ts"
1124
- }
1123
+ "description": "Controls the appearance of the dismissible badge. This prop only applies when dismissible is true",
1124
+ "fieldName": "show"
1125
1125
  },
1126
1126
  {
1127
- "kind": "field",
1128
- "name": "disabled",
1127
+ "name": "variant",
1128
+ "type": {
1129
+ "text": "BadgeVariant"
1130
+ },
1131
+ "default": "\"primary\"",
1132
+ "description": "One or more badge variant combinations.\nVariants include: `primary`, `accent`, `success`, `danger`, `warning`, `cyan`, `purple`, `neutral`, `white`, `info`.\n\n(@deprecated) The `info` variant is deprecated. Use `primary` instead.",
1133
+ "fieldName": "variant"
1134
+ },
1135
+ {
1136
+ "name": "outlined",
1129
1137
  "type": {
1130
1138
  "text": "boolean"
1131
1139
  },
1132
1140
  "default": "false",
1133
- "description": "The disabled state of the button",
1134
- "attribute": "disabled",
1135
- "reflects": true,
1136
- "inheritedFrom": {
1137
- "name": "ButtonElement",
1138
- "module": "src/base/button-element.ts"
1139
- }
1141
+ "description": "Manually set the outlined state to false",
1142
+ "fieldName": "outlined"
1140
1143
  },
1141
1144
  {
1142
- "kind": "field",
1143
- "name": "href",
1145
+ "name": "dismissible",
1144
1146
  "type": {
1145
- "text": "string"
1147
+ "text": "boolean"
1146
1148
  },
1147
- "description": "When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`.",
1148
- "attribute": "href",
1149
- "reflects": true,
1150
- "inheritedFrom": {
1151
- "name": "ButtonElement",
1152
- "module": "src/base/button-element.ts"
1153
- }
1149
+ "default": "false",
1150
+ "description": "Manually set the dismissible state of the button to `false`",
1151
+ "fieldName": "dismissible"
1154
1152
  },
1155
1153
  {
1156
- "kind": "field",
1157
- "name": "target",
1154
+ "name": "fullWidth",
1158
1155
  "type": {
1159
- "text": "\"_blank\" | \"_parent\" | \"_self\" | \"_top\""
1156
+ "text": "boolean"
1160
1157
  },
1161
- "default": "\"_self\"",
1162
- "description": "Where to display the linked URL, as the name for a browsing context. Forwards to the HTMLAnchor target attribute",
1163
- "attribute": "target",
1164
- "reflects": true,
1165
- "inheritedFrom": {
1166
- "name": "ButtonElement",
1167
- "module": "src/base/button-element.ts"
1168
- }
1169
- },
1158
+ "default": "false",
1159
+ "description": "Manually enable full width",
1160
+ "fieldName": "fullWidth"
1161
+ }
1162
+ ],
1163
+ "superclass": {
1164
+ "name": "SgdsElement",
1165
+ "module": "/src/base/sgds-element"
1166
+ },
1167
+ "summary": "Badges can be used to highlight important bits of information such as labels, notifications & status.\nWhen the text exceeds the width, it will be truncated with a tooltip that will be displayed on hover.",
1168
+ "tagName": "sgds-badge",
1169
+ "customElement": true,
1170
+ "modulePath": "src/components/Badge/sgds-badge.ts",
1171
+ "cssProperties": [],
1172
+ "cssParts": [],
1173
+ "cssStates": []
1174
+ }
1175
+ ],
1176
+ "exports": [
1177
+ {
1178
+ "kind": "js",
1179
+ "name": "SgdsBadge",
1180
+ "declaration": {
1181
+ "name": "SgdsBadge",
1182
+ "module": "src/components/Badge/sgds-badge.ts"
1183
+ }
1184
+ },
1185
+ {
1186
+ "kind": "js",
1187
+ "name": "default",
1188
+ "declaration": {
1189
+ "name": "SgdsBadge",
1190
+ "module": "src/components/Badge/sgds-badge.ts"
1191
+ }
1192
+ }
1193
+ ]
1194
+ },
1195
+ {
1196
+ "kind": "javascript-module",
1197
+ "path": "src/components/Breadcrumb/sgds-breadcrumb-item.ts",
1198
+ "declarations": [
1199
+ {
1200
+ "kind": "class",
1201
+ "description": "",
1202
+ "name": "SgdsBreadcrumbItem",
1203
+ "slots": [
1170
1204
  {
1171
- "kind": "field",
1172
- "name": "download",
1173
- "type": {
1174
- "text": "string"
1175
- },
1176
- "description": "Tells the browser to download the linked file as this filename. Only used when `href` is set.",
1177
- "attribute": "download",
1178
- "reflects": true,
1179
- "inheritedFrom": {
1180
- "name": "ButtonElement",
1181
- "module": "src/base/button-element.ts"
1182
- }
1183
- },
1205
+ "description": "The link of the item. Pass in anchor tags into this slot",
1206
+ "name": "default"
1207
+ }
1208
+ ],
1209
+ "members": [
1184
1210
  {
1185
1211
  "kind": "field",
1186
- "name": "ariaLabel",
1212
+ "name": "dependencies",
1187
1213
  "type": {
1188
- "text": "string"
1214
+ "text": "Record<string, typeof SgdsElement>"
1189
1215
  },
1190
- "description": "The aria-label attribute to passed to button element when necessary",
1191
- "attribute": "ariaLabel",
1192
- "inheritedFrom": {
1193
- "name": "ButtonElement",
1194
- "module": "src/base/button-element.ts"
1195
- }
1216
+ "static": true,
1217
+ "default": "{\n \"sgds-link\": SgdsLink,\n \"sgds-icon\": SgdsIcon\n }"
1196
1218
  },
1197
1219
  {
1198
1220
  "kind": "field",
1199
- "name": "loading",
1221
+ "name": "active",
1200
1222
  "type": {
1201
1223
  "text": "boolean"
1202
1224
  },
1203
- "description": "When true, shows a loading spinner",
1204
- "attribute": "loading",
1205
- "inheritedFrom": {
1206
- "name": "ButtonElement",
1207
- "module": "src/base/button-element.ts"
1208
- }
1209
- },
1210
- {
1211
- "kind": "method",
1212
- "name": "focus",
1213
- "privacy": "public",
1214
- "parameters": [
1215
- {
1216
- "name": "options",
1217
- "optional": true,
1218
- "type": {
1219
- "text": "FocusOptions"
1220
- }
1221
- }
1222
- ],
1223
- "description": "Sets focus on the button.",
1224
- "type": {},
1225
- "inheritedFrom": {
1226
- "name": "ButtonElement",
1227
- "module": "src/base/button-element.ts"
1228
- }
1229
- },
1230
- {
1231
- "kind": "method",
1232
- "name": "click",
1233
- "privacy": "public",
1234
- "description": "Simulates a click on the button.",
1235
- "type": {},
1236
- "inheritedFrom": {
1237
- "name": "ButtonElement",
1238
- "module": "src/base/button-element.ts"
1239
- }
1240
- },
1241
- {
1242
- "kind": "method",
1243
- "name": "blur",
1244
- "privacy": "public",
1245
- "description": "Removes focus from the button.",
1246
- "type": {},
1247
- "inheritedFrom": {
1248
- "name": "ButtonElement",
1249
- "module": "src/base/button-element.ts"
1250
- }
1251
- },
1252
- {
1253
- "kind": "method",
1254
- "name": "_handleBlur",
1255
- "privacy": "protected",
1256
- "type": {},
1257
- "inheritedFrom": {
1258
- "name": "ButtonElement",
1259
- "module": "src/base/button-element.ts"
1260
- }
1261
- },
1262
- {
1263
- "kind": "method",
1264
- "name": "_handleFocus",
1265
- "privacy": "protected",
1266
- "type": {},
1267
- "inheritedFrom": {
1268
- "name": "ButtonElement",
1269
- "module": "src/base/button-element.ts"
1270
- }
1271
- },
1272
- {
1273
- "kind": "method",
1274
- "name": "_handleKeydown",
1275
- "privacy": "protected",
1276
- "parameters": [
1277
- {
1278
- "name": "event",
1279
- "type": {
1280
- "text": "KeyboardEvent"
1281
- }
1282
- }
1283
- ],
1284
- "type": {},
1285
- "inheritedFrom": {
1286
- "name": "ButtonElement",
1287
- "module": "src/base/button-element.ts"
1288
- }
1289
- },
1290
- {
1291
- "kind": "method",
1292
- "name": "_assignSpinnerSize",
1293
- "privacy": "protected",
1294
- "parameters": [
1295
- {
1296
- "name": "buttonSize",
1297
- "type": {
1298
- "text": "\"xs\" | \"sm\" | \"md\" | \"lg\""
1299
- }
1300
- }
1301
- ],
1302
- "type": {},
1303
- "inheritedFrom": {
1304
- "name": "ButtonElement",
1305
- "module": "src/base/button-element.ts"
1306
- }
1307
- },
1308
- {
1309
- "kind": "method",
1310
- "name": "_assignSpinnerTone",
1311
- "privacy": "protected",
1312
- "return": {
1313
- "type": {
1314
- "text": "SpinnerTone"
1315
- }
1316
- },
1317
- "parameters": [
1318
- {
1319
- "name": "buttonTone",
1320
- "type": {
1321
- "text": "ButtonTone"
1322
- }
1323
- },
1324
- {
1325
- "name": "buttonVariant",
1326
- "type": {
1327
- "text": "ButtonVariant"
1328
- }
1329
- }
1330
- ],
1331
- "type": {},
1332
- "inheritedFrom": {
1333
- "name": "ButtonElement",
1334
- "module": "src/base/button-element.ts"
1335
- }
1225
+ "default": "false",
1226
+ "description": "Indicates the link matches the current location of the page. Programmatically handled by SgdsBreadcrumb to set this prop to true for the last breadcrumb item",
1227
+ "attribute": "active",
1228
+ "reflects": true
1336
1229
  },
1337
1230
  {
1338
1231
  "kind": "method",
@@ -1389,265 +1282,61 @@
1389
1282
  }
1390
1283
  }
1391
1284
  ],
1392
- "events": [
1393
- {
1394
- "description": "Emitted when the button is blurred.",
1395
- "name": "sgds-blur",
1396
- "reactName": "onSgdsBlur"
1397
- },
1398
- {
1399
- "description": "Emitted when the button is focused.",
1400
- "name": "sgds-focus",
1401
- "reactName": "onSgdsFocus"
1402
- }
1403
- ],
1404
1285
  "attributes": [
1405
1286
  {
1406
- "name": "type",
1287
+ "name": "active",
1407
1288
  "type": {
1408
- "text": "\"button\" | \"submit\" | \"reset\""
1409
- },
1410
- "default": "\"button\"",
1411
- "description": "The behavior of the button with default as `type='button', `reset` resets all the controls to their initial values and `submit` submits the form data to the server",
1412
- "fieldName": "type"
1413
- },
1414
- {
1415
- "name": "form",
1416
- "type": {
1417
- "text": "string"
1418
- },
1419
- "description": "The \"form owner\" to associate the button with. If omitted, the closest containing form will be used instead. The\nvalue of this attribute must be an id of a form in the same document or shadow root as the button.",
1420
- "fieldName": "form"
1421
- },
1422
- {
1423
- "name": "formaction",
1424
- "type": {
1425
- "text": "string"
1426
- },
1427
- "description": "Used to override the form owner's `action` attribute.",
1428
- "fieldName": "formAction"
1429
- },
1430
- {
1431
- "name": "formmethod",
1432
- "type": {
1433
- "text": "\"post\" | \"get\""
1434
- },
1435
- "description": "Used to override the form owner's `method` attribute.",
1436
- "fieldName": "formMethod"
1437
- },
1438
- {
1439
- "name": "formnovalidate",
1440
- "type": {
1441
- "text": "boolean"
1442
- },
1443
- "description": "Used to override the form owner's `novalidate` attribute.",
1444
- "fieldName": "formNoValidate"
1445
- },
1446
- {
1447
- "name": "formtarget",
1448
- "type": {
1449
- "text": "| \"_self\"\n | \"_blank\"\n | \"_parent\"\n | \"_top\"\n | string"
1450
- },
1451
- "description": "Used to override the form owner's `target` attribute.",
1452
- "fieldName": "formTarget"
1453
- },
1454
- {
1455
- "name": "fullWidth",
1456
- "type": {
1457
- "text": "boolean"
1458
- },
1459
- "default": "false",
1460
- "description": "When set, the button will be in full width.",
1461
- "fieldName": "fullWidth"
1462
- },
1463
- {
1464
- "name": "hasLeftIconSlot",
1465
- "type": {
1466
- "text": "boolean"
1467
- },
1468
- "default": "false",
1469
- "description": "Used only for SSR to indicate the presence of the `leftIcon` slot.",
1470
- "fieldName": "hasLeftIconSlot"
1471
- },
1472
- {
1473
- "name": "hasRightIconSlot",
1474
- "type": {
1475
- "text": "boolean"
1289
+ "text": "boolean"
1476
1290
  },
1477
1291
  "default": "false",
1478
- "description": "Used only for SSR to indicate the presence of the `rightIcon` slot.",
1479
- "fieldName": "hasRightIconSlot"
1480
- },
1481
- {
1482
- "name": "variant",
1483
- "type": {
1484
- "text": "ButtonVariant"
1485
- },
1486
- "default": "\"primary\"",
1487
- "description": "Sets the visual variants such as: `primary`, `outline`, `ghost`. `danger` is @deprecated since v3.5.6",
1488
- "fieldName": "variant",
1489
- "inheritedFrom": {
1490
- "name": "ButtonElement",
1491
- "module": "src/base/button-element.ts"
1492
- }
1493
- },
1494
- {
1495
- "name": "tone",
1496
- "type": {
1497
- "text": "ButtonTone"
1498
- },
1499
- "default": "\"brand\"",
1500
- "description": "Sets the visual colour of the button: `brand`, `danger`, `fixed-light`, `neutral`",
1501
- "fieldName": "tone",
1502
- "inheritedFrom": {
1503
- "name": "ButtonElement",
1504
- "module": "src/base/button-element.ts"
1505
- }
1506
- },
1507
- {
1508
- "name": "size",
1509
- "type": {
1510
- "text": "\"xs\" | \"sm\" | \"md\" | \"lg\""
1511
- },
1512
- "default": "\"md\"",
1513
- "description": "Specifies a small, medium or large button, the size is medium by default.",
1514
- "fieldName": "size",
1515
- "inheritedFrom": {
1516
- "name": "ButtonElement",
1517
- "module": "src/base/button-element.ts"
1518
- }
1519
- },
1520
- {
1521
- "name": "active",
1522
- "type": {
1523
- "text": "boolean"
1524
- },
1525
- "default": "false",
1526
- "description": "Manually set the visual state of the button to `:active`",
1527
- "fieldName": "active",
1528
- "inheritedFrom": {
1529
- "name": "ButtonElement",
1530
- "module": "src/base/button-element.ts"
1531
- }
1532
- },
1533
- {
1534
- "name": "disabled",
1535
- "type": {
1536
- "text": "boolean"
1537
- },
1538
- "default": "false",
1539
- "description": "The disabled state of the button",
1540
- "fieldName": "disabled",
1541
- "inheritedFrom": {
1542
- "name": "ButtonElement",
1543
- "module": "src/base/button-element.ts"
1544
- }
1545
- },
1546
- {
1547
- "name": "href",
1548
- "type": {
1549
- "text": "string"
1550
- },
1551
- "description": "When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`.",
1552
- "fieldName": "href",
1553
- "inheritedFrom": {
1554
- "name": "ButtonElement",
1555
- "module": "src/base/button-element.ts"
1556
- }
1557
- },
1558
- {
1559
- "name": "target",
1560
- "type": {
1561
- "text": "\"_blank\" | \"_parent\" | \"_self\" | \"_top\""
1562
- },
1563
- "default": "\"_self\"",
1564
- "description": "Where to display the linked URL, as the name for a browsing context. Forwards to the HTMLAnchor target attribute",
1565
- "fieldName": "target",
1566
- "inheritedFrom": {
1567
- "name": "ButtonElement",
1568
- "module": "src/base/button-element.ts"
1569
- }
1570
- },
1571
- {
1572
- "name": "download",
1573
- "type": {
1574
- "text": "string"
1575
- },
1576
- "description": "Tells the browser to download the linked file as this filename. Only used when `href` is set.",
1577
- "fieldName": "download",
1578
- "inheritedFrom": {
1579
- "name": "ButtonElement",
1580
- "module": "src/base/button-element.ts"
1581
- }
1582
- },
1583
- {
1584
- "name": "ariaLabel",
1585
- "type": {
1586
- "text": "string"
1587
- },
1588
- "description": "The aria-label attribute to passed to button element when necessary",
1589
- "fieldName": "ariaLabel",
1590
- "inheritedFrom": {
1591
- "name": "ButtonElement",
1592
- "module": "src/base/button-element.ts"
1593
- }
1594
- },
1595
- {
1596
- "name": "loading",
1597
- "type": {
1598
- "text": "boolean"
1599
- },
1600
- "description": "When true, shows a loading spinner",
1601
- "fieldName": "loading",
1602
- "inheritedFrom": {
1603
- "name": "ButtonElement",
1604
- "module": "src/base/button-element.ts"
1605
- }
1292
+ "description": "Indicates the link matches the current location of the page. Programmatically handled by SgdsBreadcrumb to set this prop to true for the last breadcrumb item",
1293
+ "fieldName": "active"
1606
1294
  }
1607
1295
  ],
1608
1296
  "superclass": {
1609
- "name": "ButtonElement",
1610
- "module": "/src/base/button-element"
1297
+ "name": "SgdsElement",
1298
+ "module": "/src/base/sgds-element"
1611
1299
  },
1612
- "summary": "Custom button styles for actions in forms, dialogs, and more with support for multiple sizes, states, and more.",
1613
- "tagName": "sgds-button",
1300
+ "summary": "Breadcrumb Item are navigational links used in Breadcrumb component",
1301
+ "tagName": "sgds-breadcrumb-item",
1614
1302
  "customElement": true,
1615
- "modulePath": "src/components/Button/sgds-button.ts",
1303
+ "modulePath": "src/components/Breadcrumb/sgds-breadcrumb-item.ts",
1616
1304
  "cssProperties": [],
1617
1305
  "cssParts": [],
1618
- "cssStates": []
1306
+ "cssStates": [],
1307
+ "events": []
1619
1308
  }
1620
1309
  ],
1621
1310
  "exports": [
1622
1311
  {
1623
1312
  "kind": "js",
1624
- "name": "SgdsButton",
1313
+ "name": "SgdsBreadcrumbItem",
1625
1314
  "declaration": {
1626
- "name": "SgdsButton",
1627
- "module": "src/components/Button/sgds-button.ts"
1315
+ "name": "SgdsBreadcrumbItem",
1316
+ "module": "src/components/Breadcrumb/sgds-breadcrumb-item.ts"
1628
1317
  }
1629
1318
  },
1630
1319
  {
1631
1320
  "kind": "js",
1632
1321
  "name": "default",
1633
1322
  "declaration": {
1634
- "name": "SgdsButton",
1635
- "module": "src/components/Button/sgds-button.ts"
1323
+ "name": "SgdsBreadcrumbItem",
1324
+ "module": "src/components/Breadcrumb/sgds-breadcrumb-item.ts"
1636
1325
  }
1637
1326
  }
1638
1327
  ]
1639
1328
  },
1640
1329
  {
1641
1330
  "kind": "javascript-module",
1642
- "path": "src/components/Breadcrumb/sgds-breadcrumb-item.ts",
1331
+ "path": "src/components/Breadcrumb/sgds-breadcrumb.ts",
1643
1332
  "declarations": [
1644
1333
  {
1645
1334
  "kind": "class",
1646
1335
  "description": "",
1647
- "name": "SgdsBreadcrumbItem",
1336
+ "name": "SgdsBreadcrumb",
1648
1337
  "slots": [
1649
1338
  {
1650
- "description": "The link of the item. Pass in anchor tags into this slot",
1339
+ "description": "The slot to pass in custom elements of `SgdsBreadcrumbItems`.",
1651
1340
  "name": "default"
1652
1341
  }
1653
1342
  ],
@@ -1656,164 +1345,30 @@
1656
1345
  "kind": "field",
1657
1346
  "name": "dependencies",
1658
1347
  "type": {
1659
- "text": "Record<string, typeof SgdsElement>"
1348
+ "text": "object"
1660
1349
  },
1661
1350
  "static": true,
1662
- "default": "{\n \"sgds-link\": SgdsLink,\n \"sgds-icon\": SgdsIcon\n }"
1351
+ "default": "{\n \"sgds-overflow-menu\": SgdsOverflowMenu\n }"
1663
1352
  },
1664
1353
  {
1665
1354
  "kind": "field",
1666
- "name": "active",
1355
+ "name": "ariaLabel",
1667
1356
  "type": {
1668
- "text": "boolean"
1357
+ "text": "string"
1669
1358
  },
1670
- "default": "false",
1671
- "description": "Indicates the link matches the current location of the page. Programmatically handled by SgdsBreadcrumb to set this prop to true for the last breadcrumb item",
1672
- "attribute": "active",
1673
- "reflects": true
1359
+ "default": "\"breadcrumb\"",
1360
+ "description": "The aria-label of nav element within breadcrumb component.",
1361
+ "attribute": "ariaLabel"
1674
1362
  },
1675
1363
  {
1676
1364
  "kind": "method",
1677
- "name": "emit",
1365
+ "name": "_replaceExcessItemsWithDropdown",
1366
+ "privacy": "private",
1678
1367
  "parameters": [
1679
1368
  {
1680
- "name": "name",
1681
- "type": {
1682
- "text": "string"
1683
- }
1684
- },
1685
- {
1686
- "name": "options",
1687
- "optional": true,
1369
+ "name": "items",
1688
1370
  "type": {
1689
- "text": "CustomEventInit<T>"
1690
- }
1691
- }
1692
- ],
1693
- "description": "Emits a custom event with more convenient defaults.",
1694
- "type": {},
1695
- "inheritedFrom": {
1696
- "name": "SgdsElement",
1697
- "module": "src/base/sgds-element.ts"
1698
- }
1699
- },
1700
- {
1701
- "kind": "method",
1702
- "name": "define",
1703
- "static": true,
1704
- "parameters": [
1705
- {
1706
- "name": "name",
1707
- "type": {
1708
- "text": "string"
1709
- }
1710
- },
1711
- {
1712
- "name": "elementConstructor",
1713
- "default": "this"
1714
- },
1715
- {
1716
- "name": "options",
1717
- "default": "{}",
1718
- "type": {
1719
- "text": "ElementDefinitionOptions"
1720
- }
1721
- }
1722
- ],
1723
- "type": {},
1724
- "inheritedFrom": {
1725
- "name": "SgdsElement",
1726
- "module": "src/base/sgds-element.ts"
1727
- }
1728
- }
1729
- ],
1730
- "attributes": [
1731
- {
1732
- "name": "active",
1733
- "type": {
1734
- "text": "boolean"
1735
- },
1736
- "default": "false",
1737
- "description": "Indicates the link matches the current location of the page. Programmatically handled by SgdsBreadcrumb to set this prop to true for the last breadcrumb item",
1738
- "fieldName": "active"
1739
- }
1740
- ],
1741
- "superclass": {
1742
- "name": "SgdsElement",
1743
- "module": "/src/base/sgds-element"
1744
- },
1745
- "summary": "Breadcrumb Item are navigational links used in Breadcrumb component",
1746
- "tagName": "sgds-breadcrumb-item",
1747
- "customElement": true,
1748
- "modulePath": "src/components/Breadcrumb/sgds-breadcrumb-item.ts",
1749
- "cssProperties": [],
1750
- "cssParts": [],
1751
- "cssStates": [],
1752
- "events": []
1753
- }
1754
- ],
1755
- "exports": [
1756
- {
1757
- "kind": "js",
1758
- "name": "SgdsBreadcrumbItem",
1759
- "declaration": {
1760
- "name": "SgdsBreadcrumbItem",
1761
- "module": "src/components/Breadcrumb/sgds-breadcrumb-item.ts"
1762
- }
1763
- },
1764
- {
1765
- "kind": "js",
1766
- "name": "default",
1767
- "declaration": {
1768
- "name": "SgdsBreadcrumbItem",
1769
- "module": "src/components/Breadcrumb/sgds-breadcrumb-item.ts"
1770
- }
1771
- }
1772
- ]
1773
- },
1774
- {
1775
- "kind": "javascript-module",
1776
- "path": "src/components/Breadcrumb/sgds-breadcrumb.ts",
1777
- "declarations": [
1778
- {
1779
- "kind": "class",
1780
- "description": "",
1781
- "name": "SgdsBreadcrumb",
1782
- "slots": [
1783
- {
1784
- "description": "The slot to pass in custom elements of `SgdsBreadcrumbItems`.",
1785
- "name": "default"
1786
- }
1787
- ],
1788
- "members": [
1789
- {
1790
- "kind": "field",
1791
- "name": "dependencies",
1792
- "type": {
1793
- "text": "object"
1794
- },
1795
- "static": true,
1796
- "default": "{\n \"sgds-overflow-menu\": SgdsOverflowMenu\n }"
1797
- },
1798
- {
1799
- "kind": "field",
1800
- "name": "ariaLabel",
1801
- "type": {
1802
- "text": "string"
1803
- },
1804
- "default": "\"breadcrumb\"",
1805
- "description": "The aria-label of nav element within breadcrumb component.",
1806
- "attribute": "ariaLabel"
1807
- },
1808
- {
1809
- "kind": "method",
1810
- "name": "_replaceExcessItemsWithDropdown",
1811
- "privacy": "private",
1812
- "parameters": [
1813
- {
1814
- "name": "items",
1815
- "type": {
1816
- "text": "SgdsBreadcrumbItem[]"
1371
+ "text": "SgdsBreadcrumbItem[]"
1817
1372
  }
1818
1373
  }
1819
1374
  ],
@@ -2421,65 +1976,86 @@
2421
1976
  },
2422
1977
  {
2423
1978
  "kind": "javascript-module",
2424
- "path": "src/components/Badge/sgds-badge.ts",
1979
+ "path": "src/components/Button/sgds-button.ts",
2425
1980
  "declarations": [
2426
1981
  {
2427
1982
  "kind": "class",
2428
1983
  "description": "",
2429
- "name": "SgdsBadge",
1984
+ "name": "SgdsButton",
2430
1985
  "slots": [
2431
1986
  {
2432
- "description": "slot for badge",
1987
+ "description": "The button's label.",
2433
1988
  "name": "default"
2434
1989
  },
2435
1990
  {
2436
- "description": "The slot for icon to the left of the badge text",
2437
- "name": "icon"
1991
+ "description": "The slot for icon to the left of the button text",
1992
+ "name": "leftIcon"
1993
+ },
1994
+ {
1995
+ "description": "The slot for icon to the right of the button text",
1996
+ "name": "rightIcon"
2438
1997
  }
2439
1998
  ],
2440
1999
  "members": [
2441
2000
  {
2442
2001
  "kind": "field",
2443
- "name": "show",
2002
+ "name": "type",
2444
2003
  "type": {
2445
- "text": "boolean"
2004
+ "text": "\"button\" | \"submit\" | \"reset\""
2446
2005
  },
2447
- "default": "false",
2448
- "description": "Controls the appearance of the dismissible badge. This prop only applies when dismissible is true",
2449
- "attribute": "show",
2006
+ "default": "\"button\"",
2007
+ "description": "The behavior of the button with default as `type='button', `reset` resets all the controls to their initial values and `submit` submits the form data to the server",
2008
+ "attribute": "type",
2450
2009
  "reflects": true
2451
2010
  },
2452
2011
  {
2453
2012
  "kind": "field",
2454
- "name": "variant",
2013
+ "name": "form",
2455
2014
  "type": {
2456
- "text": "\"primary\" | \"accent\" | \"success\" | \"danger\" | \"warning\" | \"cyan\" | \"purple\" | \"neutral\" | \"white\" | \"info\""
2015
+ "text": "string"
2457
2016
  },
2458
- "default": "\"primary\"",
2459
- "description": "One or more badge variant combinations.\nVariants include: `primary`, `accent`, `success`, `danger`, `warning`, `cyan`, `purple`, `neutral`, `white`, `info`.\n\n(@deprecated) The `info` variant is deprecated. Use `primary` instead.",
2460
- "attribute": "variant",
2017
+ "description": "The \"form owner\" to associate the button with. If omitted, the closest containing form will be used instead. The\nvalue of this attribute must be an id of a form in the same document or shadow root as the button.",
2018
+ "attribute": "form",
2461
2019
  "reflects": true
2462
2020
  },
2463
2021
  {
2464
2022
  "kind": "field",
2465
- "name": "outlined",
2023
+ "name": "formAction",
2466
2024
  "type": {
2467
- "text": "boolean"
2025
+ "text": "string"
2468
2026
  },
2469
- "default": "false",
2470
- "description": "Manually set the outlined state to false",
2471
- "attribute": "outlined",
2027
+ "description": "Used to override the form owner's `action` attribute.",
2028
+ "attribute": "formaction",
2472
2029
  "reflects": true
2473
2030
  },
2474
2031
  {
2475
2032
  "kind": "field",
2476
- "name": "dismissible",
2033
+ "name": "formMethod",
2034
+ "type": {
2035
+ "text": "\"post\" | \"get\""
2036
+ },
2037
+ "description": "Used to override the form owner's `method` attribute.",
2038
+ "attribute": "formmethod",
2039
+ "reflects": true
2040
+ },
2041
+ {
2042
+ "kind": "field",
2043
+ "name": "formNoValidate",
2477
2044
  "type": {
2478
2045
  "text": "boolean"
2479
2046
  },
2480
- "default": "false",
2481
- "description": "Manually set the dismissible state of the button to `false`",
2482
- "attribute": "dismissible",
2047
+ "description": "Used to override the form owner's `novalidate` attribute.",
2048
+ "attribute": "formnovalidate",
2049
+ "reflects": true
2050
+ },
2051
+ {
2052
+ "kind": "field",
2053
+ "name": "formTarget",
2054
+ "type": {
2055
+ "text": "| \"_self\"\n | \"_blank\"\n | \"_parent\"\n | \"_top\"\n | string"
2056
+ },
2057
+ "description": "Used to override the form owner's `target` attribute.",
2058
+ "attribute": "formtarget",
2483
2059
  "reflects": true
2484
2060
  },
2485
2061
  {
@@ -2489,54 +2065,331 @@
2489
2065
  "text": "boolean"
2490
2066
  },
2491
2067
  "default": "false",
2492
- "description": "Manually enable full width",
2068
+ "description": "When set, the button will be in full width.",
2493
2069
  "attribute": "fullWidth",
2494
2070
  "reflects": true
2495
2071
  },
2496
2072
  {
2497
2073
  "kind": "field",
2498
- "name": "truncated",
2074
+ "name": "hasLeftIconSlot",
2499
2075
  "type": {
2500
2076
  "text": "boolean"
2501
2077
  },
2078
+ "default": "false",
2079
+ "description": "Used only for SSR to indicate the presence of the `leftIcon` slot.",
2080
+ "attribute": "hasLeftIconSlot"
2081
+ },
2082
+ {
2083
+ "kind": "field",
2084
+ "name": "hasRightIconSlot",
2085
+ "type": {
2086
+ "text": "boolean"
2087
+ },
2088
+ "default": "false",
2089
+ "description": "Used only for SSR to indicate the presence of the `rightIcon` slot.",
2090
+ "attribute": "hasRightIconSlot"
2091
+ },
2092
+ {
2093
+ "kind": "field",
2094
+ "name": "hasSlotController",
2502
2095
  "privacy": "private",
2503
- "default": "false"
2096
+ "default": "new HasSlotController(this, \"leftIcon\", \"rightIcon\")",
2097
+ "type": {}
2098
+ },
2099
+ {
2100
+ "kind": "method",
2101
+ "name": "_handleClick",
2102
+ "privacy": "protected",
2103
+ "parameters": [
2104
+ {
2105
+ "name": "event",
2106
+ "type": {
2107
+ "text": "MouseEvent"
2108
+ }
2109
+ }
2110
+ ],
2111
+ "type": {},
2112
+ "inheritedFrom": {
2113
+ "name": "ButtonElement",
2114
+ "module": "src/base/button-element.ts"
2115
+ }
2504
2116
  },
2505
2117
  {
2506
2118
  "kind": "field",
2507
- "name": "text",
2119
+ "name": "_clickHandler",
2120
+ "privacy": "private",
2121
+ "type": {}
2122
+ },
2123
+ {
2124
+ "kind": "field",
2125
+ "name": "variant",
2126
+ "type": {
2127
+ "text": "\"primary\" | \"outline\" | \"ghost\" | \"danger\""
2128
+ },
2129
+ "default": "\"primary\"",
2130
+ "description": "Sets the visual variants such as: `primary`, `outline`, `ghost`. `danger` is @deprecated since v3.5.6",
2131
+ "attribute": "variant",
2132
+ "reflects": true,
2133
+ "inheritedFrom": {
2134
+ "name": "ButtonElement",
2135
+ "module": "src/base/button-element.ts"
2136
+ }
2137
+ },
2138
+ {
2139
+ "kind": "field",
2140
+ "name": "tone",
2141
+ "type": {
2142
+ "text": "\"brand\" | \"danger\" | \"fixed-light\" | \"neutral\""
2143
+ },
2144
+ "default": "\"brand\"",
2145
+ "description": "Sets the visual colour of the button: `brand`, `danger`, `fixed-light`, `neutral`",
2146
+ "attribute": "tone",
2147
+ "reflects": true,
2148
+ "inheritedFrom": {
2149
+ "name": "ButtonElement",
2150
+ "module": "src/base/button-element.ts"
2151
+ }
2152
+ },
2153
+ {
2154
+ "kind": "field",
2155
+ "name": "size",
2156
+ "type": {
2157
+ "text": "\"xs\" | \"sm\" | \"md\" | \"lg\""
2158
+ },
2159
+ "default": "\"md\"",
2160
+ "description": "Specifies a small, medium or large button, the size is medium by default.",
2161
+ "attribute": "size",
2162
+ "reflects": true,
2163
+ "inheritedFrom": {
2164
+ "name": "ButtonElement",
2165
+ "module": "src/base/button-element.ts"
2166
+ }
2167
+ },
2168
+ {
2169
+ "kind": "field",
2170
+ "name": "active",
2171
+ "type": {
2172
+ "text": "boolean"
2173
+ },
2174
+ "default": "false",
2175
+ "description": "Manually set the visual state of the button to `:active`",
2176
+ "attribute": "active",
2177
+ "reflects": true,
2178
+ "inheritedFrom": {
2179
+ "name": "ButtonElement",
2180
+ "module": "src/base/button-element.ts"
2181
+ }
2182
+ },
2183
+ {
2184
+ "kind": "field",
2185
+ "name": "disabled",
2186
+ "type": {
2187
+ "text": "boolean"
2188
+ },
2189
+ "default": "false",
2190
+ "description": "The disabled state of the button",
2191
+ "attribute": "disabled",
2192
+ "reflects": true,
2193
+ "inheritedFrom": {
2194
+ "name": "ButtonElement",
2195
+ "module": "src/base/button-element.ts"
2196
+ }
2197
+ },
2198
+ {
2199
+ "kind": "field",
2200
+ "name": "href",
2508
2201
  "type": {
2509
2202
  "text": "string"
2510
2203
  },
2511
- "privacy": "private",
2512
- "default": "\"\""
2204
+ "description": "When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`.",
2205
+ "attribute": "href",
2206
+ "reflects": true,
2207
+ "inheritedFrom": {
2208
+ "name": "ButtonElement",
2209
+ "module": "src/base/button-element.ts"
2210
+ }
2211
+ },
2212
+ {
2213
+ "kind": "field",
2214
+ "name": "target",
2215
+ "type": {
2216
+ "text": "\"_blank\" | \"_parent\" | \"_self\" | \"_top\""
2217
+ },
2218
+ "default": "\"_self\"",
2219
+ "description": "Where to display the linked URL, as the name for a browsing context. Forwards to the HTMLAnchor target attribute",
2220
+ "attribute": "target",
2221
+ "reflects": true,
2222
+ "inheritedFrom": {
2223
+ "name": "ButtonElement",
2224
+ "module": "src/base/button-element.ts"
2225
+ }
2226
+ },
2227
+ {
2228
+ "kind": "field",
2229
+ "name": "download",
2230
+ "type": {
2231
+ "text": "string"
2232
+ },
2233
+ "description": "Tells the browser to download the linked file as this filename. Only used when `href` is set.",
2234
+ "attribute": "download",
2235
+ "reflects": true,
2236
+ "inheritedFrom": {
2237
+ "name": "ButtonElement",
2238
+ "module": "src/base/button-element.ts"
2239
+ }
2240
+ },
2241
+ {
2242
+ "kind": "field",
2243
+ "name": "ariaLabel",
2244
+ "type": {
2245
+ "text": "string"
2246
+ },
2247
+ "description": "The aria-label attribute to passed to button element when necessary",
2248
+ "attribute": "ariaLabel",
2249
+ "inheritedFrom": {
2250
+ "name": "ButtonElement",
2251
+ "module": "src/base/button-element.ts"
2252
+ }
2253
+ },
2254
+ {
2255
+ "kind": "field",
2256
+ "name": "loading",
2257
+ "type": {
2258
+ "text": "boolean"
2259
+ },
2260
+ "description": "When true, shows a loading spinner",
2261
+ "attribute": "loading",
2262
+ "inheritedFrom": {
2263
+ "name": "ButtonElement",
2264
+ "module": "src/base/button-element.ts"
2265
+ }
2513
2266
  },
2514
2267
  {
2515
2268
  "kind": "method",
2516
- "name": "close",
2269
+ "name": "focus",
2517
2270
  "privacy": "public",
2518
- "description": "Closes the badge",
2519
- "type": {}
2271
+ "parameters": [
2272
+ {
2273
+ "name": "options",
2274
+ "optional": true,
2275
+ "type": {
2276
+ "text": "FocusOptions"
2277
+ }
2278
+ }
2279
+ ],
2280
+ "description": "Sets focus on the button.",
2281
+ "type": {},
2282
+ "inheritedFrom": {
2283
+ "name": "ButtonElement",
2284
+ "module": "src/base/button-element.ts"
2285
+ }
2520
2286
  },
2521
2287
  {
2522
2288
  "kind": "method",
2523
- "name": "_handleLabelSlotChange",
2524
- "privacy": "private",
2289
+ "name": "click",
2290
+ "privacy": "public",
2291
+ "description": "Simulates a click on the button.",
2292
+ "type": {},
2293
+ "inheritedFrom": {
2294
+ "name": "ButtonElement",
2295
+ "module": "src/base/button-element.ts"
2296
+ }
2297
+ },
2298
+ {
2299
+ "kind": "method",
2300
+ "name": "blur",
2301
+ "privacy": "public",
2302
+ "description": "Removes focus from the button.",
2303
+ "type": {},
2304
+ "inheritedFrom": {
2305
+ "name": "ButtonElement",
2306
+ "module": "src/base/button-element.ts"
2307
+ }
2308
+ },
2309
+ {
2310
+ "kind": "method",
2311
+ "name": "_handleBlur",
2312
+ "privacy": "protected",
2313
+ "type": {},
2314
+ "inheritedFrom": {
2315
+ "name": "ButtonElement",
2316
+ "module": "src/base/button-element.ts"
2317
+ }
2318
+ },
2319
+ {
2320
+ "kind": "method",
2321
+ "name": "_handleFocus",
2322
+ "privacy": "protected",
2323
+ "type": {},
2324
+ "inheritedFrom": {
2325
+ "name": "ButtonElement",
2326
+ "module": "src/base/button-element.ts"
2327
+ }
2328
+ },
2329
+ {
2330
+ "kind": "method",
2331
+ "name": "_handleKeydown",
2332
+ "privacy": "protected",
2525
2333
  "parameters": [
2526
2334
  {
2527
- "name": "e",
2335
+ "name": "event",
2336
+ "type": {
2337
+ "text": "KeyboardEvent"
2338
+ }
2339
+ }
2340
+ ],
2341
+ "type": {},
2342
+ "inheritedFrom": {
2343
+ "name": "ButtonElement",
2344
+ "module": "src/base/button-element.ts"
2345
+ }
2346
+ },
2347
+ {
2348
+ "kind": "method",
2349
+ "name": "_assignSpinnerSize",
2350
+ "privacy": "protected",
2351
+ "parameters": [
2352
+ {
2353
+ "name": "buttonSize",
2354
+ "type": {
2355
+ "text": "\"xs\" | \"sm\" | \"md\" | \"lg\""
2356
+ }
2357
+ }
2358
+ ],
2359
+ "type": {},
2360
+ "inheritedFrom": {
2361
+ "name": "ButtonElement",
2362
+ "module": "src/base/button-element.ts"
2363
+ }
2364
+ },
2365
+ {
2366
+ "kind": "method",
2367
+ "name": "_assignSpinnerTone",
2368
+ "privacy": "protected",
2369
+ "return": {
2370
+ "type": {
2371
+ "text": "SpinnerTone"
2372
+ }
2373
+ },
2374
+ "parameters": [
2375
+ {
2376
+ "name": "buttonTone",
2377
+ "type": {
2378
+ "text": "ButtonTone"
2379
+ }
2380
+ },
2381
+ {
2382
+ "name": "buttonVariant",
2528
2383
  "type": {
2529
- "text": "Event"
2384
+ "text": "ButtonVariant"
2530
2385
  }
2531
2386
  }
2532
2387
  ],
2533
- "type": {}
2534
- },
2535
- {
2536
- "kind": "method",
2537
- "name": "_renderBadge",
2538
- "privacy": "private",
2539
- "type": {}
2388
+ "type": {},
2389
+ "inheritedFrom": {
2390
+ "name": "ButtonElement",
2391
+ "module": "src/base/button-element.ts"
2392
+ }
2540
2393
  },
2541
2394
  {
2542
2395
  "kind": "method",
@@ -2595,81 +2448,228 @@
2595
2448
  ],
2596
2449
  "events": [
2597
2450
  {
2598
- "description": "Emitted when the badge appears.",
2599
- "name": "sgds-show",
2600
- "reactName": "onSgdsShow"
2451
+ "description": "Emitted when the button is blurred.",
2452
+ "name": "sgds-blur",
2453
+ "reactName": "onSgdsBlur"
2601
2454
  },
2602
2455
  {
2603
- "description": "Emitted when the badge is starting to close but has not closed.",
2604
- "name": "sgds-hide",
2605
- "reactName": "onSgdsHide"
2456
+ "description": "Emitted when the button is focused.",
2457
+ "name": "sgds-focus",
2458
+ "reactName": "onSgdsFocus"
2459
+ }
2460
+ ],
2461
+ "attributes": [
2462
+ {
2463
+ "name": "type",
2464
+ "type": {
2465
+ "text": "\"button\" | \"submit\" | \"reset\""
2466
+ },
2467
+ "default": "\"button\"",
2468
+ "description": "The behavior of the button with default as `type='button', `reset` resets all the controls to their initial values and `submit` submits the form data to the server",
2469
+ "fieldName": "type"
2606
2470
  },
2607
2471
  {
2608
- "description": "Emitted after the badge has appeared",
2609
- "name": "sgds-after-show",
2610
- "reactName": "onSgdsAfterShow"
2472
+ "name": "form",
2473
+ "type": {
2474
+ "text": "string"
2475
+ },
2476
+ "description": "The \"form owner\" to associate the button with. If omitted, the closest containing form will be used instead. The\nvalue of this attribute must be an id of a form in the same document or shadow root as the button.",
2477
+ "fieldName": "form"
2611
2478
  },
2612
2479
  {
2613
- "description": "Emitted after the badge has closed",
2614
- "name": "sgds-after-hide",
2615
- "reactName": "onSgdsAfterHide"
2616
- }
2617
- ],
2618
- "attributes": [
2480
+ "name": "formaction",
2481
+ "type": {
2482
+ "text": "string"
2483
+ },
2484
+ "description": "Used to override the form owner's `action` attribute.",
2485
+ "fieldName": "formAction"
2486
+ },
2619
2487
  {
2620
- "name": "show",
2488
+ "name": "formmethod",
2489
+ "type": {
2490
+ "text": "\"post\" | \"get\""
2491
+ },
2492
+ "description": "Used to override the form owner's `method` attribute.",
2493
+ "fieldName": "formMethod"
2494
+ },
2495
+ {
2496
+ "name": "formnovalidate",
2497
+ "type": {
2498
+ "text": "boolean"
2499
+ },
2500
+ "description": "Used to override the form owner's `novalidate` attribute.",
2501
+ "fieldName": "formNoValidate"
2502
+ },
2503
+ {
2504
+ "name": "formtarget",
2505
+ "type": {
2506
+ "text": "| \"_self\"\n | \"_blank\"\n | \"_parent\"\n | \"_top\"\n | string"
2507
+ },
2508
+ "description": "Used to override the form owner's `target` attribute.",
2509
+ "fieldName": "formTarget"
2510
+ },
2511
+ {
2512
+ "name": "fullWidth",
2621
2513
  "type": {
2622
2514
  "text": "boolean"
2623
2515
  },
2624
2516
  "default": "false",
2625
- "description": "Controls the appearance of the dismissible badge. This prop only applies when dismissible is true",
2626
- "fieldName": "show"
2517
+ "description": "When set, the button will be in full width.",
2518
+ "fieldName": "fullWidth"
2519
+ },
2520
+ {
2521
+ "name": "hasLeftIconSlot",
2522
+ "type": {
2523
+ "text": "boolean"
2524
+ },
2525
+ "default": "false",
2526
+ "description": "Used only for SSR to indicate the presence of the `leftIcon` slot.",
2527
+ "fieldName": "hasLeftIconSlot"
2528
+ },
2529
+ {
2530
+ "name": "hasRightIconSlot",
2531
+ "type": {
2532
+ "text": "boolean"
2533
+ },
2534
+ "default": "false",
2535
+ "description": "Used only for SSR to indicate the presence of the `rightIcon` slot.",
2536
+ "fieldName": "hasRightIconSlot"
2627
2537
  },
2628
2538
  {
2629
2539
  "name": "variant",
2630
2540
  "type": {
2631
- "text": "BadgeVariant"
2541
+ "text": "ButtonVariant"
2632
2542
  },
2633
2543
  "default": "\"primary\"",
2634
- "description": "One or more badge variant combinations.\nVariants include: `primary`, `accent`, `success`, `danger`, `warning`, `cyan`, `purple`, `neutral`, `white`, `info`.\n\n(@deprecated) The `info` variant is deprecated. Use `primary` instead.",
2635
- "fieldName": "variant"
2544
+ "description": "Sets the visual variants such as: `primary`, `outline`, `ghost`. `danger` is @deprecated since v3.5.6",
2545
+ "fieldName": "variant",
2546
+ "inheritedFrom": {
2547
+ "name": "ButtonElement",
2548
+ "module": "src/base/button-element.ts"
2549
+ }
2636
2550
  },
2637
2551
  {
2638
- "name": "outlined",
2552
+ "name": "tone",
2553
+ "type": {
2554
+ "text": "ButtonTone"
2555
+ },
2556
+ "default": "\"brand\"",
2557
+ "description": "Sets the visual colour of the button: `brand`, `danger`, `fixed-light`, `neutral`",
2558
+ "fieldName": "tone",
2559
+ "inheritedFrom": {
2560
+ "name": "ButtonElement",
2561
+ "module": "src/base/button-element.ts"
2562
+ }
2563
+ },
2564
+ {
2565
+ "name": "size",
2566
+ "type": {
2567
+ "text": "\"xs\" | \"sm\" | \"md\" | \"lg\""
2568
+ },
2569
+ "default": "\"md\"",
2570
+ "description": "Specifies a small, medium or large button, the size is medium by default.",
2571
+ "fieldName": "size",
2572
+ "inheritedFrom": {
2573
+ "name": "ButtonElement",
2574
+ "module": "src/base/button-element.ts"
2575
+ }
2576
+ },
2577
+ {
2578
+ "name": "active",
2639
2579
  "type": {
2640
2580
  "text": "boolean"
2641
2581
  },
2642
2582
  "default": "false",
2643
- "description": "Manually set the outlined state to false",
2644
- "fieldName": "outlined"
2583
+ "description": "Manually set the visual state of the button to `:active`",
2584
+ "fieldName": "active",
2585
+ "inheritedFrom": {
2586
+ "name": "ButtonElement",
2587
+ "module": "src/base/button-element.ts"
2588
+ }
2645
2589
  },
2646
2590
  {
2647
- "name": "dismissible",
2591
+ "name": "disabled",
2648
2592
  "type": {
2649
2593
  "text": "boolean"
2650
2594
  },
2651
2595
  "default": "false",
2652
- "description": "Manually set the dismissible state of the button to `false`",
2653
- "fieldName": "dismissible"
2596
+ "description": "The disabled state of the button",
2597
+ "fieldName": "disabled",
2598
+ "inheritedFrom": {
2599
+ "name": "ButtonElement",
2600
+ "module": "src/base/button-element.ts"
2601
+ }
2654
2602
  },
2655
2603
  {
2656
- "name": "fullWidth",
2604
+ "name": "href",
2605
+ "type": {
2606
+ "text": "string"
2607
+ },
2608
+ "description": "When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`.",
2609
+ "fieldName": "href",
2610
+ "inheritedFrom": {
2611
+ "name": "ButtonElement",
2612
+ "module": "src/base/button-element.ts"
2613
+ }
2614
+ },
2615
+ {
2616
+ "name": "target",
2617
+ "type": {
2618
+ "text": "\"_blank\" | \"_parent\" | \"_self\" | \"_top\""
2619
+ },
2620
+ "default": "\"_self\"",
2621
+ "description": "Where to display the linked URL, as the name for a browsing context. Forwards to the HTMLAnchor target attribute",
2622
+ "fieldName": "target",
2623
+ "inheritedFrom": {
2624
+ "name": "ButtonElement",
2625
+ "module": "src/base/button-element.ts"
2626
+ }
2627
+ },
2628
+ {
2629
+ "name": "download",
2630
+ "type": {
2631
+ "text": "string"
2632
+ },
2633
+ "description": "Tells the browser to download the linked file as this filename. Only used when `href` is set.",
2634
+ "fieldName": "download",
2635
+ "inheritedFrom": {
2636
+ "name": "ButtonElement",
2637
+ "module": "src/base/button-element.ts"
2638
+ }
2639
+ },
2640
+ {
2641
+ "name": "ariaLabel",
2642
+ "type": {
2643
+ "text": "string"
2644
+ },
2645
+ "description": "The aria-label attribute to passed to button element when necessary",
2646
+ "fieldName": "ariaLabel",
2647
+ "inheritedFrom": {
2648
+ "name": "ButtonElement",
2649
+ "module": "src/base/button-element.ts"
2650
+ }
2651
+ },
2652
+ {
2653
+ "name": "loading",
2657
2654
  "type": {
2658
2655
  "text": "boolean"
2659
2656
  },
2660
- "default": "false",
2661
- "description": "Manually enable full width",
2662
- "fieldName": "fullWidth"
2657
+ "description": "When true, shows a loading spinner",
2658
+ "fieldName": "loading",
2659
+ "inheritedFrom": {
2660
+ "name": "ButtonElement",
2661
+ "module": "src/base/button-element.ts"
2662
+ }
2663
2663
  }
2664
2664
  ],
2665
2665
  "superclass": {
2666
- "name": "SgdsElement",
2667
- "module": "/src/base/sgds-element"
2666
+ "name": "ButtonElement",
2667
+ "module": "/src/base/button-element"
2668
2668
  },
2669
- "summary": "Badges can be used to highlight important bits of information such as labels, notifications & status.\nWhen the text exceeds the width, it will be truncated with a tooltip that will be displayed on hover.",
2670
- "tagName": "sgds-badge",
2669
+ "summary": "Custom button styles for actions in forms, dialogs, and more with support for multiple sizes, states, and more.",
2670
+ "tagName": "sgds-button",
2671
2671
  "customElement": true,
2672
- "modulePath": "src/components/Badge/sgds-badge.ts",
2672
+ "modulePath": "src/components/Button/sgds-button.ts",
2673
2673
  "cssProperties": [],
2674
2674
  "cssParts": [],
2675
2675
  "cssStates": []
@@ -2678,18 +2678,18 @@
2678
2678
  "exports": [
2679
2679
  {
2680
2680
  "kind": "js",
2681
- "name": "SgdsBadge",
2681
+ "name": "SgdsButton",
2682
2682
  "declaration": {
2683
- "name": "SgdsBadge",
2684
- "module": "src/components/Badge/sgds-badge.ts"
2683
+ "name": "SgdsButton",
2684
+ "module": "src/components/Button/sgds-button.ts"
2685
2685
  }
2686
2686
  },
2687
2687
  {
2688
2688
  "kind": "js",
2689
2689
  "name": "default",
2690
2690
  "declaration": {
2691
- "name": "SgdsBadge",
2692
- "module": "src/components/Badge/sgds-badge.ts"
2691
+ "name": "SgdsButton",
2692
+ "module": "src/components/Button/sgds-button.ts"
2693
2693
  }
2694
2694
  }
2695
2695
  ]
@@ -19038,6 +19038,13 @@
19038
19038
  "privacy": "private",
19039
19039
  "default": "0"
19040
19040
  },
19041
+ {
19042
+ "kind": "field",
19043
+ "name": "hasSlotController",
19044
+ "privacy": "private",
19045
+ "default": "new HasSlotController(this, \"[default]\")",
19046
+ "type": {}
19047
+ },
19041
19048
  {
19042
19049
  "kind": "method",
19043
19050
  "name": "getComponent",
@@ -26733,7 +26740,7 @@
26733
26740
  "package": {
26734
26741
  "name": "@govtechsg/sgds-web-component",
26735
26742
  "description": "",
26736
- "version": "3.19.0-rc.1",
26743
+ "version": "3.19.0-rc.3",
26737
26744
  "author": "GovTechSG",
26738
26745
  "license": "MIT"
26739
26746
  }