@khanacademy/wonder-blocks-dropdown 10.3.10 → 10.3.12
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.
- package/.turbo/turbo-build$colon$css.log +1 -1
- package/CHANGELOG.md +31 -0
- package/dist/css/vars.css +2 -2
- package/dist/es/index.js +2 -2
- package/dist/index.js +1 -1
- package/package.json +12 -12
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
|
|
2
|
-
> @khanacademy/wonder-blocks-dropdown@10.3.
|
|
2
|
+
> @khanacademy/wonder-blocks-dropdown@10.3.12 build:css /home/runner/work/wonder-blocks/wonder-blocks/packages/wonder-blocks-dropdown
|
|
3
3
|
> pnpm exec wonder-blocks-tokens .
|
|
4
4
|
|
|
5
5
|
CSS variables generated successfully in: /home/runner/work/wonder-blocks/wonder-blocks/packages/wonder-blocks-dropdown/dist/css
|
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,36 @@
|
|
|
1
1
|
# @khanacademy/wonder-blocks-dropdown
|
|
2
2
|
|
|
3
|
+
## 10.3.12
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- f627dca: Updates listbox to use boxShadow tokens
|
|
8
|
+
- 6963849: Updated `core.shadow.transparent` to use the new subcategories (`low`, `mid`, `high`)
|
|
9
|
+
- Updated dependencies [6963849]
|
|
10
|
+
- Updated dependencies [f627dca]
|
|
11
|
+
- Updated dependencies [6963849]
|
|
12
|
+
- Updated dependencies [f627dca]
|
|
13
|
+
- @khanacademy/wonder-blocks-tokens@14.0.0
|
|
14
|
+
- @khanacademy/wonder-blocks-modal@8.4.3
|
|
15
|
+
- @khanacademy/wonder-blocks-cell@5.0.14
|
|
16
|
+
- @khanacademy/wonder-blocks-clickable@7.1.26
|
|
17
|
+
- @khanacademy/wonder-blocks-form@7.3.8
|
|
18
|
+
- @khanacademy/wonder-blocks-icon@5.2.20
|
|
19
|
+
- @khanacademy/wonder-blocks-icon-button@10.5.1
|
|
20
|
+
- @khanacademy/wonder-blocks-pill@3.1.41
|
|
21
|
+
- @khanacademy/wonder-blocks-search-field@5.1.46
|
|
22
|
+
- @khanacademy/wonder-blocks-styles@0.2.32
|
|
23
|
+
- @khanacademy/wonder-blocks-typography@4.2.22
|
|
24
|
+
|
|
25
|
+
## 10.3.11
|
|
26
|
+
|
|
27
|
+
### Patch Changes
|
|
28
|
+
|
|
29
|
+
- Updated dependencies [94351f5]
|
|
30
|
+
- @khanacademy/wonder-blocks-icon-button@10.5.0
|
|
31
|
+
- @khanacademy/wonder-blocks-modal@8.4.2
|
|
32
|
+
- @khanacademy/wonder-blocks-search-field@5.1.45
|
|
33
|
+
|
|
3
34
|
## 10.3.10
|
|
4
35
|
|
|
5
36
|
### Patch Changes
|
package/dist/css/vars.css
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
:root {--wb-c-dropdown-listbox-border-radius: var(--wb-border-radius-radius_040);
|
|
2
2
|
--wb-c-dropdown-listbox-layout-padding-inline: var(--wb-sizing-size_0);
|
|
3
3
|
--wb-c-dropdown-listbox-layout-padding-block: var(--wb-sizing-size_040);
|
|
4
|
-
--wb-c-dropdown-listbox-shadow-default:
|
|
4
|
+
--wb-c-dropdown-listbox-shadow-default: var(--wb-boxShadow-mid);
|
|
5
5
|
--wb-c-dropdown-opener-border-width-error: var(--wb-border-width-thin);
|
|
6
6
|
--wb-c-dropdown-opener-border-radius-rest: var(--wb-border-radius-radius_040);
|
|
7
7
|
--wb-c-dropdown-opener-color-icon: var(--wb-semanticColor-core-foreground-neutral-default);
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
[data-wb-theme='thunderblocks'] {--wb-c-dropdown-listbox-border-radius: var(--wb-border-radius-radius_080);
|
|
19
19
|
--wb-c-dropdown-listbox-layout-padding-inline: var(--wb-sizing-size_080);
|
|
20
20
|
--wb-c-dropdown-listbox-layout-padding-block: var(--wb-sizing-size_080);
|
|
21
|
-
--wb-c-dropdown-listbox-shadow-default:
|
|
21
|
+
--wb-c-dropdown-listbox-shadow-default: var(--wb-boxShadow-low);
|
|
22
22
|
--wb-c-dropdown-opener-border-width-error: var(--wb-border-width-medium);
|
|
23
23
|
--wb-c-dropdown-opener-border-radius-rest: var(--wb-border-radius-radius_080);
|
|
24
24
|
--wb-c-dropdown-opener-color-icon: var(--wb-semanticColor-core-foreground-instructive-default);
|
package/dist/es/index.js
CHANGED
|
@@ -3,7 +3,7 @@ import * as React from 'react';
|
|
|
3
3
|
import { useId } from 'react';
|
|
4
4
|
import { StyleSheet } from 'aphrodite';
|
|
5
5
|
import { DetailCell } from '@khanacademy/wonder-blocks-cell';
|
|
6
|
-
import { sizing, border, semanticColor, font, mapValuesToCssVars } from '@khanacademy/wonder-blocks-tokens';
|
|
6
|
+
import { sizing, border, boxShadow, semanticColor, font, mapValuesToCssVars } from '@khanacademy/wonder-blocks-tokens';
|
|
7
7
|
import { BodyText } from '@khanacademy/wonder-blocks-typography';
|
|
8
8
|
import { focusStyles } from '@khanacademy/wonder-blocks-styles';
|
|
9
9
|
import { View, keys, addStyle, Id, useOnMountEffect } from '@khanacademy/wonder-blocks-core';
|
|
@@ -29,7 +29,7 @@ import Pill from '@khanacademy/wonder-blocks-pill';
|
|
|
29
29
|
|
|
30
30
|
const selectDropdownStyle={marginBlock:sizing.size_080};const filterableDropdownStyle={minHeight:100};const DROPDOWN_ITEM_HEIGHT=40;const MAX_VISIBLE_ITEMS=9;const SEPARATOR_ITEM_HEIGHT=9;const defaultLabels={clearSearch:"Clear search",filter:"Filter",noResults:"No results",selectNoneLabel:"Select none",selectAllLabel:numOptions=>`Select all (${numOptions})`,noneSelected:"0 items",someSelected:numSelectedValues=>numSelectedValues===1?"1 item":`${numSelectedValues} items`,allSelected:"All items"};const defaultComboboxLabels={clearSelection:"Clear selection",closedState:"Combobox is closed",comboboxButton:"Toggle listbox",listbox:"Options list",removeSelected:label=>`Remove ${label}`,liveRegionCurrentItem:({current,index,total,disabled,focused,selected})=>`${current}${focused?" focused":""}${disabled?" disabled":""}${selected?" selected":""}, ${index+1} of ${total}.`,liveRegionMultipleSelectionTotal:total=>`${total} selected options.`,liveRegionListboxTotal:total=>`${total} results available.`,noItems:"No results",selected:labels=>`${labels} selected`,selectionCleared:"Selection cleared",unselected:labels=>`${labels} not selected`};
|
|
31
31
|
|
|
32
|
-
var themeDefault = {listbox:{border:{radius:border.radius.radius_040},layout:{padding:{inline:sizing.size_0,block:sizing.size_040}},shadow:{default
|
|
32
|
+
var themeDefault = {listbox:{border:{radius:border.radius.radius_040},layout:{padding:{inline:sizing.size_0,block:sizing.size_040}},shadow:{default:boxShadow.mid}},opener:{border:{width:{error:border.width.thin},radius:{rest:border.radius.radius_040}},color:{icon:semanticColor.core.foreground.neutral.default},layout:{padding:{inline:sizing.size_160,inlineStart:sizing.size_160,inlineEnd:sizing.size_120}}},item:{border:{radius:{default:border.radius.radius_040,press:border.radius.radius_040}},layout:{padding:{block:sizing.size_100,inlineStart:sizing.size_080,inlineEnd:sizing.size_160}},font:{weight:font.weight.regular}}};
|
|
33
33
|
|
|
34
34
|
var theme$3 = mapValuesToCssVars(themeDefault,"--wb-c-dropdown-");
|
|
35
35
|
|
package/dist/index.js
CHANGED
|
@@ -62,7 +62,7 @@ var Pill__default = /*#__PURE__*/_interopDefaultLegacy(Pill);
|
|
|
62
62
|
|
|
63
63
|
const selectDropdownStyle={marginBlock:wonderBlocksTokens.sizing.size_080};const filterableDropdownStyle={minHeight:100};const DROPDOWN_ITEM_HEIGHT=40;const MAX_VISIBLE_ITEMS=9;const SEPARATOR_ITEM_HEIGHT=9;const defaultLabels={clearSearch:"Clear search",filter:"Filter",noResults:"No results",selectNoneLabel:"Select none",selectAllLabel:numOptions=>`Select all (${numOptions})`,noneSelected:"0 items",someSelected:numSelectedValues=>numSelectedValues===1?"1 item":`${numSelectedValues} items`,allSelected:"All items"};const defaultComboboxLabels={clearSelection:"Clear selection",closedState:"Combobox is closed",comboboxButton:"Toggle listbox",listbox:"Options list",removeSelected:label=>`Remove ${label}`,liveRegionCurrentItem:({current,index,total,disabled,focused,selected})=>`${current}${focused?" focused":""}${disabled?" disabled":""}${selected?" selected":""}, ${index+1} of ${total}.`,liveRegionMultipleSelectionTotal:total=>`${total} selected options.`,liveRegionListboxTotal:total=>`${total} results available.`,noItems:"No results",selected:labels=>`${labels} selected`,selectionCleared:"Selection cleared",unselected:labels=>`${labels} not selected`};
|
|
64
64
|
|
|
65
|
-
var themeDefault = {listbox:{border:{radius:wonderBlocksTokens.border.radius.radius_040},layout:{padding:{inline:wonderBlocksTokens.sizing.size_0,block:wonderBlocksTokens.sizing.size_040}},shadow:{default
|
|
65
|
+
var themeDefault = {listbox:{border:{radius:wonderBlocksTokens.border.radius.radius_040},layout:{padding:{inline:wonderBlocksTokens.sizing.size_0,block:wonderBlocksTokens.sizing.size_040}},shadow:{default:wonderBlocksTokens.boxShadow.mid}},opener:{border:{width:{error:wonderBlocksTokens.border.width.thin},radius:{rest:wonderBlocksTokens.border.radius.radius_040}},color:{icon:wonderBlocksTokens.semanticColor.core.foreground.neutral.default},layout:{padding:{inline:wonderBlocksTokens.sizing.size_160,inlineStart:wonderBlocksTokens.sizing.size_160,inlineEnd:wonderBlocksTokens.sizing.size_120}}},item:{border:{radius:{default:wonderBlocksTokens.border.radius.radius_040,press:wonderBlocksTokens.border.radius.radius_040}},layout:{padding:{block:wonderBlocksTokens.sizing.size_100,inlineStart:wonderBlocksTokens.sizing.size_080,inlineEnd:wonderBlocksTokens.sizing.size_160}},font:{weight:wonderBlocksTokens.font.weight.regular}}};
|
|
66
66
|
|
|
67
67
|
var theme$3 = wonderBlocksTokens.mapValuesToCssVars(themeDefault,"--wb-c-dropdown-");
|
|
68
68
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@khanacademy/wonder-blocks-dropdown",
|
|
3
|
-
"version": "10.3.
|
|
3
|
+
"version": "10.3.12",
|
|
4
4
|
"design": "v1",
|
|
5
5
|
"description": "Dropdown variants for Wonder Blocks.",
|
|
6
6
|
"main": "dist/index.js",
|
|
@@ -21,19 +21,19 @@
|
|
|
21
21
|
},
|
|
22
22
|
"dependencies": {
|
|
23
23
|
"@khanacademy/wonder-blocks-announcer": "1.0.3",
|
|
24
|
-
"@khanacademy/wonder-blocks-cell": "5.0.
|
|
25
|
-
"@khanacademy/wonder-blocks-clickable": "7.1.
|
|
24
|
+
"@khanacademy/wonder-blocks-cell": "5.0.14",
|
|
25
|
+
"@khanacademy/wonder-blocks-clickable": "7.1.26",
|
|
26
26
|
"@khanacademy/wonder-blocks-core": "12.4.0",
|
|
27
|
-
"@khanacademy/wonder-blocks-
|
|
28
|
-
"@khanacademy/wonder-blocks-icon": "5.
|
|
29
|
-
"@khanacademy/wonder-blocks-
|
|
30
|
-
"@khanacademy/wonder-blocks-
|
|
31
|
-
"@khanacademy/wonder-blocks-
|
|
32
|
-
"@khanacademy/wonder-blocks-
|
|
33
|
-
"@khanacademy/wonder-blocks-styles": "0.2.31",
|
|
27
|
+
"@khanacademy/wonder-blocks-icon": "5.2.20",
|
|
28
|
+
"@khanacademy/wonder-blocks-icon-button": "10.5.1",
|
|
29
|
+
"@khanacademy/wonder-blocks-modal": "8.4.3",
|
|
30
|
+
"@khanacademy/wonder-blocks-pill": "3.1.41",
|
|
31
|
+
"@khanacademy/wonder-blocks-search-field": "5.1.46",
|
|
32
|
+
"@khanacademy/wonder-blocks-styles": "0.2.32",
|
|
34
33
|
"@khanacademy/wonder-blocks-timing": "7.0.2",
|
|
35
|
-
"@khanacademy/wonder-blocks-tokens": "
|
|
36
|
-
"@khanacademy/wonder-blocks-typography": "4.2.
|
|
34
|
+
"@khanacademy/wonder-blocks-tokens": "14.0.0",
|
|
35
|
+
"@khanacademy/wonder-blocks-typography": "4.2.22",
|
|
36
|
+
"@khanacademy/wonder-blocks-form": "7.3.8"
|
|
37
37
|
},
|
|
38
38
|
"peerDependencies": {
|
|
39
39
|
"@phosphor-icons/core": "^2.0.2",
|