@koine/react 2.0.0-beta.10 → 2.0.0-beta.11

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 (216) hide show
  1. package/package.json +11 -11
  2. package/Alert/Alert.js +0 -33
  3. package/Alert/Alert.stories.js +0 -39
  4. package/Alert/index.js +0 -6
  5. package/Animations/Reveal.js +0 -53
  6. package/Animations/Underline.js +0 -26
  7. package/Animations/index.js +0 -8
  8. package/Animations/useReveal.js +0 -83
  9. package/Autocomplete/AutocompleteDownshift.js +0 -167
  10. package/Autocomplete/AutocompleteDownshiftMultiselect.js +0 -362
  11. package/Autocomplete/AutocompleteMui.js +0 -183
  12. package/Autocomplete/AutocompleteReach.js +0 -121
  13. package/Autocomplete/components.js +0 -132
  14. package/Autocomplete/helpers.js +0 -34
  15. package/Autocomplete/index.js +0 -15
  16. package/Bg/BgColor.js +0 -64
  17. package/Bg/BgPhoto.js +0 -82
  18. package/Bg/BgSvg.js +0 -31
  19. package/Bg/index.js +0 -8
  20. package/Breadcrumbs/Breadcrumbs.js +0 -103
  21. package/Breadcrumbs/index.js +0 -6
  22. package/Buttons/Button.js +0 -106
  23. package/Buttons/ButtonComposite.js +0 -116
  24. package/Buttons/ButtonFab.js +0 -27
  25. package/Buttons/ButtonLink.js +0 -29
  26. package/Buttons/IconButton.js +0 -41
  27. package/Buttons/index.js +0 -10
  28. package/Calendar/CalendarDaygridCell.js +0 -105
  29. package/Calendar/CalendarDaygridNav.js +0 -63
  30. package/Calendar/CalendarDaygridTable.js +0 -126
  31. package/Calendar/CalendarLegend.js +0 -39
  32. package/Calendar/calendar-api-google.js +0 -110
  33. package/Calendar/index.js +0 -11
  34. package/Calendar/types.js +0 -4
  35. package/Calendar/useCalendar.js +0 -235
  36. package/Calendar/utils.js +0 -252
  37. package/Carousel/Carousel.js +0 -387
  38. package/Carousel/CarouselCss.js +0 -64
  39. package/Carousel/index.js +0 -6
  40. package/Collapsable/Collapsable.js +0 -11
  41. package/Collapsable/CollapsableReach.js +0 -251
  42. package/Collapsable/index.js +0 -7
  43. package/Debug/Debug.js +0 -34
  44. package/Debug/index.js +0 -6
  45. package/Details/Details.js +0 -117
  46. package/Details/Details.stories.js +0 -39
  47. package/Details/index.js +0 -6
  48. package/Dialog/DialogMui.js +0 -143
  49. package/Dialog/DialogMui.stories.js +0 -38
  50. package/Dialog/css/bare.js +0 -55
  51. package/Dialog/css/index.stories.js +0 -93
  52. package/Dialog/index.js +0 -11
  53. package/Dialog/m/bare.js +0 -125
  54. package/Dialog/m/basic.js +0 -50
  55. package/Dialog/m/index.js +0 -14
  56. package/Dialog/sc/bare.js +0 -83
  57. package/Dialog/sc/framer.js +0 -26
  58. package/Dialog/sc/framerMaterial.js +0 -26
  59. package/Dialog/sc/index.stories.js +0 -75
  60. package/Dialog/sc/material.js +0 -78
  61. package/Dialog/tw/bare.js +0 -55
  62. package/Dialog/tw/elegant.js +0 -54
  63. package/Dialog/tw/framer.js +0 -26
  64. package/Dialog/tw/framerMaterial.js +0 -26
  65. package/Dialog/tw/index.stories.js +0 -113
  66. package/Dialog/tw/material.js +0 -54
  67. package/Editor/Editor--tiptap.js +0 -72
  68. package/Editor/components.js +0 -59
  69. package/Editor/index.js +0 -6
  70. package/FaviconTags.js +0 -73
  71. package/Form/Form.js +0 -130
  72. package/Form/index.js +0 -6
  73. package/Form/sc/bare.js +0 -55
  74. package/Forms/Checkbox/Checkbox.js +0 -62
  75. package/Forms/Checkbox/index.js +0 -6
  76. package/Forms/Feedback/Feedback.js +0 -25
  77. package/Forms/Feedback/index.js +0 -6
  78. package/Forms/Field/Field.js +0 -75
  79. package/Forms/Field/FieldControl.js +0 -69
  80. package/Forms/Field/FieldHint.js +0 -17
  81. package/Forms/Field/index.js +0 -7
  82. package/Forms/Input/Input.js +0 -67
  83. package/Forms/Input/index.js +0 -6
  84. package/Forms/InputGroup/InputGroup.js +0 -85
  85. package/Forms/InputGroup/index.js +0 -6
  86. package/Forms/Label/Label.js +0 -46
  87. package/Forms/Label/index.js +0 -6
  88. package/Forms/Password/Password.js +0 -72
  89. package/Forms/Password/index.js +0 -6
  90. package/Forms/Radio/Radio.js +0 -68
  91. package/Forms/Radio/index.js +0 -6
  92. package/Forms/Switch/Switch.js +0 -80
  93. package/Forms/Switch/index.js +0 -6
  94. package/Forms/Textarea/Textarea.js +0 -45
  95. package/Forms/Textarea/TextareaRich.js +0 -58
  96. package/Forms/Textarea/index.js +0 -7
  97. package/Forms/Toggle/Toggle-tailwind.js +0 -99
  98. package/Forms/Toggle/Toggle.js +0 -175
  99. package/Forms/Toggle/index.js +0 -6
  100. package/Forms/Toggle/useToggle-tailwind.js +0 -202
  101. package/Forms/Toggle/useToggle.js +0 -145
  102. package/Forms/antispam.js +0 -59
  103. package/Forms/helpers.js +0 -72
  104. package/Forms/index.js +0 -19
  105. package/Forms/styles.js +0 -94
  106. package/Gauge/Gauge.js +0 -111
  107. package/Grid/Grid.js +0 -106
  108. package/Grid/index.js +0 -6
  109. package/Hamburger/Hamburger.js +0 -90
  110. package/Hamburger/index.js +0 -6
  111. package/Header/index.js +0 -6
  112. package/Header/useHeader.js +0 -54
  113. package/Hidden/Hidden.js +0 -21
  114. package/Hidden/index.js +0 -6
  115. package/Img/index.js +0 -6
  116. package/Img/sc/bare.js +0 -43
  117. package/Img/types.js +0 -6
  118. package/Link/Link.js +0 -13
  119. package/Link/LinkBlank.js +0 -52
  120. package/Link/index.js +0 -7
  121. package/Menu/Menu.js +0 -22
  122. package/Menu/MenuMui.js +0 -165
  123. package/Menu/index.js +0 -6
  124. package/MenuItem/MenuItem.js +0 -31
  125. package/MenuItem/MenuItemMui.js +0 -32
  126. package/MenuItem/index.js +0 -6
  127. package/MenuItem/useMenuItem.js +0 -96
  128. package/Meta/Meta.js +0 -26
  129. package/Meta/index.js +0 -12
  130. package/NoJs/NoJs.js +0 -28
  131. package/NoJs/index.js +0 -12
  132. package/Pagination/PaginationNav.js +0 -126
  133. package/Pagination/PaginationResults.js +0 -45
  134. package/Pagination/index.js +0 -7
  135. package/Pill/Pill.js +0 -62
  136. package/Pill/index.js +0 -6
  137. package/Progress/ProgressCircular.js +0 -62
  138. package/Progress/ProgressLinear.js +0 -53
  139. package/Progress/ProgressOverlay.js +0 -75
  140. package/Progress/index.js +0 -8
  141. package/Rating/Rating.js +0 -188
  142. package/Rating/index.js +0 -85
  143. package/Select/SelectDownshift.js +0 -47
  144. package/Select/components.js +0 -44
  145. package/Select/index.js +0 -13
  146. package/Sidebar/Sidebar.js +0 -74
  147. package/Sidebar/index.js +0 -6
  148. package/Spacing/Spacing.js +0 -55
  149. package/Spacing/index.js +0 -6
  150. package/Sticky/Sticky.js +0 -228
  151. package/Sticky/StickyCss.js +0 -20
  152. package/Sticky/index.js +0 -19
  153. package/Tabs/TabsMui.js +0 -91
  154. package/Tabs/TabsMui.stories.js +0 -38
  155. package/Tabs/index.js +0 -6
  156. package/Tabs/sc/bare.js +0 -86
  157. package/Tabs/sc/index.stories.js +0 -1
  158. package/Tabs/tw/bare.js +0 -45
  159. package/Tabs/tw/index.stories.js +0 -46
  160. package/Tabs/tw/material.js +0 -44
  161. package/Tabs/useTabs.js +0 -66
  162. package/Typography/CopyPasteVisible.js +0 -17
  163. package/Typography/Native.js +0 -90
  164. package/Typography/ReadMore.js +0 -125
  165. package/Typography/TextLoop.js +0 -108
  166. package/Typography/TypeStairs.js +0 -71
  167. package/Typography/index.js +0 -10
  168. package/css/index.js +0 -33
  169. package/helpers/classed.js +0 -66
  170. package/helpers/classed.stories.js +0 -140
  171. package/helpers/createUseMediaQueryWidth.js +0 -193
  172. package/helpers/extend-component.js +0 -32
  173. package/helpers/index.js +0 -9
  174. package/helpers/mergeRefs.js +0 -30
  175. package/hooks/index.js +0 -92
  176. package/hooks/types.js +0 -6
  177. package/hooks/useAsyncFn.js +0 -56
  178. package/hooks/useDateLocale.js +0 -51
  179. package/hooks/useFirstMountState.js +0 -28
  180. package/hooks/useFixedOffset.js +0 -67
  181. package/hooks/useFocus.js +0 -30
  182. package/hooks/useInterval.js +0 -44
  183. package/hooks/useIsomorphicLayoutEffect.js +0 -23
  184. package/hooks/useKeyUp.js +0 -40
  185. package/hooks/useMeasure.js +0 -189
  186. package/hooks/useMountedState.js +0 -31
  187. package/hooks/useNavigateAway.js +0 -69
  188. package/hooks/usePrevious.js +0 -33
  189. package/hooks/usePreviousRef.js +0 -27
  190. package/hooks/useScrollPosition.js +0 -83
  191. package/hooks/useScrollThreshold.js +0 -52
  192. package/hooks/useScrollTo.js +0 -39
  193. package/hooks/useSmoothScroll.js +0 -49
  194. package/hooks/useSpinDelay.js +0 -59
  195. package/hooks/useTraceUpdate.js +0 -39
  196. package/hooks/useUpdateEffect.js +0 -30
  197. package/hooks/useWindowSize.js +0 -43
  198. package/index.js +0 -10
  199. package/m/MotionProvider.js +0 -27
  200. package/m/index.js +0 -10
  201. package/m/lite.js +0 -12
  202. package/m/max.js +0 -12
  203. package/sc/index.js +0 -49
  204. package/scm/index.js +0 -40
  205. package/shared/index.js +0 -13
  206. package/styles/Body.js +0 -28
  207. package/styles/Global.js +0 -55
  208. package/styles/index.js +0 -142
  209. package/styles/media.js +0 -139
  210. package/styles/spacing.js +0 -70
  211. package/styles/styled.js +0 -58
  212. package/styles/theme--vanilla.js +0 -82
  213. package/styles/theme.js +0 -49
  214. package/tw/index.js +0 -33
  215. package/twm/index.js +0 -33
  216. package/types.js +0 -4
