mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-14 18:01:06 +00:00
Code Issues Projects Releases Packages Wiki Activity

breaking: delete Copy component (#1174)

Browse source 
Closes #1156
This commit is contained in:
metonym 2022-03-19 12:26:01 -07:00 • committed by GitHub
commit e4800d9627
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 2 additions and 143 deletions
Download patch file Download diff file Expand all files Collapse all files

26
COMPONENT_INDEX.md
View file

@ -1,6 +1,6 @@
# Component Index
> 172 components exported from carbon-components-svelte@0.61.1.
> 171 components exported from carbon-components-svelte@0.61.1.
## Components
@ -30,7 +30,6 @@
- [`ContextMenuGroup`](#contextmenugroup)
- [`ContextMenuOption`](#contextmenuoption)
- [`ContextMenuRadioGroup`](#contextmenuradiogroup)
- [`Copy`](#copy)
- [`CopyButton`](#copybutton)
- [`DataTable`](#datatable)
- [`DataTableSkeleton`](#datatableskeleton)
@ -895,29 +894,6 @@ None.
None.
## `Copy`
### Props
| Prop name | Kind | Reactive | Type | Default value | Description |
| :-------------- | :--------------- | :------- | :----------------------------------------- | ---------------------- | ------------------------------------------------------ |
| ref | <code>let</code> | Yes | <code>null &#124; HTMLButtonElement</code> | <code>null</code> | Obtain a reference to the button HTML element |
| feedback | <code>let</code> | No | <code>string</code> | <code>"Copied!"</code> | Set the feedback text shown after clicking the button |
| feedbackTimeout | <code>let</code> | No | <code>number</code> | <code>2000</code> | Set the timeout duration (ms) to display feedback text |
### Slots
| Slot name | Default | Props | Fallback |
| :-------- | :------ | :---- | :--------------------------------------------------------------------------------- |
| -- | Yes | -- | <code>{#if animation}{feedback &#124;&#124; $$restProps["aria-label"]}{/if}</code> |
### Events
| Event name | Type | Detail |
| :----------- | :-------- | :----- |
| click | forwarded | -- |
| animationend | forwarded | -- |
## `CopyButton`
### Props

56
docs/src/COMPONENT_API.json
View file

@ -1,5 +1,5 @@
{
"total": 172,
"total": 171,
"components": [
{
"moduleName": "Accordion",
@ -2135,60 +2135,6 @@
"events": [],
"typedefs": []
},
{
"moduleName": "Copy",
"filePath": "src/Copy/Copy.svelte",
"props": [
{
"name": "feedback",
"kind": "let",
"description": "Set the feedback text shown after clicking the button",
"type": "string",
"value": "\"Copied!\"",
"isFunction": false,
"isFunctionDeclaration": false,
"constant": false,
"reactive": false
},
{
"name": "feedbackTimeout",
"kind": "let",
"description": "Set the timeout duration (ms) to display feedback text",
"type": "number",
"value": "2000",
"isFunction": false,
"isFunctionDeclaration": false,
"constant": false,
"reactive": false
},
{
"name": "ref",
"kind": "let",
"description": "Obtain a reference to the button HTML element",
"type": "null | HTMLButtonElement",
"value": "null",
"isFunction": false,
"isFunctionDeclaration": false,
"constant": false,
"reactive": true
}
],
"moduleExports": [],
"slots": [
{
"name": "__default__",
"default": true,
"fallback": "{#if animation}{feedback || $$restProps[\"aria-label\"]}{/if}",
"slot_props": "{}"
}
],
"events": [
{ "type": "forwarded", "name": "click", "element": "button" },
{ "type": "forwarded", "name": "animationend", "element": "button" }
],
"typedefs": [],
"rest_props": { "type": "Element", "name": "button" }
},
{
"moduleName": "CopyButton",
"filePath": "src/CopyButton/CopyButton.svelte",

3
preprocess/api.json
View file

@ -85,9 +85,6 @@
"ContextMenuRadioGroup": {
"path": "carbon-components-svelte/src/ContextMenu/ContextMenuRadioGroup.svelte"
},
"Copy": {
"path": "carbon-components-svelte/src/Copy/Copy.svelte"
},
"CopyButton": {
"path": "carbon-components-svelte/src/CopyButton/CopyButton.svelte"
},

57
src/Copy/Copy.svelte
View file

@ -1,57 +0,0 @@
<script>
/** Set the feedback text shown after clicking the button */
export let feedback = "Copied!";
/** Set the timeout duration (ms) to display feedback text */
export let feedbackTimeout = 2000;
/** Obtain a reference to the button HTML element */
export let ref = null;
import { onMount } from "svelte";
let animation = undefined;
let timeout = undefined;
onMount(() => {
return () => {
clearTimeout(timeout);
};
});
</script>
<button
bind:this="{ref}"
type="button"
aria-live="polite"
class:bx--copy="{true}"
class:bx--copy-btn--animating="{animation}"
aria-label="{animation ? feedback : undefined}"
{...$$restProps}
class="{$$restProps.class} {animation && `bx--copy-btn--${animation}`}"
on:click
on:click="{() => {
if (animation === 'fade-in') return;
animation = 'fade-in';
timeout = setTimeout(() => {
animation = 'fade-out';
}, feedbackTimeout);
}}"
on:animationend
on:animationend="{({ animationName }) => {
if (animationName === 'hide-feedback') {
animation = undefined;
}
}}"
>
<slot>
{#if animation}{feedback || $$restProps["aria-label"]}{/if}
</slot>
<span
aria-hidden="true"
class:bx--assistive-text="{true}"
class:bx--copy-btn__feedback="{true}"
>
{feedback}
</span>
</button>

1
src/Copy/index.js
View file

@ -1 +0,0 @@
export { default as Copy } from "./Copy.svelte";

1
src/index.js
View file

@ -12,7 +12,6 @@ export {
ContextMenuOption,
ContextMenuRadioGroup,
} from "./ContextMenu";
export { Copy } from "./Copy";
export { CopyButton } from "./CopyButton";
export { ComboBox } from "./ComboBox";
export {

1
types/index.d.ts vendored
View file

@ -18,7 +18,6 @@ export { default as ContextMenuDivider } from "./ContextMenu/ContextMenuDivider.
export { default as ContextMenuGroup } from "./ContextMenu/ContextMenuGroup.svelte";
export { default as ContextMenuOption } from "./ContextMenu/ContextMenuOption.svelte";
export { default as ContextMenuRadioGroup } from "./ContextMenu/ContextMenuRadioGroup.svelte";
export { default as Copy } from "./Copy/Copy.svelte";
export { default as CopyButton } from "./CopyButton/CopyButton.svelte";
export { default as ComboBox } from "./ComboBox/ComboBox.svelte";
export { default as ComposedModal } from "./ComposedModal/ComposedModal.svelte";