mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-20 12:23:02 +00:00
Code Issues Projects Releases Packages Wiki Activity

Merge branch 'master' into file-uploader-button

Browse source
This commit is contained in:
metonym 2022-02-21 10:31:01 -08:00 • committed by GitHub
commit 85477a7a1e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
25 changed files with 142 additions and 105 deletions
Download patch file Download diff file Expand all files Collapse all files

15
CHANGELOG.md
View file

@ -7,6 +7,21 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
<!-- ## Unreleased -->
## [0.58.4](https://github.com/carbon-design-system/carbon-components-svelte/releases/tag/v0.58.4) - 2022-02-21
**Fixes**
- dispatched events without a `detail` type should be `null` instead of `any`
- `FileUploader` `clearFiles` description should reflect that it's an accessor, not a prop
- `FileUploader` should correctly fire `add` and `remove` events
- `FileUploader` files should not be keyed by file name
- `FileUploader` change event detail signature should be `File[]`
- fix `DataTable` regression where sort icon indicators don't update
**Refactor**
- remove unnecessary JSDoc default type notation
## [0.58.3](https://github.com/carbon-design-system/carbon-components-svelte/releases/tag/v0.58.3) - 2022-02-20
**Fixes**

44
COMPONENT_INDEX.md
View file

@ -1,6 +1,6 @@
# Component Index
> 172 components exported from carbon-components-svelte@0.58.3.
> 172 components exported from carbon-components-svelte@0.58.4.
## Components
@ -1864,9 +1864,9 @@ export interface HeaderSearchResult {
| Event name | Type | Detail |
| :--------- | :--------- | :---------------------------------------------------------------------------------------------- |
| active | dispatched | <code>any</code> |
| inactive | dispatched | <code>any</code> |
| clear | dispatched | <code>any</code> |
| active | dispatched | <code>null</code> |
| inactive | dispatched | <code>null</code> |
| clear | dispatched | <code>null</code> |
| select | dispatched | <code>{ value: string; selectedResultIndex: number; selectedResult: HeaderSearchResult }</code> |
| change | forwarded | -- |
| input | forwarded | -- |
@ -1958,9 +1958,9 @@ None.
### Events
| Event name | Type | Detail |
| :--------- | :--------- | :--------------- |
| load | dispatched | <code>any</code> |
| error | dispatched | <code>any</code> |
| :--------- | :--------- | :---------------- |
| load | dispatched | <code>null</code> |
| error | dispatched | <code>null</code> |
## `InlineLoading`
@ -2275,7 +2275,7 @@ None.
| Event name | Type | Detail |
| :--------- | :--------- | :------------------------------------------- |
| save | dispatched | <code>any</code> |
| save | dispatched | <code>null</code> |
| update | dispatched | <code>{ prevValue: any; value: any; }</code> |
## `Modal`
@ -2465,7 +2465,7 @@ None.
| :--------- | :--------- | :------------------------------------------------------------------------------------------------------------- |
| blur | dispatched | <code>FocusEvent &#124; CustomEvent<FocusEvent></code> |
| select | dispatched | <code>{ selectedIds: MultiSelectItemId[]; selected: MultiSelectItem[]; unselected: MultiSelectItem[]; }</code> |
| clear | dispatched | <code>any</code> |
| clear | dispatched | <code>null</code> |
| keydown | forwarded | -- |
| keyup | forwarded | -- |
| focus | forwarded | -- |
@ -3195,9 +3195,9 @@ None.
### Events
| Event name | Type | Detail |
| :--------- | :--------- | :--------------- |
| expand | dispatched | <code>any</code> |
| collapse | dispatched | <code>any</code> |
| :--------- | :--------- | :---------------- |
| expand | dispatched | <code>null</code> |
| collapse | dispatched | <code>null</code> |
| click | forwarded | -- |
| mouseover | forwarded | -- |
| mouseenter | forwarded | -- |
@ -3385,10 +3385,10 @@ None.
### Events
| Event name | Type | Detail |
| :------------ | :--------- | :--------------- |
| open | dispatched | <code>any</code> |
| close | dispatched | <code>any</code> |
| click:overlay | dispatched | <code>any</code> |
| :------------ | :--------- | :---------------- |
| open | dispatched | <code>null</code> |
| close | dispatched | <code>null</code> |
| click:overlay | dispatched | <code>null</code> |
## `SideNavDivider`
@ -4681,9 +4681,9 @@ None.
### Events
| Event name | Type | Detail |
| :--------- | :--------- | :--------------- |
| open | dispatched | <code>any</code> |
| close | dispatched | <code>any</code> |
| :--------- | :--------- | :---------------- |
| open | dispatched | <code>null</code> |
| close | dispatched | <code>null</code> |
| click | forwarded | -- |
| mousedown | forwarded | -- |
@ -4710,9 +4710,9 @@ None.
### Events
| Event name | Type | Detail |
| :--------- | :--------- | :--------------- |
| open | dispatched | <code>any</code> |
| close | dispatched | <code>any</code> |
| :--------- | :--------- | :---------------- |
| open | dispatched | <code>null</code> |
| close | dispatched | <code>null</code> |
| click | forwarded | -- |
| mouseover | forwarded | -- |
| mouseenter | forwarded | -- |

34
docs/src/COMPONENT_API.json
View file

@ -3503,7 +3503,7 @@
{
"name": "clearFiles",
"kind": "const",
"description": "Override the default behavior of clearing the array of uploaded files",
"description": "Programmatically clear the uploaded files",
"type": "() => void",
"value": "() => { files = []; }",
"isFunction": true,
@ -4926,9 +4926,9 @@
}
],
"events": [
{ "type": "dispatched", "name": "active", "detail": "any" },
{ "type": "dispatched", "name": "inactive", "detail": "any" },
{ "type": "dispatched", "name": "clear", "detail": "any" },
{ "type": "dispatched", "name": "active", "detail": "null" },
{ "type": "dispatched", "name": "inactive", "detail": "null" },
{ "type": "dispatched", "name": "clear", "detail": "null" },
{
"type": "dispatched",
"name": "select",
@ -5126,8 +5126,8 @@
{ "name": "loading", "default": false, "slot_props": "{}" }
],
"events": [
{ "type": "dispatched", "name": "load", "detail": "any" },
{ "type": "dispatched", "name": "error", "detail": "any" }
{ "type": "dispatched", "name": "load", "detail": "null" },
{ "type": "dispatched", "name": "error", "detail": "null" }
],
"typedefs": [],
"rest_props": { "type": "Element", "name": "img" }
@ -5931,7 +5931,7 @@
],
"slots": [],
"events": [
{ "type": "dispatched", "name": "save", "detail": "any" },
{ "type": "dispatched", "name": "save", "detail": "null" },
{
"type": "dispatched",
"name": "update",
@ -6807,7 +6807,7 @@
"name": "select",
"detail": "{ selectedIds: MultiSelectItemId[]; selected: MultiSelectItem[]; unselected: MultiSelectItem[]; }"
},
{ "type": "dispatched", "name": "clear", "detail": "any" },
{ "type": "dispatched", "name": "clear", "detail": "null" },
{ "type": "forwarded", "name": "keydown", "element": "input" },
{ "type": "forwarded", "name": "keyup", "element": "input" },
{ "type": "forwarded", "name": "focus", "element": "input" }
@ -9272,8 +9272,8 @@
}
],
"events": [
{ "type": "dispatched", "name": "expand", "detail": "any" },
{ "type": "dispatched", "name": "collapse", "detail": "any" },
{ "type": "dispatched", "name": "expand", "detail": "null" },
{ "type": "dispatched", "name": "collapse", "detail": "null" },
{ "type": "forwarded", "name": "click", "element": "SearchSkeleton" },
{
"type": "forwarded",
@ -9842,9 +9842,9 @@
],
"slots": [{ "name": "__default__", "default": true, "slot_props": "{}" }],
"events": [
{ "type": "dispatched", "name": "open", "detail": "any" },
{ "type": "dispatched", "name": "close", "detail": "any" },
{ "type": "dispatched", "name": "click:overlay", "detail": "any" }
{ "type": "dispatched", "name": "open", "detail": "null" },
{ "type": "dispatched", "name": "close", "detail": "null" },
{ "type": "dispatched", "name": "click:overlay", "detail": "null" }
],
"typedefs": [],
"rest_props": { "type": "Element", "name": "nav" }
@ -13115,8 +13115,8 @@
}
],
"events": [
{ "type": "dispatched", "name": "open", "detail": "any" },
{ "type": "dispatched", "name": "close", "detail": "any" },
{ "type": "dispatched", "name": "open", "detail": "null" },
{ "type": "dispatched", "name": "close", "detail": "null" },
{ "type": "forwarded", "name": "click", "element": "div" },
{ "type": "forwarded", "name": "mousedown", "element": "div" }
],
@ -13204,8 +13204,8 @@
}
],
"events": [
{ "type": "dispatched", "name": "open", "detail": "any" },
{ "type": "dispatched", "name": "close", "detail": "any" },
{ "type": "dispatched", "name": "open", "detail": "null" },
{ "type": "dispatched", "name": "close", "detail": "null" },
{ "type": "forwarded", "name": "click", "element": "button" },
{ "type": "forwarded", "name": "mouseover", "element": "button" },
{ "type": "forwarded", "name": "mouseenter", "element": "button" },

2
package.json
View file

@ -1,6 +1,6 @@
{
"name": "carbon-components-svelte",
"version": "0.58.3",
"version": "0.58.4",
"license": "Apache-2.0",
"description": "Svelte implementation of the Carbon Design System",
"svelte": "./src/index.js",

2
preprocess/api.json
View file

@ -1,5 +1,5 @@
{
"version": "0.58.3",
"version": "0.58.4",
"components": {
"Accordion": {
"path": "carbon-components-svelte/src/Accordion/Accordion.svelte"

25
src/FileUploader/FileUploader.svelte
View file

@ -27,7 +27,7 @@
export let multiple = false;
/**
* Override the default behavior of clearing the array of uploaded files
* Programmatically clear the uploaded files
* @type {() => void}
*/
export const clearFiles = () => {
@ -61,15 +61,28 @@
const dispatch = createEventDispatcher();
$: prevFiles = [];
let prevFiles = [];
/** @type {(file: File) => string} */
const getFileId = (file) => file.lastModified + file.name;
afterUpdate(() => {
if (files.length > prevFiles.length) {
dispatch("add", files);
} else {
const fileIds = files.map(getFileId);
const prevFileIds = prevFiles.map(getFileId);
const addedIds = fileIds.filter((_) => !prevFileIds.includes(_));
const removedIds = prevFileIds.filter((_) => !fileIds.includes(_));
if (addedIds.length > 0) {
dispatch(
"add",
addedIds.map((id) => files.find((file) => id === getFileId(file)))
);
}
if (removedIds.length > 0) {
dispatch(
"remove",
prevFiles.filter((_) => !files.includes(_))
removedIds.map((id) => prevFiles.find((file) => id === getFileId(file)))
);
}

4
src/ImageLoader/ImageLoader.svelte
View file

@ -1,7 +1,7 @@
<script>
/**
* @event {any} load
* @event {any} error
* @event {null} load
* @event {null} error
*/
/**

2
src/LocalStorage/LocalStorage.svelte
View file

@ -1,6 +1,6 @@
<script>
/**
* @event {any} save
* @event {null} save
* @event {{ prevValue: any; value: any; }} update
*/

2
src/MultiSelect/MultiSelect.svelte
View file

@ -8,7 +8,7 @@
* @typedef {string} MultiSelectItemText
* @typedef {{ id: MultiSelectItemId; text: MultiSelectItemText; }} MultiSelectItem
* @event {{ selectedIds: MultiSelectItemId[]; selected: MultiSelectItem[]; unselected: MultiSelectItem[]; }} select
* @event {any} clear
* @event {null} clear
*/
/**

6
src/Search/Search.svelte
View file

@ -1,7 +1,7 @@
<script>
/**
* @event {any} expand
* @event {any} collapse
* @event {null} expand
* @event {null} collapse
*/
/**
@ -12,7 +12,7 @@
/**
* Specify the size of the search input
* @type {"sm" | "lg" | "xl"} [size="xl"]
* @type {"sm" | "lg" | "xl"}
*/
export let size = "xl";

4
src/Tooltip/Tooltip.svelte
View file

@ -1,7 +1,7 @@
<script>
/**
* @event {any} open
* @event {any} close
* @event {null} open
* @event {null} close
*/
/**

4
src/TooltipDefinition/TooltipDefinition.svelte
View file

@ -1,7 +1,7 @@
<script>
/**
* @event {any} open
* @event {any} close
* @event {null} open
* @event {null} close
*/
/** Specify the tooltip text */

6
src/UIShell/HeaderSearch.svelte
View file

@ -1,9 +1,9 @@
<script>
/**
* @typedef {{ href: string; text: string; description?: string; }} HeaderSearchResult
* @event {any} active
* @event {any} inactive
* @event {any} clear
* @event {null} active
* @event {null} inactive
* @event {null} clear
* @event {{ value: string; selectedResultIndex: number; selectedResult: HeaderSearchResult }} select
* @slot {{ result: HeaderSearchResult; index: number }}
*/

6
src/UIShell/SideNav/SideNav.svelte
View file

@ -1,8 +1,8 @@
<script>
/**
* @event {any} open
* @event {any} close
* @event {any} click:overlay
* @event {null} open
* @event {null} close
* @event {null} click:overlay
*/
/** Set to `true` to use the fixed variant */

5
tests/FileUploader.test.svelte
View file

@ -6,6 +6,10 @@
FileUploaderItem,
FileUploaderSkeleton,
} from "../types";
let fileUploader: FileUploader;
$: fileUploader?.clearFiles();
</script>
<FileUploaderButton
@ -16,6 +20,7 @@
/>
<FileUploader
bind:this="{fileUploader}"
multiple
labelTitle="Upload files"
buttonLabel="Add files"

8
tests/ImageLoader.test.svelte
View file

@ -13,6 +13,10 @@
fadeIn
ratio="16x9"
src=""
on:load="{() => {}}"
on:error="{() => {}}"
on:load="{(e) => {
console.log(e.detail); // null
}}"
on:error="{(e) => {
console.log(e.detail); // null
}}"
/>

2
types/FileUploader/FileUploader.svelte.d.ts vendored
View file

@ -79,7 +79,7 @@ export default class FileUploader extends SvelteComponentTyped<
{}
> {
/**
* Override the default behavior of clearing the array of uploaded files
* Programmatically clear the uploaded files
*/
clearFiles: () => void;
}

2
types/ImageLoader/ImageLoader.svelte.d.ts vendored
View file

@ -49,7 +49,7 @@ export interface ImageLoaderProps
export default class ImageLoader extends SvelteComponentTyped<
ImageLoaderProps,
{ load: CustomEvent<any>; error: CustomEvent<any> },
{ load: CustomEvent<null>; error: CustomEvent<null> },
{ error: {}; loading: {} }
> {
/**

2
types/LocalStorage/LocalStorage.svelte.d.ts vendored
View file

@ -18,7 +18,7 @@ export interface LocalStorageProps {
export default class LocalStorage extends SvelteComponentTyped<
LocalStorageProps,
{
save: CustomEvent<any>;
save: CustomEvent<null>;
update: CustomEvent<{ prevValue: any; value: any }>;
},
{}

2
types/MultiSelect/MultiSelect.svelte.d.ts vendored
View file

@ -228,7 +228,7 @@ export default class MultiSelect extends SvelteComponentTyped<
selected: MultiSelectItem[];
unselected: MultiSelectItem[];
}>;
clear: CustomEvent<any>;
clear: CustomEvent<null>;
keydown: WindowEventMap["keydown"];
keyup: WindowEventMap["keyup"];
focus: WindowEventMap["focus"];

4
types/Search/Search.svelte.d.ts vendored
View file

@ -113,8 +113,8 @@ export interface SearchProps {
export default class Search extends SvelteComponentTyped<
SearchProps,
{
expand: CustomEvent<any>;
collapse: CustomEvent<any>;
expand: CustomEvent<null>;
collapse: CustomEvent<null>;
click: WindowEventMap["click"];
mouseover: WindowEventMap["mouseover"];
mouseenter: WindowEventMap["mouseenter"];

4
types/Tooltip/Tooltip.svelte.d.ts vendored
View file

@ -92,8 +92,8 @@ export interface TooltipProps
export default class Tooltip extends SvelteComponentTyped<
TooltipProps,
{
open: CustomEvent<any>;
close: CustomEvent<any>;
open: CustomEvent<null>;
close: CustomEvent<null>;
click: WindowEventMap["click"];
mousedown: WindowEventMap["mousedown"];
},

4
types/TooltipDefinition/TooltipDefinition.svelte.d.ts vendored
View file

@ -43,8 +43,8 @@ export interface TooltipDefinitionProps
export default class TooltipDefinition extends SvelteComponentTyped<
TooltipDefinitionProps,
{
open: CustomEvent<any>;
close: CustomEvent<any>;
open: CustomEvent<null>;
close: CustomEvent<null>;
click: WindowEventMap["click"];
mouseover: WindowEventMap["mouseover"];
mouseenter: WindowEventMap["mouseenter"];

6
types/UIShell/HeaderSearch.svelte.d.ts vendored
View file

@ -43,9 +43,9 @@ export interface HeaderSearchProps
export default class HeaderSearch extends SvelteComponentTyped<
HeaderSearchProps,
{
active: CustomEvent<any>;
inactive: CustomEvent<any>;
clear: CustomEvent<any>;
active: CustomEvent<null>;
inactive: CustomEvent<null>;
clear: CustomEvent<null>;
select: CustomEvent<{
value: string;
selectedResultIndex: number;

6
types/UIShell/SideNav/SideNav.svelte.d.ts vendored
View file

@ -43,9 +43,9 @@ export interface SideNavProps
export default class SideNav extends SvelteComponentTyped<
SideNavProps,
{
open: CustomEvent<any>;
close: CustomEvent<any>;
["click:overlay"]: CustomEvent<any>;
open: CustomEvent<null>;
close: CustomEvent<null>;
["click:overlay"]: CustomEvent<null>;
},
{ default: {} }
> {}