mirror of
https://github.com/carbon-design-system/carbon-components-svelte.git
synced 2025-09-16 10:51:06 +00:00
Alignment with Carbon version 10.30 (#559)
* feat(toolbar): forward "clear" event in ToolbarSearch
* docs(search): add on:clear example
* fix(ui-shell): set aria-hidden in SideNav
Ref c2b4f1f00
* chore(deps-dev): upgrade carbon-components to v10.30.0
* fix(text-input): use bx--text-input class for TextInputSkeleton
* fix(radio-button): only render span if labelText is truthy
* docs(password-input): add custom tooltip example
* feat(button): add isSelected prop for icon-only, ghost buttons
* feat(radio-button): add legendText prop to RadioButtonGroup
* docs(tag): add filterable (disabled) variant
* feat(tag): add interactive prop
* chore(number-input): deprecate the mobile variant
Mobile variant styles will no longer work.
* feat(button): set aria-pressed attribute if icon-only, ghost button is selected
* fix(multi-select): type dispatched select event
* fix(button): remove redundant "button" role
* feat(icon): deprecate Icon, IconSkeleton
* feat(ui-shell): make SideNavMenuItem text slottable
* fix(list-box): update styles for ListBoxSelection
* fix(list-box): temporarily apply override styles to ListBoxMenuIcon for chevron
* fix(tag): set disabled prop on interactive tag
* docs(button): extract selected, icon-only button example
* feat(tooltip): elevate z-index of tooltip when open
* feat: forward restProps to input element
* fix(types): fix TimePicker test to pass svelte-check
* feat: add ImageLoader component
* test: add ImageLoader
* feat: add LocalStorage component
* test(local-storage): fix invalid file
* chore(docs): use green tag type
This commit is contained in:
parent
08249d6764
commit
1b234ca2e3
68 changed files with 1079 additions and 217 deletions
|
@ -1,5 +1,5 @@
|
|||
{
|
||||
"total": 158,
|
||||
"total": 160,
|
||||
"components": [
|
||||
{
|
||||
"moduleName": "Accordion",
|
||||
|
@ -368,6 +368,16 @@
|
|||
"constant": false,
|
||||
"reactive": false
|
||||
},
|
||||
{
|
||||
"name": "isSelected",
|
||||
"kind": "let",
|
||||
"description": "Set to `true` to enable the selected state for an icon-only, ghost button",
|
||||
"type": "boolean",
|
||||
"value": "false",
|
||||
"isFunction": false,
|
||||
"constant": false,
|
||||
"reactive": false
|
||||
},
|
||||
{
|
||||
"name": "hasIconOnly",
|
||||
"kind": "let",
|
||||
|
@ -1387,7 +1397,7 @@
|
|||
"ts": "interface ComboBoxItem { id: string; text: string; }"
|
||||
}
|
||||
],
|
||||
"rest_props": { "type": "Element", "name": "div" }
|
||||
"rest_props": { "type": "Element", "name": "input" }
|
||||
},
|
||||
{
|
||||
"moduleName": "ComposedModal",
|
||||
|
@ -2239,7 +2249,7 @@
|
|||
{ "type": "forwarded", "name": "blur", "element": "input" }
|
||||
],
|
||||
"typedefs": [],
|
||||
"rest_props": { "type": "Element", "name": "div" }
|
||||
"rest_props": { "type": "Element", "name": "input" }
|
||||
},
|
||||
{
|
||||
"moduleName": "DatePickerSkeleton",
|
||||
|
@ -4042,6 +4052,101 @@
|
|||
"typedefs": [],
|
||||
"rest_props": { "type": "Element", "name": "div" }
|
||||
},
|
||||
{
|
||||
"moduleName": "ImageLoader",
|
||||
"filePath": "src/ImageLoader/ImageLoader.svelte",
|
||||
"props": [
|
||||
{
|
||||
"name": "src",
|
||||
"kind": "let",
|
||||
"description": "Specify the image source",
|
||||
"type": "string",
|
||||
"value": "\"\"",
|
||||
"isFunction": false,
|
||||
"constant": false,
|
||||
"reactive": false
|
||||
},
|
||||
{
|
||||
"name": "alt",
|
||||
"kind": "let",
|
||||
"description": "Specify the image alt text",
|
||||
"type": "string",
|
||||
"value": "\"\"",
|
||||
"isFunction": false,
|
||||
"constant": false,
|
||||
"reactive": false
|
||||
},
|
||||
{
|
||||
"name": "ratio",
|
||||
"kind": "let",
|
||||
"description": "Specify the aspect ratio for the image wrapper",
|
||||
"type": "\"2x1\" | \"16x9\" | \"4x3\" | \"1x1\" | \"3x4\" | \"9x16\" | \"1x2\"",
|
||||
"isFunction": false,
|
||||
"constant": false,
|
||||
"reactive": false
|
||||
},
|
||||
{
|
||||
"name": "loading",
|
||||
"kind": "let",
|
||||
"description": "Set to `true` when `loaded` is `true` and `error` is false",
|
||||
"type": "boolean",
|
||||
"value": "false",
|
||||
"isFunction": false,
|
||||
"constant": false,
|
||||
"reactive": true
|
||||
},
|
||||
{
|
||||
"name": "loaded",
|
||||
"kind": "let",
|
||||
"description": "Set to `true` when the image is loaded",
|
||||
"type": "boolean",
|
||||
"value": "false",
|
||||
"isFunction": false,
|
||||
"constant": false,
|
||||
"reactive": true
|
||||
},
|
||||
{
|
||||
"name": "error",
|
||||
"kind": "let",
|
||||
"description": "Set to `true` if an error occurs when loading the image",
|
||||
"type": "boolean",
|
||||
"value": "false",
|
||||
"isFunction": false,
|
||||
"constant": false,
|
||||
"reactive": true
|
||||
},
|
||||
{
|
||||
"name": "fadeIn",
|
||||
"kind": "let",
|
||||
"description": "Set to `true` to fade in the image on load\nThe duration uses the `fast-02` value following Carbon guidelines on motion",
|
||||
"type": "boolean",
|
||||
"value": "false",
|
||||
"isFunction": false,
|
||||
"constant": false,
|
||||
"reactive": false
|
||||
},
|
||||
{
|
||||
"name": "loadImage",
|
||||
"kind": "const",
|
||||
"description": "Method invoked to load the image provided a `src` value",
|
||||
"type": "(url?: string) => void",
|
||||
"value": "(url) => { if (image != null) image = null; loaded = false; error = false; image = new Image(); image.src = url || src; image.onload = () => (loaded = true); image.onerror = () => (error = true); }",
|
||||
"isFunction": true,
|
||||
"constant": true,
|
||||
"reactive": false
|
||||
}
|
||||
],
|
||||
"slots": [
|
||||
{ "name": "error", "default": false, "slot_props": "{}" },
|
||||
{ "name": "loading", "default": false, "slot_props": "{}" }
|
||||
],
|
||||
"events": [
|
||||
{ "type": "dispatched", "name": "load", "detail": "any" },
|
||||
{ "type": "dispatched", "name": "error", "detail": "any" }
|
||||
],
|
||||
"typedefs": [],
|
||||
"rest_props": { "type": "Element", "name": "img" }
|
||||
},
|
||||
{
|
||||
"moduleName": "InlineLoading",
|
||||
"filePath": "src/InlineLoading/InlineLoading.svelte",
|
||||
|
@ -4585,7 +4690,7 @@
|
|||
"name": "selectionCount",
|
||||
"kind": "let",
|
||||
"description": "Specify the number of selected items",
|
||||
"type": "any",
|
||||
"type": "number",
|
||||
"isFunction": false,
|
||||
"constant": false,
|
||||
"reactive": false
|
||||
|
@ -4716,6 +4821,42 @@
|
|||
"typedefs": [],
|
||||
"rest_props": { "type": "Element", "name": "div" }
|
||||
},
|
||||
{
|
||||
"moduleName": "LocalStorage",
|
||||
"filePath": "src/LocalStorage/LocalStorage.svelte",
|
||||
"props": [
|
||||
{
|
||||
"name": "key",
|
||||
"kind": "let",
|
||||
"description": "Specify the local storage key",
|
||||
"type": "string",
|
||||
"value": "\"local-storage-key\"",
|
||||
"isFunction": false,
|
||||
"constant": false,
|
||||
"reactive": false
|
||||
},
|
||||
{
|
||||
"name": "value",
|
||||
"kind": "let",
|
||||
"description": "Provide a value to persist",
|
||||
"type": "any",
|
||||
"value": "\"\"",
|
||||
"isFunction": false,
|
||||
"constant": false,
|
||||
"reactive": true
|
||||
}
|
||||
],
|
||||
"slots": [],
|
||||
"events": [
|
||||
{ "type": "dispatched", "name": "save", "detail": "any" },
|
||||
{
|
||||
"type": "dispatched",
|
||||
"name": "update",
|
||||
"detail": "{ prevValue: any; value: any; }"
|
||||
}
|
||||
],
|
||||
"typedefs": []
|
||||
},
|
||||
{
|
||||
"moduleName": "Modal",
|
||||
"filePath": "src/Modal/Modal.svelte",
|
||||
|
@ -5393,11 +5534,15 @@
|
|||
],
|
||||
"slots": [],
|
||||
"events": [
|
||||
{
|
||||
"type": "dispatched",
|
||||
"name": "select",
|
||||
"detail": "{ selectedIds: string[]; selected: MultiSelectItem[]; unselected: MultiSelectItem[]; }"
|
||||
},
|
||||
{ "type": "forwarded", "name": "clear", "element": "ListBoxSelection" },
|
||||
{ "type": "forwarded", "name": "keydown", "element": "input" },
|
||||
{ "type": "forwarded", "name": "focus", "element": "input" },
|
||||
{ "type": "forwarded", "name": "blur", "element": "input" },
|
||||
{ "type": "dispatched", "name": "select" }
|
||||
{ "type": "forwarded", "name": "blur", "element": "input" }
|
||||
],
|
||||
"typedefs": [
|
||||
{
|
||||
|
@ -5416,7 +5561,7 @@
|
|||
"ts": "interface MultiSelectItem { id: MultiSelectItemId; text: MultiSelectItemText; }"
|
||||
}
|
||||
],
|
||||
"rest_props": { "type": "Element", "name": "div" }
|
||||
"rest_props": { "type": "Element", "name": "input" }
|
||||
},
|
||||
{
|
||||
"moduleName": "NotificationActionButton",
|
||||
|
@ -5827,7 +5972,7 @@
|
|||
"ts": "type NumberInputTranslationId = \"increment\" | \"decrement\""
|
||||
}
|
||||
],
|
||||
"rest_props": { "type": "Element", "name": "div" }
|
||||
"rest_props": { "type": "Element", "name": "input" }
|
||||
},
|
||||
{
|
||||
"moduleName": "NumberInputSkeleton",
|
||||
|
@ -6950,6 +7095,16 @@
|
|||
"constant": false,
|
||||
"reactive": false
|
||||
},
|
||||
{
|
||||
"name": "legendText",
|
||||
"kind": "let",
|
||||
"description": "Specify the legend text",
|
||||
"type": "string",
|
||||
"value": "\"\"",
|
||||
"isFunction": false,
|
||||
"constant": false,
|
||||
"reactive": false
|
||||
},
|
||||
{
|
||||
"name": "labelPosition",
|
||||
"kind": "let",
|
||||
|
@ -6980,7 +7135,15 @@
|
|||
"reactive": false
|
||||
}
|
||||
],
|
||||
"slots": [{ "name": "__default__", "default": true, "slot_props": "{}" }],
|
||||
"slots": [
|
||||
{ "name": "__default__", "default": true, "slot_props": "{}" },
|
||||
{
|
||||
"name": "legendText",
|
||||
"default": false,
|
||||
"fallback": "{legendText}",
|
||||
"slot_props": "{}"
|
||||
}
|
||||
],
|
||||
"events": [
|
||||
{ "type": "forwarded", "name": "click", "element": "div" },
|
||||
{ "type": "forwarded", "name": "mouseover", "element": "div" },
|
||||
|
@ -7947,7 +8110,14 @@
|
|||
"reactive": true
|
||||
}
|
||||
],
|
||||
"slots": [],
|
||||
"slots": [
|
||||
{
|
||||
"name": "__default__",
|
||||
"default": true,
|
||||
"fallback": "{text}",
|
||||
"slot_props": "{}"
|
||||
}
|
||||
],
|
||||
"events": [{ "type": "forwarded", "name": "click", "element": "a" }],
|
||||
"typedefs": [],
|
||||
"rest_props": { "type": "Element", "name": "a" }
|
||||
|
@ -9032,6 +9202,16 @@
|
|||
"constant": false,
|
||||
"reactive": false
|
||||
},
|
||||
{
|
||||
"name": "interactive",
|
||||
"kind": "let",
|
||||
"description": "Set to `true` to render a `button` element instead of a `div`",
|
||||
"type": "boolean",
|
||||
"value": "false",
|
||||
"isFunction": false,
|
||||
"constant": false,
|
||||
"reactive": false
|
||||
},
|
||||
{
|
||||
"name": "skeleton",
|
||||
"kind": "let",
|
||||
|
@ -9748,7 +9928,7 @@
|
|||
{ "type": "forwarded", "name": "blur", "element": "input" }
|
||||
],
|
||||
"typedefs": [],
|
||||
"rest_props": { "type": "Element", "name": "div" }
|
||||
"rest_props": { "type": "Element", "name": "input" }
|
||||
},
|
||||
{
|
||||
"moduleName": "TimePickerSelect",
|
||||
|
@ -10372,6 +10552,7 @@
|
|||
],
|
||||
"slots": [],
|
||||
"events": [
|
||||
{ "type": "forwarded", "name": "clear", "element": "Search" },
|
||||
{ "type": "forwarded", "name": "change", "element": "Search" },
|
||||
{ "type": "forwarded", "name": "input", "element": "Search" },
|
||||
{ "type": "forwarded", "name": "focus", "element": "Search" },
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue