@atom-learning/components 2.28.3-beta.1 → 2.29.0-1

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.
Files changed (39) hide show
  1. package/dist/components/accordion/AccordionContent.js +1 -1
  2. package/dist/components/accordion/AccordionItem.js +1 -1
  3. package/dist/components/accordion/AccordionTrigger.d.ts +4 -5
  4. package/dist/components/accordion/AccordionTrigger.js +1 -1
  5. package/dist/components/tabs/{TabsTrigger.d.ts → TabTrigger.d.ts} +6 -3
  6. package/dist/components/tabs/TabTrigger.js +1 -0
  7. package/dist/components/tabs/Tabs.d.ts +276 -7
  8. package/dist/components/tabs/Tabs.js +1 -1
  9. package/dist/components/tabs/TabsTriggerList.d.ts +9 -5
  10. package/dist/components/tabs/TabsTriggerList.js +1 -1
  11. package/dist/components/tabs/utils.d.ts +2 -0
  12. package/dist/components/tabs/utils.js +1 -0
  13. package/dist/components/top-bar/TopBar.js +1 -1
  14. package/dist/docgen.json +1 -1
  15. package/dist/docs/Accordion.mdx +7 -56
  16. package/dist/docs/Tabs.mdx +57 -31
  17. package/dist/index.cjs.js +1 -1
  18. package/dist/utilities/hooks/useCallbackRef.js +1 -1
  19. package/dist/utilities/hooks/useScrollPosition.d.ts +3 -6
  20. package/dist/utilities/hooks/useScrollPosition.js +1 -1
  21. package/package.json +4 -4
  22. package/CHANGELOG.md +0 -200
  23. package/dist/components/tabs/TabsContent.d.ts +0 -267
  24. package/dist/components/tabs/TabsContent.js +0 -1
  25. package/dist/components/tabs/TabsTrigger.js +0 -1
  26. package/dist/docs/README.mdx +0 -79
  27. package/dist/experiments/color-scheme/ColorScheme.d.ts +0 -201
  28. package/dist/experiments/color-scheme/ColorScheme.js +0 -1
  29. package/dist/experiments/color-scheme/blue.json.js +0 -1
  30. package/dist/experiments/color-scheme/generateAlphaColors.d.ts +0 -1
  31. package/dist/experiments/color-scheme/generateAlphaColors.js +0 -1
  32. package/dist/experiments/color-scheme/index.d.ts +0 -1
  33. package/dist/experiments/color-scheme/slate.json.js +0 -1
  34. package/dist/experiments/color-scheme/stitches.colorscheme.config.d.ts +0 -452
  35. package/dist/experiments/color-scheme/stitches.colorscheme.config.js +0 -1
  36. package/dist/utilities/hooks/useWindowScrollPosition.d.ts +0 -6
  37. package/dist/utilities/hooks/useWindowScrollPosition.js +0 -1
  38. package/dist/utilities/hooks/useWindowSize.d.ts +0 -8
  39. package/dist/utilities/hooks/useWindowSize.js +0 -1