package/Rating/Rating.js DELETED
@@ -1,188 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", {
3
- value: true
4
- });
5
- function _export(target, all) {
6
- for(var name in all)Object.defineProperty(target, name, {
7
- enumerable: true,
8
- get: all[name]
9
- });
10
- }
11
- _export(exports, {
12
- RatingStarRoot: function() {
13
- return RatingStarRoot;
14
- },
15
- RatingStar: function() {
16
- return RatingStar;
17
- },
18
- RatingDetails: function() {
19
- return RatingDetails;
20
- },
21
- RatingCount: function() {
22
- return RatingCount;
23
- },
24
- RatingValue: function() {
25
- return RatingValue;
26
- },
27
- RatingRoot: function() {
28
- return RatingRoot;
29
- },
30
- Rating: function() {
31
- return Rating;
32
- }
33
- });
34
- const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
35
- const _jsxruntime = require("react/jsx-runtime");
36
- const _react = require("react");
37
- const _styledcomponents = /*#__PURE__*/ _interop_require_default._(require("styled-components"));
38
- const RatingStarRoot = _styledcomponents.default.svg`
39
- display: inline-block;
40
- vertical-align: middle;
41
- margin-right: 1px;
42
- `;
43
- const RatingStar = ({ value, colorBg = "#FFD84C", colorStroke = "#947813", size, ...props })=>{
44
- const id = (0, _react.useId)();
45
- return /*#__PURE__*/ (0, _jsxruntime.jsxs)(RatingStarRoot, {
46
- viewBox: "0 0 16 16",
47
- "data-value": value,
48
- width: size + "px",
49
- height: size + "px",
50
- ...props,
51
- children: [
52
- /*#__PURE__*/ (0, _jsxruntime.jsx)("defs", {
53
- children: /*#__PURE__*/ (0, _jsxruntime.jsxs)("linearGradient", {
54
- id: id,
55
- x1: "0",
56
- y1: "0",
57
- x2: "1",
58
- y2: "0",
59
- children: [
60
- /*#__PURE__*/ (0, _jsxruntime.jsx)("stop", {
61
- offset: "0",
62
- stopColor: colorBg
63
- }),
64
- /*#__PURE__*/ (0, _jsxruntime.jsx)("stop", {
65
- offset: value,
66
- stopColor: colorBg
67
- }),
68
- /*#__PURE__*/ (0, _jsxruntime.jsx)("stop", {
69
- offset: value,
70
- stopColor: "rgba(255, 255, 255, 0)"
71
- })
72
- ]
73
- })
74
- }),
75
- /*#__PURE__*/ (0, _jsxruntime.jsx)("path", {
76
- stroke: colorStroke,
77
- strokeWidth: "0.5",
78
- fill: `url(#${id})`,
79
- d: "M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.283.95l-3.523 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"
80
- })
81
- ]
82
- });
83
- };
84
- const RatingDetails = _styledcomponents.default.span`
85
- padding-left: 0.5em;
86
- font-size: 12px;
87
- color: var(--grey100);
88
-
89
- &:before {
90
- content: "(";
91
- }
92
- &:after {
93
- content: ")";
94
- }
95
- `;
96
- const RatingCount = _styledcomponents.default.span``;
97
- const RatingValue = _styledcomponents.default.span`
98
- display: none;
99
- `;
100
- const RatingRoot = _styledcomponents.default.div`
101
- display: flex;
102
- align-items: center;
103
-
104
- &:hover ${RatingValue} {
105
- display: inline-block;
106
- }
107
- `;
108
- const Rating = ({ value = 0, count, min = 0, max = 5, showDetails = true, colorBg, colorStroke, starSize = 16 })=>{
109
- const id = (0, _react.useId)();
110
- const [currentValue /* , _setCurrentValue */ ] = (0, _react.useState)(value);
111
- const [stars, setStars] = (0, _react.useState)([]);
112
- const getStars = (0, _react.useCallback)((activeCount)=>{
113
- const stars = [];
114
- for(let currentStar = min + 1; currentStar < max + 1; currentStar++){
115
- let starValue;
116
- const roundedActiveCount = Math.floor(activeCount);
117
- // we have a rating of 3.4, when we get to the 4th star:
118
- if (roundedActiveCount === currentStar - 1) {
119
- starValue = 1 - (currentStar - activeCount);
120
- } else if (roundedActiveCount >= currentStar) {
121
- starValue = 1;
122
- } else {
123
- starValue = 0;
124
- }
125
- stars.push({
126
- value: starValue
127
- });
128
- }
129
- return stars;
130
- }, [
131
- min,
132
- max
133
- ]);
134
- (0, _react.useEffect)(()=>{
135
- setStars(getStars(currentValue));
136
- }, [
137
- currentValue,
138
- getStars
139
- ]);
140
- // function updateStars(index) {
141
- // var currentActive = stars.filter((x) => x.active);
142
- // if (index !== currentActive.length) {
143
- // setStars(getStars(index));
144
- // }
145
- // }
146
- // function handleMouseOver(event) {
147
- // let index = Number(event.currentTarget.getAttribute("data-idx")) + 1;
148
- // updateStars(index);
149
- // }
150
- // function handleMouseLeave() {
151
- // setStars(getStars());
152
- // }
153
- // const handleClick = useCallback((event) => {
154
- // let index = Number(event.currentTarget.getAttribute("data-idx"));
155
- // let value = index = index + 1;
156
- // if (value !== currentValue) {
157
- // setStars(getStars(value));
158
- // setCurrentValue(value);
159
- // onChange(value);
160
- // }
161
- // }, [onChange];
162
- return /*#__PURE__*/ (0, _jsxruntime.jsxs)(RatingRoot, {
163
- children: [
164
- stars.map((star, idx)=>/*#__PURE__*/ (0, _jsxruntime.jsx)(RatingStar, {
165
- idx: idx,
166
- dataIdx: idx,
167
- size: starSize,
168
- // onMouseOver={handleMouseOver}
169
- // onMouseLeave={handleMouseLeave}
170
- // onClick={handleClick}
171
- value: star.value,
172
- colorBg: colorBg,
173
- colorStroke: colorStroke
174
- }, id + idx)),
175
- " ",
176
- showDetails && count && /*#__PURE__*/ (0, _jsxruntime.jsxs)(RatingDetails, {
177
- children: [
178
- /*#__PURE__*/ (0, _jsxruntime.jsx)(RatingCount, {
179
- children: count
180
- }),
181
- /*#__PURE__*/ (0, _jsxruntime.jsx)(RatingValue, {
182
- children: ` - ${value}`
183
- })
184
- ]
185
- })
186
- ]
187
- });
188
- };
package/Rating/index.js DELETED
@@ -1,85 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", {
3
- value: true
4
- });
5
- function _export(target, all) {
6
- for(var name in all)Object.defineProperty(target, name, {
7
- enumerable: true,
8
- get: all[name]
9
- });
10
- }
11
- _export(exports, {
12
- getRatingWord: function() {
13
- return getRatingWord;
14
- },
15
- getRatingValue: function() {
16
- return getRatingValue;
17
- },
18
- convertRange: function() {
19
- return convertRange;
20
- },
21
- deriveRating: function() {
22
- return deriveRating;
23
- }
24
- });
25
- const _export_star = require("@swc/helpers/_/_export_star");
26
- _export_star._(require("./Rating"), exports);
27
- const RATING_WORDS = {
28
- 0: "Worst",
29
- 1: "Bad",
30
- 2: "Mediocre",
31
- 3: "Good",
32
- 4: "Great",
33
- 4.5: "Excellent",
34
- 5: "Best"
35
- };
36
- const getRatingWord = (value, precision = 0.5)=>{
37
- let buffer = 0;
38
- let word;
39
- while(buffer < value){
40
- // @ts-expect-error can't remember
41
- word = RATING_WORDS[buffer];
42
- buffer += precision;
43
- }
44
- return word;
45
- };
46
- const getRatingValue = (value)=>{
47
- const converted = convertRange(value, [
48
- 0,
49
- 5
50
- ], [
51
- 0,
52
- 10
53
- ]);
54
- if (converted % 1 === 0) {
55
- return converted;
56
- }
57
- return converted.toFixed(1);
58
- };
59
- function convertRange(value, r1, r2) {
60
- return (value - r1[0]) * (r2[1] - r2[0]) / (r1[1] - r1[0]) + r2[0];
61
- }
62
- const deriveRating = (title, date, minValue = 3.8, maxValue = 5, minQuantity = 9)=>{
63
- const entityTime = date.getTime();
64
- const nowTime = new Date().getTime();
65
- const length = title.length;
66
- const value = Number(convertRange(length, [
67
- 0,
68
- 90
69
- ], [
70
- minValue,
71
- maxValue
72
- ]).toFixed(2));
73
- const timeDifference = convertRange(nowTime - entityTime, [
74
- 0,
75
- 10000000000000
76
- ], [
77
- minQuantity,
78
- 999999
79
- ]);
80
- const count = Math.round(timeDifference / length);
81
- return {
82
- value,
83
- count
84
- };
85
- };
@@ -1,47 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", {
3
- value: true
4
- });
5
- Object.defineProperty(exports, "Select", {
6
- enumerable: true,
7
- get: function() {
8
- return Select;
9
- }
10
- });
11
- const Select = null; // import { useSelect } from "downshift";
12
- // export type SelectProps = {
13
- // options?: Option[];
14
- // };
15
- // export const Select = ({ options = [] }: SelectProps) => {
16
- // const {
17
- // isOpen,
18
- // selectedItem,
19
- // getToggleButtonProps,
20
- // getLabelProps,
21
- // getMenuProps,
22
- // highlightedIndex,
23
- // getItemProps,
24
- // } = useSelect({ items: options });
25
- // return (
26
- // <div>
27
- // <label {...getLabelProps()}>Choose an element:</label>
28
- // <button type="button" {...getToggleButtonProps()}>
29
- // {selectedItem || "Elements"}
30
- // </button>
31
- // <ul {...getMenuProps()}>
32
- // {isOpen &&
33
- // options.map((item, index) => (
34
- // <li
35
- // style={
36
- // highlightedIndex === index ? { backgroundColor: "#bde4ff" } : {}
37
- // }
38
- // key={`${item.value}${index}`}
39
- // {...getItemProps({ item, index })}
40
- // >
41
- // {item.label}
42
- // </li>
43
- // ))}
44
- // </ul>
45
- // </div>
46
- // );
47
- // };
@@ -1,44 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", {
3
- value: true
4
- });
5
- function _export(target, all) {
6
- for(var name in all)Object.defineProperty(target, name, {
7
- enumerable: true,
8
- get: all[name]
9
- });
10
- }
11
- _export(exports, {
12
- SelectArrowStyled: function() {
13
- return SelectArrowStyled;
14
- },
15
- SelectArrow: function() {
16
- return SelectArrow;
17
- }
18
- });
19
- const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
20
- const _jsxruntime = require("react/jsx-runtime");
21
- const _framermotion = require("framer-motion");
22
- const _react = require("react");
23
- const _bs = require("react-icons/bs");
24
- const _styledcomponents = /*#__PURE__*/ _interop_require_default._(require("styled-components"));
25
- const SelectArrowStyled = (0, _styledcomponents.default)(_framermotion.m.span)`
26
- display: inline-flex;
27
- align-items: center;
28
- justify-content: center;
29
- width: 2em;
30
-
31
- &:not([disabled]) {
32
- cursor: pointer;
33
- }
34
- `;
35
- const SelectArrow = /*#__PURE__*/ (0, _react.forwardRef)(function SelectArrow({ isOpen, ...props }, ref) {
36
- return /*#__PURE__*/ (0, _jsxruntime.jsx)(SelectArrowStyled, {
37
- animate: {
38
- rotate: isOpen ? 180 : 0
39
- },
40
- ref: ref,
41
- ...props,
42
- children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_bs.BsBoxArrowInDown, {})
43
- });
44
- });
package/Select/index.js DELETED
@@ -1,13 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", {
3
- value: true
4
- });
5
- Object.defineProperty(exports, "Select", {
6
- enumerable: true,
7
- get: function() {
8
- return _SelectDownshift.Select;
9
- }
10
- });
11
- const _SelectDownshift = require("./SelectDownshift");
12
- // export type { SelectProps } from "./SelectReach";
13
- // export { Select } from "./SelectReach";
@@ -1,74 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", {
3
- value: true
4
- });
5
- Object.defineProperty(exports, "Sidebar", {
6
- enumerable: true,
7
- get: function() {
8
- return Sidebar;
9
- }
10
- });
11
- const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
12
- const _jsxruntime = require("react/jsx-runtime");
13
- const _react = require("react");
14
- const _cg = require("react-icons/cg");
15
- const _gr = require("react-icons/gr");
16
- const _styledcomponents = /*#__PURE__*/ _interop_require_default._(require("styled-components"));
17
- const _Buttons = require("../Buttons");
18
- const _Header = require("../Header");
19
- const _media = require("../styles/media");
20
- const SidebarWrapper = _styledcomponents.default.div`
21
- ${(p)=>`${_media.max.md} {
22
- z-index: 20;
23
- display: flex;
24
- flex-direction: column;
25
- position: fixed;
26
- right: 0;
27
- left: var(--gutter-half);
28
- top: ${p.$top || 0}px;
29
- bottom: 0;
30
- padding: var(--gutter-half);
31
- transform: ${p.$open ? `translateX(0)` : `translateX(100%)`};
32
- transition: transform .18s ease-in-out, box-shadow .18s ease-in-out;
33
- background: white;
34
- box-shadow: ${p.$open ? `0 0 0 100vh rgba(0, 0, 0, .3)` : `0 0 100vh rgba(0, 0, 0, 0)`};
35
- will-change: transform, box-shadow;
36
- pointer-events: ${p.$open ? "all" : "none"}
37
- }`}
38
- `;
39
- const SidebarToggle = _styledcomponents.default.span`
40
- z-index: 21;
41
- position: fixed;
42
- right: var(--gutter-half);
43
- bottom: var(--gutter-half);
44
- ${_media.min.md} {
45
- display: none;
46
- }
47
-
48
- path {
49
- stroke: currentColor;
50
- }
51
- `;
52
- const Sidebar = ({ children })=>{
53
- const [open, setOpen] = (0, _react.useState)(false);
54
- const [, , headerHeight] = (0, _Header.useHeader)();
55
- const handleClickToggle = (0, _react.useCallback)(()=>{
56
- setOpen((prevOpen)=>!prevOpen);
57
- }, []);
58
- return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
59
- children: [
60
- /*#__PURE__*/ (0, _jsxruntime.jsx)(SidebarToggle, {
61
- onClick: handleClickToggle,
62
- children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_Buttons.IconButtonFab, {
63
- $variant: "contained",
64
- children: open ? /*#__PURE__*/ (0, _jsxruntime.jsx)(_cg.CgCloseR, {}) : /*#__PURE__*/ (0, _jsxruntime.jsx)(_gr.GrFolderOpen, {})
65
- })
66
- }),
67
- /*#__PURE__*/ (0, _jsxruntime.jsx)(SidebarWrapper, {
68
- $open: open,
69
- $top: headerHeight,
70
- children: children
71
- })
72
- ]
73
- });
74
- };
package/Sidebar/index.js DELETED
@@ -1,6 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", {
3
- value: true
4
- });
5
- const _export_star = require("@swc/helpers/_/_export_star");
6
- _export_star._(require("./Sidebar"), exports);
@@ -1,55 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", {
3
- value: true
4
- });
5
- Object.defineProperty(exports, "Spacing", {
6
- enumerable: true,
7
- get: function() {
8
- return Spacing;
9
- }
10
- });
11
- const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
12
- const _jsxruntime = require("react/jsx-runtime");
13
- const _styledcomponents = /*#__PURE__*/ _interop_require_default._(require("styled-components"));
14
- const _isUndefined = /*#__PURE__*/ _interop_require_default._(require("@koine/utils/isUndefined"));
15
- const _spacing = require("../styles/spacing");
16
- const Root = _styledcomponents.default.div`
17
- ${(p)=>p.$top && _spacing.spacingTop.call(p.theme, ...p.$top)}
18
- ${(p)=>p.$bottom && _spacing.spacingBottom.call(p.theme, ...p.$bottom)}
19
- `;
20
- const extractDirectionArgs = (raw)=>{
21
- const [size, factor, property, devices] = raw.split(":");
22
- const factorArg = (0, _isUndefined.default)(factor) ? undefined : parseFloat(factor);
23
- const devicesArg = devices?.split(",");
24
- return [
25
- size,
26
- factorArg,
27
- property,
28
- devicesArg
29
- ];
30
- };
31
- const Spacing = ({ top, bottom, vertical, ...props })=>{
32
- let $top;
33
- let $bottom;
34
- if (top) {
35
- $top = extractDirectionArgs(top);
36
- }
37
- if (bottom) {
38
- $bottom = extractDirectionArgs(bottom);
39
- }
40
- if (vertical) {
41
- $top = extractDirectionArgs(vertical);
42
- $bottom = $top;
43
- }
44
- if (!$top && !$bottom && !vertical) {
45
- // eslint-disable-next-line react/jsx-no-useless-fragment
46
- return /*#__PURE__*/ (0, _jsxruntime.jsx)(_jsxruntime.Fragment, {
47
- children: props.children
48
- });
49
- }
50
- return /*#__PURE__*/ (0, _jsxruntime.jsx)(Root, {
51
- $top: $top,
52
- $bottom: $bottom,
53
- ...props
54
- });
55
- };
package/Spacing/index.js DELETED
@@ -1,6 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", {
3
- value: true
4
- });
5
- const _export_star = require("@swc/helpers/_/_export_star");
6
- _export_star._(require("./Spacing"), exports);