mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-21 04:39:19 +00:00
Code Issues Projects Releases Packages Wiki Activity

feat: add WebStorage to address localStorage or sessionStorage

Browse source 
feat: make LocalStorage use WebStorage
feat: add SessionStorage using WebStorage
feat: make key in WebStorage reactive
feat: add updateKey event in case key changed
This commit is contained in:
Manuel Coenen 2022-03-24 09:53:23 +01:00
commit c54a8b5178
17 changed files with 574 additions and 68 deletions
Download patch file Download diff file Expand all files Collapse all files

72
COMPONENT_INDEX.md
View file

@ -1,6 +1,6 @@
# Component Index
> 171 components exported from carbon-components-svelte@0.62.2.
> 173 components exported from carbon-components-svelte@0.62.2.
## Components
@ -116,6 +116,7 @@
- [`SelectItemGroup`](#selectitemgroup)
- [`SelectSkeleton`](#selectskeleton)
- [`SelectableTile`](#selectabletile)
- [`SessionStorage`](#sessionstorage)
- [`SideNav`](#sidenav)
- [`SideNavDivider`](#sidenavdivider)
- [`SideNavItems`](#sidenavitems)
@ -175,6 +176,7 @@
- [`TreeView`](#treeview)
- [`Truncate`](#truncate)
- [`UnorderedList`](#unorderedlist)
- [`WebStorage`](#webstorage)
---
@ -2240,12 +2242,12 @@ None.
### Props
| Prop name | Kind | Reactive | Type | Default value | Description |
| :-------- | :-------------------- | :------- | :---------------------- | ---------------------------------------------------- | --------------------------------------------------------------- |
| value | <code>let</code> | Yes | <code>any</code> | <code>""</code> | Provide a value to persist |
| key | <code>let</code> | No | <code>string</code> | <code>"local-storage-key"</code> | Specify the local storage key |
| clearItem | <code>function</code> | No | <code>() => void</code> | <code>() => { localStorage.removeItem(key); }</code> | Remove the persisted key value from the browser's local storage |
| clearAll | <code>function</code> | No | <code>() => void</code> | <code>() => { localStorage.clear(); }</code> | Clear all key values from the browser's local storage |
| Prop name | Kind | Reactive | Type | Default value | Description |
| :-------- | :-------------------- | :------- | :---------------------- | ----------------------------------------------- | --------------------------------------------------------------- |
| value | <code>let</code> | Yes | <code>any</code> | <code>""</code> | Provide a value to persist |
| key | <code>let</code> | Yes | <code>string</code> | <code>"local-storage-key"</code> | Specify the local storage key |
| clearItem | <code>function</code> | No | <code>() => void</code> | <code>() => { storage.removeItem(key); }</code> | Remove the persisted key value from the browser's local storage |
| clearAll | <code>function</code> | No | <code>() => void</code> | <code>() => { storage.clear(); }</code> | Clear all key values from the browser's local storage |
### Slots
@ -2253,10 +2255,11 @@ None.
### Events
| Event name | Type | Detail |
| :--------- | :--------- | :------------------------------------------- |
| save | dispatched | <code>null</code> |
| update | dispatched | <code>{ prevValue: any; value: any; }</code> |
| Event name | Type | Detail |
| :--------- | :-------- | :----- |
| save | forwarded | -- |
| update | forwarded | -- |
| updateKey | forwarded | -- |
## `Modal`
@ -3348,6 +3351,29 @@ None.
| mouseleave | forwarded | -- |
| keydown | forwarded | -- |
## `SessionStorage`
### Props
| Prop name | Kind | Reactive | Type | Default value | Description |
| :-------- | :-------------------- | :------- | :---------------------- | ----------------------------------------------- | --------------------------------------------------------------- |
| value | <code>let</code> | Yes | <code>any</code> | <code>""</code> | Provide a value to persist |
| key | <code>let</code> | Yes | <code>string</code> | <code>"session-storage-key"</code> | Specify the local storage key |
| clearItem | <code>function</code> | No | <code>() => void</code> | <code>() => { storage.removeItem(key); }</code> | Remove the persisted key value from the browser's local storage |
| clearAll | <code>function</code> | No | <code>() => void</code> | <code>() => { storage.clear(); }</code> | Clear all key values from the browser's local storage |
### Slots
None.
### Events
| Event name | Type | Detail |
| :--------- | :-------- | :----- |
| save | forwarded | -- |
| update | forwarded | -- |
| updateKey | forwarded | -- |
## `SideNav`
### Props
@ -4847,3 +4873,27 @@ None.
| mouseover | forwarded | -- |
| mouseenter | forwarded | -- |
| mouseleave | forwarded | -- |
## `WebStorage`
### Props
| Prop name | Kind | Reactive | Type | Default value | Description |
| :-------- | :-------------------- | :------- | :---------------------------------- | -------------------------------------------------- | --------------------------------------------------------------------- |
| value | <code>let</code> | Yes | <code>any</code> | <code>""</code> | Provide a value to persist |
| key | <code>let</code> | No | <code>string</code> | <code>"storage-key"</code> | Specify the local storage key |
| storage | <code>let</code> | No | <code>"local"&#124;"session"</code> | <code>"local"</code> | Select WebStorage to use |
| clearItem | <code>function</code> | No | <code>() => void</code> | <code>() => { webStorage.removeItem(key); }</code> | Remove the persisted key value from the browser's selected WebStorage |
| clearAll | <code>function</code> | No | <code>() => void</code> | <code>() => { webStorage.clear(); }</code> | Clear all key values from the browser's selected WebStorage |
### Slots
None.
### Events
| Event name | Type | Detail |
| :--------- | :--------- | :------------------------------------------- |
| save | dispatched | <code>null</code> |
| updateKey | dispatched | <code>{ prevKey: any; key: any; }</code> |
| update | dispatched | <code>{ prevValue: any; value: any; }</code> |