@@ -1 +1 @@
1
- import*as l from"react";const n=()=>{const e=l.useRef(null),u=l.useCallback(t=>{t&&(e.current=t)},[]);return[e,u]},s=()=>{const[e,u]=l.useState(null),t=l.useCallback(a=>{a&&u(a)},[]);return[e,t]};export{n as useCallbackRef,s as useCallbackRefState};
1
+ import*as t from"react";const s=()=>{const e=t.useRef(null),n=t.useCallback(r=>{r&&(e.current=r)},[]);return[e,n]};export{s as useCallbackRef};
@@ -1,7 +1,4 @@
1
- export declare const useScrollPosition: ({ elRef, delay }: {
2
- elRef?: HTMLElement | null | undefined;
3
- delay?: number | undefined;
4
- }) => {
5
- left: number;
6
- top: number;
1
+ export declare const useScrollPosition: () => {
2
+ x: number;
3
+ y: number;
7
4
  };
@@ -1 +1 @@
1
- import{useState as s,useEffect as n}from"react";import{debounce as c}from"throttle-debounce";const f=({elRef:e,delay:r=500})=>{const[l,o]=s({left:0,top:0});return n(()=>{if(!e)return;const t=c(r,()=>{o({left:e.scrollLeft,top:e.scrollTop})});return e.addEventListener("scroll",t),()=>{e.removeEventListener("scroll",t)}},[e]),l};export{f as useScrollPosition};
1
+ import{useState as s,useEffect as l}from"react";import{throttle as i}from"throttle-debounce";const c=()=>{const[t,r]=s({x:0,y:0}),{x:e,y:n}=t;return l(()=>{const o=i(500,()=>{r({x:window.scrollX,y:window.scrollY})});return window.addEventListener("scroll",o),()=>{window.removeEventListener("scroll",o)}},[]),{x:e,y:n}};export{c as useScrollPosition};
package/package.json CHANGED
@@ -4,7 +4,7 @@
4
4
  "main": "dist/index.cjs.js",
5
5
  "typings": "dist/index.d.ts",
6
6
  "module": "dist/index.js",
7
- "version": "2.28.3-beta.1",
7
+ "version": "2.29.0-1",
8
8
  "description": "",
9
9
  "files": [
10
10
  "dist"
@@ -71,6 +71,7 @@
71
71
  "@semantic-release/npm": "^7.1.1",
72
72
  "@semantic-release/release-notes-generator": "^9.0.2",
73
73
  "@size-limit/preset-small-lib": "^7.0.5",
74
+ "@stitches/react": "^1.2.8",
74
75
  "@testing-library/jest-dom": "^5.11.9",
75
76
  "@testing-library/react": "^11.2.3",
76
77
  "@testing-library/react-hooks": "^7.0.2",
@@ -107,7 +108,6 @@
107
108
  "react-docgen-typescript": "2.1.0",
108
109
  "rollup": "^2.39.0",
109
110
  "rollup-plugin-esbuild": "^4.8.2",
110
- "rollup-plugin-json": "^4.0.0",
111
111
  "rollup-plugin-summary": "^1.3.0",
112
112
  "rollup-plugin-terser": "^7.0.2",
113
113
  "rollup-plugin-visualizer": "^4.2.2",
@@ -123,6 +123,7 @@
123
123
  "peerDependencies": {
124
124
  "@atom-learning/icons": "^1.0.0",
125
125
  "@atom-learning/theme": "^1.0.0",
126
+ "@stitches/react": "^1.0.0",
126
127
  "react": "^16.0.0 || ^17.0.0 || ^18.0.0",
127
128
  "react-dom": "^16.0.0 || ^17.0.0 || ^18.0.0"
128
129
  },
@@ -149,7 +150,6 @@
149
150
  "@radix-ui/react-tooltip": "^1.0.0",
150
151
  "@radix-ui/react-visually-hidden": "^1.0.0",
151
152
  "@reach/combobox": "^0.16.1",
152
- "@stitches/react": "^1.2.8",
153
153
  "@tanstack/react-table": "^8.5.11",
154
154
  "@types/react": "^17.0.30",
155
155
  "color2k": "^2.0.0",
@@ -172,7 +172,7 @@
172
172
  "husky": {
173
173
  "hooks": {
174
174
  "commit-msg": "commitlint -E HUSKY_GIT_PARAMS",
175
- "pre-commit": "bash ../scripts/prevent-commit.sh && lint-staged"
175
+ "pre-commit": "bash scripts/prevent-commit.sh && lint-staged"
176
176
  }
177
177
  },
178
178
  "commitlint": {
package/CHANGELOG.md DELETED
@@ -1,200 +0,0 @@
1
- # [1.4.0](https://github.com/Atom-Learning/components/compare/v1.3.0...v1.4.0) (2022-04-11)
2
-
3
-
4
- ### Features
5
-
6
- * **stepper:** adding ability to override default forward behaviour ([#318](https://github.com/Atom-Learning/components/issues/318)) ([c9cc080](https://github.com/Atom-Learning/components/commit/c9cc080ce9c77afda0ba9df48eb74276ce2c4505))
7
-
8
- # [1.3.0](https://github.com/Atom-Learning/components/compare/v1.2.1...v1.3.0) (2022-04-07)
9
-
10
-
11
- ### Bug Fixes
12
-
13
- * add compound variant for outline secondary buttons ([09bb100](https://github.com/Atom-Learning/components/commit/09bb10071d10f421eec37bc505860120396e2232))
14
- * add typings to package.json to explicitly refer index.d.ts ([033c9b6](https://github.com/Atom-Learning/components/commit/033c9b6330d1b75a862a0a0c4d525a53e3707571))
15
- * added type=search back and used css to hide browser icon ([13cf732](https://github.com/Atom-Learning/components/commit/13cf7320eda155eed7b6b340602cfeee02021745))
16
- * adding custom plurals ([ad13522](https://github.com/Atom-Learning/components/commit/ad1352277fac5b6b6e4f4b41c7a7b0092c62d4ae))
17
- * adding label translation, input size, and fixing popover tweaks ([08c47e6](https://github.com/Atom-Learning/components/commit/08c47e6b18537e73150d9010311d8d59d31fdc09))
18
- * adding test for min max values ([5026b4d](https://github.com/Atom-Learning/components/commit/5026b4d95f9ac7a7c9fdc7baf06f153d8c00a8f5))
19
- * adding test for slidersteps ([7254b0f](https://github.com/Atom-Learning/components/commit/7254b0f85d9cb81e2ebeab5946ab91caa46804fb))
20
- * allow external change handler on date input ([d265761](https://github.com/Atom-Learning/components/commit/d26576148c94740899f87cfd6708dc5a982f8fb4))
21
- * attempting to fix merge issue ([531590e](https://github.com/Atom-Learning/components/commit/531590e2ae068be69303f63e83e612e974cb8a90))
22
- * avoid initial render, screenWidth can be left undefined ([35766bf](https://github.com/Atom-Learning/components/commit/35766bfeb28a66bee20e735aaf27b34862815495))
23
- * change accordion type ([8caeed7](https://github.com/Atom-Learning/components/commit/8caeed70b8425090e15ae0451bbc4b8b7601d72c))
24
- * changing composition so value is a separate component ([7cefeed](https://github.com/Atom-Learning/components/commit/7cefeed2d6097152ea484c329d3bce02c45cfc6d))
25
- * changing prop name to appearance ([429cab2](https://github.com/Atom-Learning/components/commit/429cab230f959de10fbbd8af51bebb5942b9193e))
26
- * changing unintuitive variant name ([d6993b0](https://github.com/Atom-Learning/components/commit/d6993b08346dffb6a2033a25f1c05bcbd84bd1c4))
27
- * css as per designs ([9f3a964](https://github.com/Atom-Learning/components/commit/9f3a96483c6acc2482ba7114d45ea11b2cffa529))
28
- * css typing ([324e323](https://github.com/Atom-Learning/components/commit/324e323a0e5aae0bddc76170f7833abf26832809))
29
- * dateinput type error ([ee5e109](https://github.com/Atom-Learning/components/commit/ee5e1094dfc46ec449fc5c1d207c62614dd2e1ea))
30
- * disabled state should not have any interaction whatsoever ([7e458ee](https://github.com/Atom-Learning/components/commit/7e458ee5311be59b552f99eb21aeaa0888168544))
31
- * documentation ([82e8ac4](https://github.com/Atom-Learning/components/commit/82e8ac45bca1d97d34bcb9ac3d36158af5c7edc0))
32
- * drop mount check inside useEffect hook ([8771774](https://github.com/Atom-Learning/components/commit/8771774de3a479d102e804eeec933685f22f1e64))
33
- * ensure dayjs plugin is treated as external dep ([a2525ea](https://github.com/Atom-Learning/components/commit/a2525eaf3d64dbcfd22351ae31d98b3d2d42fef5))
34
- * extend type to allow passing CSS ([261cda6](https://github.com/Atom-Learning/components/commit/261cda629c8435a8615e8b01d51fb55dd0a46d4b))
35
- * fixing tests, changing div to box ([1f57a3a](https://github.com/Atom-Learning/components/commit/1f57a3a874b7049b4accb3d498dfde1563aad4cd))
36
- * focus issue with next/prev buttons ([67d3de3](https://github.com/Atom-Learning/components/commit/67d3de3f5c65ed11f12588757a849bbe4601fa7d))
37
- * forcing boolean to clean up logic ([eeaec16](https://github.com/Atom-Learning/components/commit/eeaec164e7ff5ad35a0f61e38dcfeadff4922a3a))
38
- * introduce enum for icon ([2ce7486](https://github.com/Atom-Learning/components/commit/2ce7486b6410406e1cb67ecc3c5d7f72c4fe1949))
39
- * making position more responsive, updating tests ([01d2e77](https://github.com/Atom-Learning/components/commit/01d2e77a42f78fbe8b6e8ab7d7c3702327e163c9))
40
- * minor test and docs fixes ([a128057](https://github.com/Atom-Learning/components/commit/a1280573e8334c27ae58d5d63169840f1473b755))
41
- * minor tweak to tests ([cfb37a0](https://github.com/Atom-Learning/components/commit/cfb37a073dbb9015e98212525385d50eda1b245f))
42
- * minor update to docs ([c7a1673](https://github.com/Atom-Learning/components/commit/c7a1673f1e655177fcbe93838f84949e645e80dd))
43
- * minor update to docs ([35dbedd](https://github.com/Atom-Learning/components/commit/35dbedd6a0d26001025cf28007e8c9ace8396e73))
44
- * more responsive styling, mdx changes ([e18585a](https://github.com/Atom-Learning/components/commit/e18585accc31e5c62637ad4e9f922a43b10b1e9c))
45
- * positioning of icon ([5f630f0](https://github.com/Atom-Learning/components/commit/5f630f0b351c21a705dcb6f042332ab130f138f3))
46
- * prop name and docs example ([2e6a91e](https://github.com/Atom-Learning/components/commit/2e6a91e882402204507d24391d688f9e608f136b))
47
- * proper types for validationMode ([7f6cb30](https://github.com/Atom-Learning/components/commit/7f6cb300a769a7c43670f937517528519bb4ff13))
48
- * reducing height of track ([43f1f33](https://github.com/Atom-Learning/components/commit/43f1f335b8c1bb9ae06050b7ff913771b1fc5ce8))
49
- * remove unnecessary box wrapper ([cd6203f](https://github.com/Atom-Learning/components/commit/cd6203fab71597d243b25b13be987e0508b462a8))
50
- * remove unnecessary calendar docs, update datefield docs ([2a3ecb0](https://github.com/Atom-Learning/components/commit/2a3ecb0204b29e13f1542f65e11893eaeffad65a))
51
- * remove unused babel file ([8df5e19](https://github.com/Atom-Learning/components/commit/8df5e195eb78c5462e5610cf9d8c3cf1f53c4172))
52
- * remove unused code ([8019865](https://github.com/Atom-Learning/components/commit/8019865df92a86fee4f23480ec09d4dba4c18986))
53
- * remove unwanted padding from container ([2d3fd00](https://github.com/Atom-Learning/components/commit/2d3fd00ccdbdc293d923b96d4a348d508b22c874))
54
- * removing unneeded default value ([4db40c6](https://github.com/Atom-Learning/components/commit/4db40c656bf73b2a459dd69fcee5c0de8d705baf))
55
- * rename Icon component ([ce20992](https://github.com/Atom-Learning/components/commit/ce20992e40e29a6940ef57749184871be539b0b5))
56
- * rename prop and move callback into useEffect hook ([14cd086](https://github.com/Atom-Learning/components/commit/14cd086a536a937087a1088beefedd36170865fd))
57
- * rename test description ([3137897](https://github.com/Atom-Learning/components/commit/313789734a3d06ac0d1e2d5e7ec159335106224b))
58
- * render buttons with display: none to include them in snapshot ([9844223](https://github.com/Atom-Learning/components/commit/9844223fc29a4505620111f8427ba4c3073fe7b0))
59
- * replace babel-jest ([8c1c0d4](https://github.com/Atom-Learning/components/commit/8c1c0d4dcfffe162b0effe415ef96998fb421484))
60
- * replace iconwrapper for accordion ([52d93ad](https://github.com/Atom-Learning/components/commit/52d93ade51e91e9c71e21ab5d078e5ad0668705e))
61
- * revalidate on date select ([a688ed8](https://github.com/Atom-Learning/components/commit/a688ed81950e751e53c686c84331226a03aa397b))
62
- * revert jest to last version to stop node engine errors ([6351b74](https://github.com/Atom-Learning/components/commit/6351b74f7a29363511ed61816b29b09821000ba4))
63
- * review feedback ([9237067](https://github.com/Atom-Learning/components/commit/9237067445a947e3aacde6645a03961de2708703))
64
- * review feedback ([d74a333](https://github.com/Atom-Learning/components/commit/d74a3337de79f373eca066050c0f98116bd9e7e1))
65
- * rotation applied to all icons and not just the arrow ([595a246](https://github.com/Atom-Learning/components/commit/595a246216ffc2bfb84c6c29806d17dcfeb8e817))
66
- * search input onChange ([f13bd23](https://github.com/Atom-Learning/components/commit/f13bd23c8fd12eb32b7c41a62122206891dc9d6f))
67
- * separating slidersteps component ([5d1b0af](https://github.com/Atom-Learning/components/commit/5d1b0afac6268218fd75893365fa0e8ff28095f2))
68
- * separator colours and skipping behaviour ([8e85863](https://github.com/Atom-Learning/components/commit/8e85863fa36f31503cdfc67f74427ff128a77e03))
69
- * slider min max bug ([2a5405f](https://github.com/Atom-Learning/components/commit/2a5405fd7ce0ef7fa13219eb4775b4fa8fc00938))
70
- * snapshot test ([b364cf6](https://github.com/Atom-Learning/components/commit/b364cf66c865a875ae978393c533a1e662bec1b8))
71
- * stepper being able to navigate outside bullet range when no OnComplete handler is passed ([c620481](https://github.com/Atom-Learning/components/commit/c620481fa5d41583779590c63e183f9c0532aba9))
72
- * stepper types ([f7e1c20](https://github.com/Atom-Learning/components/commit/f7e1c208dbb911ccaade2bebb6cdbf49fe82f39b))
73
- * stop render on empty value ([005c14c](https://github.com/Atom-Learning/components/commit/005c14c9fc819f7106ef6768ac1a1ac110af662a))
74
- * tabs jump on font weight change ([219b01b](https://github.com/Atom-Learning/components/commit/219b01bbf86cc81881893b5efd925aea27c1ba93))
75
- * throttle was being called in a wrong way ([bce0d0d](https://github.com/Atom-Learning/components/commit/bce0d0db6d2fc5569bec0e1eec96399fdf573d64))
76
- * TS issues ([fad5121](https://github.com/Atom-Learning/components/commit/fad5121e853f6fa56368c8ec479b260e955c886b))
77
- * tweaking null return logic ([528afda](https://github.com/Atom-Learning/components/commit/528afda648c8c6275414c7856ff145facd4884c2))
78
- * typo on slider mdx ([45c2218](https://github.com/Atom-Learning/components/commit/45c2218bb9e21f41aea864b6ca387794bfcf06b8))
79
- * unifying disabled theme styles ([14538e4](https://github.com/Atom-Learning/components/commit/14538e43f66fb1cf4d1665898c985318aaaada28))
80
- * update snaps ([af59ab1](https://github.com/Atom-Learning/components/commit/af59ab1e77377fac7c71f7e785f44a81b3e24650))
81
- * update theme package ([1059b45](https://github.com/Atom-Learning/components/commit/1059b45256c79fc84bc6f8659b1d32f832b93114))
82
- * updating key to not be index ([26de60e](https://github.com/Atom-Learning/components/commit/26de60e4995a8cd5488a63cec03555ceb9d8d01c))
83
- * updating mdx ([ce15564](https://github.com/Atom-Learning/components/commit/ce155646da9fb5dd4230b9135eaad9cd6d1824e8))
84
- * updating mdx ([60604ee](https://github.com/Atom-Learning/components/commit/60604ee02f959767fdc06d15b8aceb16078918bb))
85
- * updating mdx ([c433934](https://github.com/Atom-Learning/components/commit/c433934f3bc0e3377b2067d61c4a3d0b208b4bdd))
86
- * updating mdx files ([f55277b](https://github.com/Atom-Learning/components/commit/f55277b47476a5614a632b09b39118d0fa3c85c0))
87
- * updating readme ([959ec26](https://github.com/Atom-Learning/components/commit/959ec2629e01bbeb6781e9bcf236fb544153be86))
88
- * updating readme ([4032986](https://github.com/Atom-Learning/components/commit/40329868600b456eff3e7456028e1f747817462b))
89
- * updating style changes to be opt in and better typed ([3b94b09](https://github.com/Atom-Learning/components/commit/3b94b09d7ce7ac359b58149eb2cc86f49a47c740))
90
- * use stitches to style the icon ([5fb3fb2](https://github.com/Atom-Learning/components/commit/5fb3fb2e5a066cc1967ca0093158a363de161ac0))
91
- * yarn.lock ([a81c04a](https://github.com/Atom-Learning/components/commit/a81c04a9f8b67fc222d971c808bc9babfb708b34))
92
-
93
-
94
- ### Features
95
-
96
- * add date field, finalise date input changes ([58edcfc](https://github.com/Atom-Learning/components/commit/58edcfc365ca7a5f902cdffb6f9de9c9f5c2009d))
97
- * add tab scrollers which allows easy navigation if tabs length is more than available space ([cec5b04](https://github.com/Atom-Learning/components/commit/cec5b04235f2c24915050dfd71975608ddee7c86))
98
- * add test:ci option to improve logs on ci ([3452dbb](https://github.com/Atom-Learning/components/commit/3452dbbf141d659a2044148712dd243729fb8916))
99
- * added translation, firstDayOfWeek, test, and documentation ([ca785b4](https://github.com/Atom-Learning/components/commit/ca785b4509ee581f5ba7d916c041f8291235ad24))
100
- * adding neutral outline variant ([53a793a](https://github.com/Atom-Learning/components/commit/53a793a02836a74a8e2dac481cedec2e1707fef2))
101
- * adding new table variants ([8a1fcc8](https://github.com/Atom-Learning/components/commit/8a1fcc8d68f48c78fc3dfc5a9a2e9a758c9eaaf6))
102
- * adding optional uppercase to tabs ([708c6f2](https://github.com/Atom-Learning/components/commit/708c6f2d5ca33988b69f2aa868fdb8543aa56d6b))
103
- * additional icon variant ([7e471bc](https://github.com/Atom-Learning/components/commit/7e471bc558543f84a732bc3180bd79dde76b58aa))
104
- * button neutral theme ([8bbcf1a](https://github.com/Atom-Learning/components/commit/8bbcf1a4301cb07579de485fb6789576f7fa82c1))
105
- * changed new variants colors for different states ([d29b374](https://github.com/Atom-Learning/components/commit/d29b374319bf133d2525681036e9ca3cda326a86))
106
- * grid max item size ([573c17e](https://github.com/Atom-Learning/components/commit/573c17e0aec90b68e636de8238f3a98922113593))
107
- * initial work on calendar component ([ebc8948](https://github.com/Atom-Learning/components/commit/ebc8948b66573efcc782e29b78537d89968d43d8))
108
- * initial work on date input ([4fc6827](https://github.com/Atom-Learning/components/commit/4fc682733639ce69a60e2d869cdeaaeb88f3a4c3))
109
- * initial work on slider ([f5a6ea1](https://github.com/Atom-Learning/components/commit/f5a6ea11349b903ed1b05ab27dc2da0004a2a595))
110
- * make it possible to show / hide close button in modal ([1c44907](https://github.com/Atom-Learning/components/commit/1c44907ad94a5ccf5c07d2b329d292ccb05a9368))
111
- * no light bg for tabs ([b57cdff](https://github.com/Atom-Learning/components/commit/b57cdff08f0c5594d909bcaf2f23414b2087a06a))
112
- * notification badge component ([3f93049](https://github.com/Atom-Learning/components/commit/3f930490be322df4f58e3f643d197e1d7db6d142))
113
- * option to hide the chevron icon in trigger ([6cc28bf](https://github.com/Atom-Learning/components/commit/6cc28bff3dd5a25f734e860cdcbddc17e4725432))
114
- * pass ref onto the ReactPlayer component so that we have access to the ReactPlayer instance ([fb2b09c](https://github.com/Atom-Learning/components/commit/fb2b09ca81e62581dcf3b5e55a8ec5722c3621dc))
115
- * progress-indicator ([b2ebe20](https://github.com/Atom-Learning/components/commit/b2ebe208e0af05245c3738403bb0b6c05250f2d6))
116
- * remove :before and :after for nested Text components ([55e7a9b](https://github.com/Atom-Learning/components/commit/55e7a9be37fac435a85b21c21df505be26b26e89))
117
- * replace babel & terser with esbuild ([bb11c3c](https://github.com/Atom-Learning/components/commit/bb11c3cbb6d226750eaae75372e49d9afaa05606))
118
- * **SearchInput:** added clear functionality ([8c0fc32](https://github.com/Atom-Learning/components/commit/8c0fc3240cfaeb50df231da383a448eabd509d75))
119
- * show / hide scroller buttons based on scroll position ([a6c7e49](https://github.com/Atom-Learning/components/commit/a6c7e49b0851415fc90e4c8d401b6926bacdd719))
120
- * simplifying output label to callback ([fcf0eb2](https://github.com/Atom-Learning/components/commit/fcf0eb2c0d88dfbc6c8b17c8831ba022de537539))
121
- * slider step functionality ([ec0d308](https://github.com/Atom-Learning/components/commit/ec0d308c6f106aed3ba6f130bb163990c923adf9))
122
- * slider value label ([9645dc9](https://github.com/Atom-Learning/components/commit/9645dc9abb3c7dc2fd96212b6c4b395cdc206b89))
123
- * slider.steps component, composition change ([5be643f](https://github.com/Atom-Learning/components/commit/5be643f7caa9db1dcc91bb3c6537dc87458512ed))
124
- * sliderfield component added ([3536925](https://github.com/Atom-Learning/components/commit/35369251f41ddd74bfe491ea5022bd60ab7a2c42))
125
- * support multiple values, updating mdx ([a01bfab](https://github.com/Atom-Learning/components/commit/a01bfab5635b6a0710cb997bc4794fd69299f025))
126
- * tab scroll percentage ([06240fb](https://github.com/Atom-Learning/components/commit/06240fb093d760121ab18ed053f826e37d42cb94))
127
- * update slider api ([d752c75](https://github.com/Atom-Learning/components/commit/d752c751395313cd6fa499c26f5ed342d6b4bbe3))
128
- * update to preset-small-lib to improve performance ([431da9c](https://github.com/Atom-Learning/components/commit/431da9ced8916e0ebc90dc064d200adcb1c25384))
129
- * WIP update packages and improve keyboard accessibility ([e0f5f9d](https://github.com/Atom-Learning/components/commit/e0f5f9dfa989e74c3ada486b16785ebb7f0d7c8e))
130
-
131
-
132
- ### Reverts
133
-
134
- * remove showChevron option ([e9b928c](https://github.com/Atom-Learning/components/commit/e9b928c53e23431563719624cb77b244a79e73b9))
135
-
136
- # [1.4.0](https://github.com/Atom-Learning/components/compare/v1.3.1...v1.4.0) (2021-12-03)
137
-
138
- # [1.3.1](https://github.com/Atom-Learning/components/compare/v1.3.0...v1.3.1) (2021-11-25)
139
-
140
- # [1.3.0](https://github.com/Atom-Learning/components/compare/v1.2.3...v1.3.0) (2021-11-23)
141
-
142
- # [1.2.3](https://github.com/Atom-Learning/components/compare/v1.2.2...v1.2.3) (2021-11-16)
143
-
144
- # [1.2.2](https://github.com/Atom-Learning/components/compare/v1.2.1...v1.2.2) (2021-11-12)
145
-
146
- # [1.2.1](https://github.com/Atom-Learning/components/compare/v1.2.0...v1.2.1) (2021-11-11)
147
-
148
- # [1.2.0](https://github.com/Atom-Learning/components/compare/v1.1.1...v1.2.0) (2021-11-10)
149
-
150
-
151
- ### Bug Fixes
152
-
153
- * adding TODO on type ([e928651](https://github.com/Atom-Learning/components/commit/e928651928291f8a9b639c8fa6c348b1bafe6513))
154
- * few changes from PR ([e0f75a1](https://github.com/Atom-Learning/components/commit/e0f75a1788af1e23ec6efdfdd24f2788d73d33b0))
155
- * fixing small error on documentation ([3be573a](https://github.com/Atom-Learning/components/commit/3be573a7584cbe8470a0db0186302e3e39e8734b))
156
-
157
-
158
- ### Features
159
-
160
- * adding accordion component ([60eac3c](https://github.com/Atom-Learning/components/commit/60eac3c47e3ce48371af624ff1ec0b6477b86823))
161
-
162
- ## [1.1.1](https://github.com/Atom-Learning/components/compare/v1.1.0...v1.1.1) (2021-11-10)
163
-
164
-
165
- ### Bug Fixes
166
-
167
- * update snapshot ([e71c8a4](https://github.com/Atom-Learning/components/commit/e71c8a4f03227a29eeefca9d2afd7b6355a3ed46))
168
-
169
- # [1.1.0](https://github.com/Atom-Learning/components/compare/v1.0.2...v1.1.0) (2021-11-05)
170
-
171
-
172
- ### Features
173
-
174
- * update dropdown item styles ([6bf229f](https://github.com/Atom-Learning/components/commit/6bf229fbfa9cffaaa74fda5d3629636a926a3404))
175
-
176
- ## [1.0.2](https://github.com/Atom-Learning/components/compare/v1.0.1...v1.0.2) (2021-11-02)
177
-
178
-
179
- ### Bug Fixes
180
-
181
- * reinstate as type on heading and text ([1ec5ca7](https://github.com/Atom-Learning/components/commit/1ec5ca7d7ae09664bbd662cc21fee7784cf1bb3c))
182
- * remove redundant flex styles for block Label ([54715ff](https://github.com/Atom-Learning/components/commit/54715ffc938231b4569a3ce4813c2e25d5404988))
183
- * remove unnecessary overridden as & size types ([985231a](https://github.com/Atom-Learning/components/commit/985231a9259005a6b44cdfe20ba786f942dba81c))
184
-
185
- ## [1.0.1](https://github.com/Atom-Learning/components/compare/v1.0.0...v1.0.1) (2021-11-02)
186
-
187
-
188
- ### Bug Fixes
189
-
190
- * remove cursor pointer from disabled tab ([34c283f](https://github.com/Atom-Learning/components/commit/34c283f70ce73d0ca2b2886e495bcece5475097c))
191
-
192
- # 1.0.0 (2021-10-22)
193
-
194
- - Initial release 🎉
195
-
196
- # Changelog
197
-
198
- All notable changes to this project will be documented in this file.
199
-
200
- _NOTE: THIS FILE IS AUTOMATICALLY UPDATED_
@@ -1,267 +0,0 @@
1
- /// <reference types="react" />
2
- export declare const TabsContent: import("@stitches/react/types/styled-component").StyledComponent<import("react").ForwardRefExoticComponent<import("@radix-ui/react-tabs").TabsContentProps & import("react").RefAttributes<HTMLDivElement>>, {}, {
3
- sm: string;
4
- md: string;
5
- lg: string;
6
- xl: string;
7
- reducedMotion: string;
8
- allowMotion: string;
9
- hover: string;
10
- }, import("@stitches/react/types/css-util").CSS<{
11
- sm: string;
12
- md: string;
13
- lg: string;
14
- xl: string;
15
- reducedMotion: string;
16
- allowMotion: string;
17
- hover: string;
18
- }, {
19
- colors: {
20
- textForeground: any;
21
- textSubtle: any;
22
- textPlaceholder: any;
23
- background: any;
24
- backgroundAccent: any;
25
- tonal50: any;
26
- tonal100: any;
27
- tonal200: any;
28
- tonal300: any;
29
- tonal400: any;
30
- tonal500: any;
31
- tonal600: any;
32
- alpha100: any;
33
- alpha150: any;
34
- alpha200: any;
35
- alpha250: any;
36
- alpha600: any;
37
- primaryLight: any;
38
- primary: any;
39
- primaryMid: any;
40
- primaryDark: any;
41
- secondary: any;
42
- brandRed: any;
43
- brandRedAccent: any;
44
- brandGreen: any;
45
- brandGreenAccent: any;
46
- brandPurple: any;
47
- brandPurpleAccent: any;
48
- brandYellow: any;
49
- brandYellowAccent: any;
50
- successLight: any;
51
- success: any;
52
- successMid: any;
53
- successDark: any;
54
- dangerLight: any;
55
- danger: any;
56
- dangerMid: any;
57
- dangerDark: any;
58
- warningLight: any;
59
- warning: any;
60
- warningMid: any;
61
- warningDark: any;
62
- warningText: any;
63
- subjectEnglish: any;
64
- subjectMaths: any;
65
- subjectScience: any;
66
- subjectVerbalReasoning: any;
67
- subjectNonVerbalReasoning: any;
68
- subjectCreativeWriting: any;
69
- subjectExamSkills: any;
70
- };
71
- space: {
72
- "0": any;
73
- "1": any;
74
- "2": any;
75
- "3": any;
76
- "4": any;
77
- "5": any;
78
- "6": any;
79
- "7": any;
80
- "8": any;
81
- "9": any;
82
- };
83
- fontSizes: {
84
- xs: any;
85
- sm: any;
86
- md: any;
87
- lg: any;
88
- xl: any;
89
- "2xl": any;
90
- "3xl": any;
91
- "4xl": any;
92
- };
93
- fonts: {
94
- sans: any;
95
- mono: any;
96
- display: any;
97
- body: any;
98
- };
99
- sizes: {
100
- "0": any;
101
- "1": any;
102
- "2": any;
103
- "3": any;
104
- "4": any;
105
- "5": any;
106
- "6": any;
107
- "7": any;
108
- "8": any;
109
- };
110
- radii: {
111
- "0": any;
112
- "1": any;
113
- "2": any;
114
- "3": any;
115
- round: any;
116
- };
117
- shadows: {
118
- "0": any;
119
- "1": any;
120
- "2": any;
121
- "3": any;
122
- };
123
- }, import("@stitches/react/types/config").DefaultThemeMap, {
124
- bg: (value: {
125
- readonly [$$PropertyValue]: "background";
126
- }) => {
127
- background: {
128
- readonly [$$PropertyValue]: "background";
129
- };
130
- };
131
- inset: (value: string | number | {
132
- readonly [$$ScaleValue]: "space";
133
- }) => {
134
- top: string | number | {
135
- readonly [$$ScaleValue]: "space";
136
- };
137
- right: string | number | {
138
- readonly [$$ScaleValue]: "space";
139
- };
140
- bottom: string | number | {
141
- readonly [$$ScaleValue]: "space";
142
- };
143
- left: string | number | {
144
- readonly [$$ScaleValue]: "space";
145
- };
146
- };
147
- size: (value: string | number | {
148
- readonly [$$ScaleValue]: "size";
149
- }) => {
150
- height: string | number | {
151
- readonly [$$ScaleValue]: "size";
152
- };
153
- width: string | number | {
154
- readonly [$$ScaleValue]: "size";
155
- };
156
- };
157
- p: (value: string | number | {
158
- readonly [$$ScaleValue]: "space";
159
- }) => {
160
- padding: string | number | {
161
- readonly [$$ScaleValue]: "space";
162
- };
163
- };
164
- pt: (value: string | number | {
165
- readonly [$$ScaleValue]: "space";
166
- }) => {
167
- paddingTop: string | number | {
168
- readonly [$$ScaleValue]: "space";
169
- };
170
- };
171
- pr: (value: string | number | {
172
- readonly [$$ScaleValue]: "space";
173
- }) => {
174
- paddingRight: string | number | {
175
- readonly [$$ScaleValue]: "space";
176
- };
177
- };
178
- pb: (value: string | number | {
179
- readonly [$$ScaleValue]: "space";
180
- }) => {
181
- paddingBottom: string | number | {
182
- readonly [$$ScaleValue]: "space";
183
- };
184
- };
185
- pl: (value: string | number | {
186
- readonly [$$ScaleValue]: "space";
187
- }) => {
188
- paddingLeft: string | number | {
189
- readonly [$$ScaleValue]: "space";
190
- };
191
- };
192
- px: (value: string | number | {
193
- readonly [$$ScaleValue]: "space";
194
- }) => {
195
- paddingLeft: string | number | {
196
- readonly [$$ScaleValue]: "space";
197
- };
198
- paddingRight: string | number | {
199
- readonly [$$ScaleValue]: "space";
200
- };
201
- };
202
- py: (value: string | number | {
203
- readonly [$$ScaleValue]: "space";
204
- }) => {
205
- paddingTop: string | number | {
206
- readonly [$$ScaleValue]: "space";
207
- };
208
- paddingBottom: string | number | {
209
- readonly [$$ScaleValue]: "space";
210
- };
211
- };
212
- m: (value: string | number | {
213
- readonly [$$ScaleValue]: "space";
214
- }) => {
215
- margin: string | number | {
216
- readonly [$$ScaleValue]: "space";
217
- };
218
- };
219
- mt: (value: string | number | {
220
- readonly [$$ScaleValue]: "space";
221
- }) => {
222
- marginTop: string | number | {
223
- readonly [$$ScaleValue]: "space";
224
- };
225
- };
226
- mr: (value: string | number | {
227
- readonly [$$ScaleValue]: "space";
228
- }) => {
229
- marginRight: string | number | {
230
- readonly [$$ScaleValue]: "space";
231
- };
232
- };
233
- mb: (value: string | number | {
234
- readonly [$$ScaleValue]: "space";
235
- }) => {
236
- marginBottom: string | number | {
237
- readonly [$$ScaleValue]: "space";
238
- };
239
- };
240
- ml: (value: string | number | {
241
- readonly [$$ScaleValue]: "space";
242
- }) => {
243
- marginLeft: string | number | {
244
- readonly [$$ScaleValue]: "space";
245
- };
246
- };
247
- mx: (value: string | number | {
248
- readonly [$$ScaleValue]: "space";
249
- }) => {
250
- marginLeft: string | number | {
251
- readonly [$$ScaleValue]: "space";
252
- };
253
- marginRight: string | number | {
254
- readonly [$$ScaleValue]: "space";
255
- };
256
- };
257
- my: (value: string | number | {
258
- readonly [$$ScaleValue]: "space";
259
- }) => {
260
- marginTop: string | number | {
261
- readonly [$$ScaleValue]: "space";
262
- };
263
- marginBottom: string | number | {
264
- readonly [$$ScaleValue]: "space";
265
- };
266
- };
267
- }>>;
@@ -1 +0,0 @@
1
- import{Content as t}from"@radix-ui/react-tabs";import{styled as n}from"../../stitches.js";const e=n(t,{flexGrow:1,fontFamily:"$body"}),o=e;o.displayName="TabsContent";export{o as TabsContent};
@@ -1 +0,0 @@
1
- import{Trigger as i}from"@radix-ui/react-tabs";import*as e from"react";import{styled as a}from"../../stitches.js";import{Text as n}from"../text/Text.js";import{focusVisibleStyleBlock as c}from"../../utilities/style/focus-visible-style-block.js";const s=a(i,{background:"none",border:"none",cursor:"pointer",flexShrink:0,p:"$4",userSelect:"none",borderBottom:"2px solid transparent",'&[data-state="active"]':{color:"$interactive1",fontWeight:600,letterSpacing:"-0.005em",borderColor:"currentColor"},"&[data-disabled]":{opacity:.3,cursor:"not-allowed"},"&:not([data-disabled])":{"&:hover, &:focus-visible":{color:"$interactive2",bg:"$accentA1"},"&:active":{color:"$interactive3"},"&:focus-visible":{...c()}}}),r=({children:o,...t})=>e.createElement(s,{asChild:!0,...t},e.createElement(n,{size:"sm",as:"span"},o));r.displayName="TabsTrigger";export{r as TabsTrigger};
@@ -1,79 +0,0 @@
1
- ## Color Schemes (v.ALPHA)
2
-
3
- `color-scheme/`, is an **internal** component in an alpha stage (usable but not finalised) which introduces a `ColorScheme` component. It has been worked on heavily in terms of considering the required options and logic from dev but is **not finished and needs more design input**.
4
-
5
- The problem that this component was introduced to solve is the difficult way we have approached theming so far in our components.
6
- In the past we have heavily relied on props drilling and passing down theme related stitches variants to children, which means _(1)_ the colours can easily break when the expected children are nested further than directly under the 'theme providing' parent (The component which has a `theme` prop and tries to prop-drill theme). Moreover, _(2)_ we have inconsistent naming for our themes and _(3)_ inconsistent implementations on active components since _(4)_ the theming need to be documented and coded separately for each new component.
7
-
8
- This `<ColorScheme />` component allows for `base` (`var(--baseX)`) and `accent` (`var(--accentX)`) theme property, as well as an `interactive` contrast mode to affect all interactable components.
9
-
10
- The props are:
11
-
12
- - `base` is used for the base colours of the wrapped component: different tones of background and text. It currently only supports the `slate` (grey) colour but can be extended for different base colors.
13
- - `accent` is used for highlighted elements and interactive elements of the color scheme. It can be used directly but should be used with an interactive theme for interactive elements - see `<Button />`, `Accordion.Trigger` etc. Currently allowed accents are `slate` and `blue`.
14
- - `interactive` supports 4 versions `loContrast1` and `loContrast2` which on light color schemes are lighter and on a dark mode they would be darker (so low contrast in comparison to the background), and `hiContrast1`, `hiContrast2` which are used for the opposite.
15
-
16
- All the color scheme configurations setup used in the component can be found in `color-scheme/src/stitches.colorscheme.config.ts`
17
-
18
- The ColorScheme itself works by re-declaring the needed CSS variables any time it's used. It is heavily inpired by both [stitches theming guidelines](https://stitches.dev/docs/theming) and particularly by [the radix colors project](https://www.radix-ui.com/colors) of which it's almost a copy of but with our own colours defined and some aliasing to match the current design use requirements.
19
-
20
- Currently in use by a couple of components in library and the full documentation site. This component is subject to change when the Atom Learning colour theming patterns are properly established and we can make final decisions on the colours and API. **There will be changes to this code in the future.**
21
-
22
- ### Examples
23
-
24
- ```jsx
25
- <ColorScheme base="slate" accent="blue" interactive="hiContrast1">
26
- <Box css={{ background: '$background', color: '$foreground' }}>
27
- Off-black text over a white background
28
- </Box>
29
- <Box css={{ background: '$base1', color: '$foreground' }}>
30
- Off-black text over very slightly grey background
31
- </Box>
32
- <Box css={{ background: '$base7', color: '$foreground6plus' }}>
33
- White text over darker grey background
34
- </Box>
35
- <Box css={{ background: '$accent1', color: '$foreground' }}>
36
- Off-black text over a slightly blue background
37
- </Box>
38
- <Box css={{ background: '$accent7', color: '$foreground6plus' }}>
39
- White text over darker blue background
40
- </Box>
41
- <Box css={{ background: '$accent9', color: '$foreground6plus' }}>
42
- White text over much darker blue background
43
- </Box>
44
- <Button
45
- css={{
46
- background: '$interactive1',
47
- color: '$interactiveForeground',
48
- ['&:hover']: { background: '$interactive2' },
49
- ['&:active']: { background: '$interactive3' }
50
- }}
51
- >
52
- Blue button with white text
53
- </Button>
54
- <ColorScheme
55
- interactive="hiContrast2"
56
- as={Button}
57
- css={{
58
- background: '$interactive1',
59
- color: '$interactiveForeground',
60
- ['&:hover']: { background: '$interactive2' },
61
- ['&:active']: { background: '$interactive3' }
62
- }}
63
- >
64
- Darker blue button with white text
65
- </ColorScheme>
66
- <ColorScheme
67
- interactive="loContrast2"
68
- as={Button}
69
- css={{
70
- background: '$interactive1',
71
- color: '$interactiveForeground',
72
- ['&:hover']: { background: '$interactive2' },
73
- ['&:active']: { background: '$interactive3' }
74
- }}
75
- >
76
- Light blue button with off-black text
77
- </ColorScheme>
78
- </ColorScheme>
79
- ```