@regardio/react 0.5.7 → 0.6.0

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 (180) hide show
  1. package/dist/background-slideshow/index.d.mts +36 -0
  2. package/dist/background-slideshow/index.mjs +110 -0
  3. package/dist/blurry-gradient/index.d.mts +17 -0
  4. package/dist/blurry-gradient/index.mjs +93 -0
  5. package/dist/button/index.d.mts +2 -0
  6. package/dist/button/index.mjs +3 -0
  7. package/dist/button-BiSQpBbc.mjs +129 -0
  8. package/dist/carousel/index.d.mts +40 -0
  9. package/dist/carousel/index.mjs +141 -0
  10. package/dist/checkbox/index.d.mts +37 -0
  11. package/dist/checkbox/index.mjs +70 -0
  12. package/dist/checkbox-group/index.d.mts +17 -0
  13. package/dist/checkbox-group/index.mjs +29 -0
  14. package/dist/chunk-BTpB_u-K.mjs +18 -0
  15. package/dist/countdown/index.d.mts +6 -0
  16. package/dist/countdown/index.mjs +58 -0
  17. package/dist/field/index.d.mts +66 -0
  18. package/dist/field/index.mjs +115 -0
  19. package/dist/fieldset/index.d.mts +33 -0
  20. package/dist/fieldset/index.mjs +61 -0
  21. package/dist/form/index.d.mts +22 -0
  22. package/dist/form/index.mjs +31 -0
  23. package/dist/generic-error/{index.d.ts → index.d.mts} +22 -18
  24. package/dist/generic-error/index.mjs +57 -0
  25. package/dist/grid/index.d.mts +1197 -0
  26. package/dist/grid/index.mjs +221 -0
  27. package/dist/heading/index.d.mts +31 -0
  28. package/dist/heading/index.mjs +29 -0
  29. package/dist/highlight/index.d.mts +18 -0
  30. package/dist/highlight/index.mjs +35 -0
  31. package/dist/hooks/{use-current-route-data.d.ts → use-current-route-data.d.mts} +3 -2
  32. package/dist/hooks/use-current-route-data.mjs +20 -0
  33. package/dist/hooks/{use-focus-search.d.ts → use-focus-search.d.mts} +4 -3
  34. package/dist/hooks/use-focus-search.mjs +21 -0
  35. package/dist/hooks/{use-matches-data.d.ts → use-matches-data.d.mts} +3 -2
  36. package/dist/hooks/use-matches-data.mjs +21 -0
  37. package/dist/hooks/{use-media-query.d.ts → use-media-query.d.mts} +3 -2
  38. package/dist/hooks/use-media-query.mjs +26 -0
  39. package/dist/hooks/use-mobile.d.mts +4 -0
  40. package/dist/hooks/use-mobile.mjs +20 -0
  41. package/dist/hooks/use-nonce.d.mts +8 -0
  42. package/dist/hooks/use-nonce.mjs +13 -0
  43. package/dist/hooks/{use-orientation.d.ts → use-orientation.d.mts} +3 -2
  44. package/dist/hooks/use-orientation.mjs +30 -0
  45. package/dist/hooks/use-user.d.mts +55 -0
  46. package/dist/hooks/use-user.mjs +39 -0
  47. package/dist/icon-button/index.d.mts +29 -0
  48. package/dist/icon-button/index.mjs +36 -0
  49. package/dist/if/index.d.mts +15 -0
  50. package/dist/if/index.mjs +21 -0
  51. package/dist/iframe/index.d.mts +11 -0
  52. package/dist/iframe/index.mjs +15 -0
  53. package/dist/index-Bm-tWhsb.d.mts +30 -0
  54. package/dist/index-YT2CkvL6.d.mts +36 -0
  55. package/dist/input/index.d.mts +2 -0
  56. package/dist/input/index.mjs +3 -0
  57. package/dist/input-CtR6aRVi.mjs +73 -0
  58. package/dist/link/index.d.mts +73 -0
  59. package/dist/link/index.mjs +129 -0
  60. package/dist/list/index.d.mts +71 -0
  61. package/dist/list/index.mjs +54 -0
  62. package/dist/markdown-container/index.d.mts +23 -0
  63. package/dist/markdown-container/index.mjs +71 -0
  64. package/dist/password-input/index.d.mts +24 -0
  65. package/dist/password-input/index.mjs +92 -0
  66. package/dist/picture/{index.d.ts → index.d.mts} +21 -20
  67. package/dist/picture/index.mjs +3 -0
  68. package/dist/picture-DkX3W5zl.mjs +69 -0
  69. package/dist/protected-email/{index.d.ts → index.d.mts} +14 -8
  70. package/dist/protected-email/index.mjs +37 -0
  71. package/dist/radio/index.d.mts +37 -0
  72. package/dist/radio/index.mjs +72 -0
  73. package/dist/radio-group/index.d.mts +17 -0
  74. package/dist/radio-group/index.mjs +29 -0
  75. package/dist/slider/index.d.mts +85 -0
  76. package/dist/slider/index.mjs +133 -0
  77. package/dist/switch/index.d.mts +38 -0
  78. package/dist/switch/index.mjs +87 -0
  79. package/dist/text/index.d.mts +26 -0
  80. package/dist/text/index.mjs +32 -0
  81. package/dist/text-CPlUND-Z.mjs +58 -0
  82. package/dist/toggle/index.d.mts +59 -0
  83. package/dist/toggle/index.mjs +82 -0
  84. package/dist/utils/author/index.d.mts +4 -0
  85. package/dist/utils/author/index.mjs +26 -0
  86. package/dist/utils/text/{index.d.ts → index.d.mts} +4 -3
  87. package/dist/utils/text/index.mjs +3 -0
  88. package/package.json +5 -117
  89. package/src/button/button.stories.tsx +161 -0
  90. package/src/button/button.test.tsx +73 -0
  91. package/src/button/button.tsx +112 -0
  92. package/src/button/index.ts +2 -0
  93. package/src/carousel/carousel-next.tsx +2 -2
  94. package/src/carousel/carousel-previous.tsx +2 -2
  95. package/src/checkbox/checkbox.stories.tsx +118 -0
  96. package/src/checkbox/checkbox.tsx +91 -0
  97. package/src/checkbox/index.ts +2 -0
  98. package/src/checkbox-group/checkbox-group.tsx +40 -0
  99. package/src/checkbox-group/index.ts +2 -0
  100. package/src/field/field.stories.tsx +105 -0
  101. package/src/field/field.test.tsx +61 -0
  102. package/src/field/field.tsx +165 -0
  103. package/src/field/index.ts +12 -0
  104. package/src/fieldset/fieldset.stories.tsx +204 -0
  105. package/src/fieldset/fieldset.test.tsx +63 -0
  106. package/src/fieldset/fieldset.tsx +75 -0
  107. package/src/fieldset/index.ts +7 -0
  108. package/src/form/form.stories.tsx +230 -0
  109. package/src/form/form.test.tsx +68 -0
  110. package/src/form/form.tsx +38 -0
  111. package/src/form/index.ts +2 -0
  112. package/src/icon-button/icon-button.stories.tsx +128 -7
  113. package/src/icon-button/icon-button.test.tsx +152 -0
  114. package/src/icon-button/icon-button.tsx +43 -9
  115. package/src/input/index.ts +2 -0
  116. package/src/input/input.stories.tsx +151 -0
  117. package/src/input/input.test.tsx +65 -0
  118. package/src/input/input.tsx +113 -0
  119. package/src/password-input/index.ts +1 -1
  120. package/src/password-input/password-input.tsx +104 -27
  121. package/src/radio/index.ts +2 -0
  122. package/src/radio/radio.tsx +92 -0
  123. package/src/radio-group/index.ts +2 -0
  124. package/src/radio-group/radio-group.tsx +36 -0
  125. package/src/slider/index.ts +18 -0
  126. package/src/slider/slider.tsx +179 -0
  127. package/src/switch/index.ts +2 -0
  128. package/src/switch/switch.stories.tsx +118 -0
  129. package/src/switch/switch.tsx +101 -0
  130. package/src/toggle/index.ts +2 -0
  131. package/src/toggle/toggle.stories.tsx +232 -0
  132. package/src/toggle/toggle.test.tsx +149 -0
  133. package/src/toggle/toggle.tsx +88 -0
  134. package/dist/background-slideshow/index.d.ts +0 -24
  135. package/dist/background-slideshow/index.js +0 -165
  136. package/dist/blurry-gradient/index.d.ts +0 -16
  137. package/dist/blurry-gradient/index.js +0 -128
  138. package/dist/carousel/index.d.ts +0 -36
  139. package/dist/carousel/index.js +0 -171
  140. package/dist/countdown/index.d.ts +0 -5
  141. package/dist/countdown/index.js +0 -73
  142. package/dist/generic-error/index.js +0 -47
  143. package/dist/grid/index.d.ts +0 -1196
  144. package/dist/grid/index.js +0 -239
  145. package/dist/heading/index.d.ts +0 -24
  146. package/dist/heading/index.js +0 -99
  147. package/dist/highlight/index.d.ts +0 -13
  148. package/dist/highlight/index.js +0 -59
  149. package/dist/hooks/use-current-route-data.js +0 -16
  150. package/dist/hooks/use-focus-search.js +0 -19
  151. package/dist/hooks/use-matches-data.js +0 -15
  152. package/dist/hooks/use-media-query.js +0 -20
  153. package/dist/hooks/use-mobile.d.ts +0 -3
  154. package/dist/hooks/use-mobile.js +0 -19
  155. package/dist/hooks/use-nonce.d.ts +0 -7
  156. package/dist/hooks/use-nonce.js +0 -8
  157. package/dist/hooks/use-orientation.js +0 -29
  158. package/dist/hooks/use-user.d.ts +0 -50
  159. package/dist/hooks/use-user.js +0 -25
  160. package/dist/icon-button/index.d.ts +0 -9
  161. package/dist/icon-button/index.js +0 -17
  162. package/dist/if/index.d.ts +0 -10
  163. package/dist/if/index.js +0 -24
  164. package/dist/iframe/index.d.ts +0 -10
  165. package/dist/iframe/index.js +0 -17
  166. package/dist/link/index.d.ts +0 -55
  167. package/dist/link/index.js +0 -195
  168. package/dist/list/index.d.ts +0 -69
  169. package/dist/list/index.js +0 -65
  170. package/dist/markdown-container/index.d.ts +0 -22
  171. package/dist/markdown-container/index.js +0 -128
  172. package/dist/password-input/index.d.ts +0 -11
  173. package/dist/password-input/index.js +0 -46
  174. package/dist/picture/index.js +0 -68
  175. package/dist/protected-email/index.js +0 -30
  176. package/dist/text/index.d.ts +0 -20
  177. package/dist/text/index.js +0 -38
  178. package/dist/utils/author/index.d.ts +0 -3
  179. package/dist/utils/author/index.js +0 -33
  180. package/dist/utils/text/index.js +0 -73
@@ -1,68 +0,0 @@
1
- import { cn } from '@regardio/tailwind/utils';
2
- import { jsx, jsxs } from 'react/jsx-runtime';
3
-
4
- // src/picture/picture.tsx
5
- var screenSizeVariants = {
6
- lg: 1280,
7
- max: 1920,
8
- md: 960,
9
- min: 360,
10
- sm: 640,
11
- xl: 1600,
12
- xs: 480
13
- };
14
- var Picture = ({
15
- alt,
16
- baseUrl,
17
- className,
18
- formats,
19
- imgClassName,
20
- placeholder = "{format}",
21
- sizes = "(max-width: 480px) 480px, (max-width: 768px) 600px, (max-width: 1200px) 1024px, 1920px"
22
- }) => {
23
- const imageFormats = formats || [
24
- { size: "480x360", width: 480 },
25
- { size: "600x600", width: 600 },
26
- { size: "1024x768", width: 1024 },
27
- { size: "1920x1440", width: 1920 }
28
- ];
29
- if (imageFormats.length === 0) {
30
- return null;
31
- }
32
- const isSimpleImage = imageFormats.length === 1 && imageFormats[0]?.size === "" || !baseUrl.includes(placeholder);
33
- if (isSimpleImage) {
34
- return /* @__PURE__ */ jsx(
35
- "img",
36
- {
37
- alt,
38
- className: cn(className, imgClassName),
39
- src: baseUrl
40
- }
41
- );
42
- }
43
- const srcSet = imageFormats.map(({ size, width }) => {
44
- const url = baseUrl.replace(placeholder, size);
45
- return `${url} ${width}w`;
46
- }).join(", ");
47
- const defaultFormat = imageFormats[0];
48
- const defaultSrc = defaultFormat ? baseUrl.replace(placeholder, defaultFormat.size) : baseUrl;
49
- return /* @__PURE__ */ jsxs("picture", { className, children: [
50
- /* @__PURE__ */ jsx(
51
- "source",
52
- {
53
- sizes,
54
- srcSet
55
- }
56
- ),
57
- /* @__PURE__ */ jsx(
58
- "img",
59
- {
60
- alt,
61
- className: cn(imgClassName),
62
- src: defaultSrc
63
- }
64
- )
65
- ] });
66
- };
67
-
68
- export { Picture, screenSizeVariants };
@@ -1,30 +0,0 @@
1
- import { useState, useEffect } from 'react';
2
- import { jsx } from 'react/jsx-runtime';
3
-
4
- // src/protected-email/protected-email.tsx
5
- function ProtectedEmail({ username, domain, text, className }) {
6
- const [mounted, setMounted] = useState(false);
7
- useEffect(() => {
8
- setMounted(true);
9
- }, []);
10
- const fallbackText = text || `${username}(at)${domain}`;
11
- const handleClick = (e) => {
12
- if (mounted) {
13
- window.location.href = `mailto:${username}@${domain}`;
14
- e.preventDefault();
15
- }
16
- };
17
- return /* @__PURE__ */ jsx(
18
- "a",
19
- {
20
- "aria-label": `Email address: ${username} at ${domain}`,
21
- className,
22
- "data-email-protected": "true",
23
- href: mounted ? "#email-protected" : void 0,
24
- onClick: handleClick,
25
- children: fallbackText
26
- }
27
- );
28
- }
29
-
30
- export { ProtectedEmail };
@@ -1,20 +0,0 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { ComponentProps } from 'react';
3
-
4
- declare const themeColorVariants: {
5
- readonly primary: readonly [];
6
- };
7
- declare const textVariants: {
8
- readonly code: readonly ["font-light", "font-monospace"];
9
- readonly primary: readonly [];
10
- readonly subtitle: readonly ["text-lg"];
11
- };
12
- type TextThemeColor = keyof typeof themeColorVariants;
13
- type TextVariant = keyof typeof textVariants;
14
- interface TextProps extends ComponentProps<'p'> {
15
- themeColor?: TextThemeColor;
16
- variant?: TextVariant;
17
- }
18
- declare const Text: ({ children, className, variant, themeColor }: TextProps) => react_jsx_runtime.JSX.Element;
19
-
20
- export { Text, type TextProps };
@@ -1,38 +0,0 @@
1
- import { tv } from '@regardio/tailwind/utils';
2
- import { jsx } from 'react/jsx-runtime';
3
-
4
- // src/text/text.tsx
5
- var themeColorVariants = {
6
- primary: []
7
- };
8
- var textVariants = {
9
- code: ["font-light", "font-monospace"],
10
- primary: [],
11
- subtitle: ["text-lg"]
12
- };
13
- var text = tv({
14
- base: ["relative", "block"],
15
- defaultVariants: {
16
- themeColor: "primary",
17
- variant: "primary"
18
- },
19
- variants: {
20
- themeColor: themeColorVariants,
21
- variant: textVariants
22
- }
23
- });
24
- var Text = ({ children, className, variant, themeColor }) => {
25
- return /* @__PURE__ */ jsx(
26
- "div",
27
- {
28
- className: text({
29
- className,
30
- themeColor,
31
- variant
32
- }),
33
- children
34
- }
35
- );
36
- };
37
-
38
- export { Text };
@@ -1,3 +0,0 @@
1
- declare function generateLinkFromAuthorString(input: string): React.ReactNode;
2
-
3
- export { generateLinkFromAuthorString };
@@ -1,33 +0,0 @@
1
- import { parseAuthorString } from '@regardio/js/text';
2
- import { jsx } from 'react/jsx-runtime';
3
-
4
- // src/utils/author/author.tsx
5
- function generateLinkFromAuthorString(input) {
6
- const match = parseAuthorString(input);
7
- if (match.name) {
8
- if (match.email) {
9
- return /* @__PURE__ */ jsx(
10
- "a",
11
- {
12
- className: "u-email p-name",
13
- href: `mailto:${match.email}`,
14
- children: match.name
15
- }
16
- );
17
- }
18
- if (match.url && (match.url.startsWith("/") || match.url.startsWith("http"))) {
19
- return /* @__PURE__ */ jsx(
20
- "a",
21
- {
22
- className: "u-url p-name",
23
- href: match.url,
24
- children: match.name
25
- }
26
- );
27
- }
28
- return /* @__PURE__ */ jsx("span", { className: "p-name", children: match.name });
29
- }
30
- return;
31
- }
32
-
33
- export { generateLinkFromAuthorString };
@@ -1,73 +0,0 @@
1
- import { replaceShyInString, typographicQuotes, splitIntoSentences } from '@regardio/js/text';
2
- import React, { isValidElement, cloneElement } from 'react';
3
- import { jsx, jsxs } from 'react/jsx-runtime';
4
-
5
- // src/utils/text/text.tsx
6
- var lowerCaseSzett = (text, _returnType) => {
7
- const processString = (str) => {
8
- const parts = str.split(/(ß)/g);
9
- return parts.map(
10
- (part, index) => part === "\xDF" ? /* @__PURE__ */ jsx(
11
- "span",
12
- {
13
- className: "lowercase",
14
- children: part
15
- },
16
- index.toString()
17
- ) : part
18
- );
19
- };
20
- if (typeof text === "string") {
21
- return processString(text);
22
- }
23
- if (isValidElement(text)) {
24
- const element = text;
25
- const { children, ...props } = element.props;
26
- return cloneElement(element, {
27
- ...props,
28
- children: lowerCaseSzett(children)
29
- });
30
- }
31
- if (Array.isArray(text)) {
32
- return text.map((child, index) => /* @__PURE__ */ jsx(React.Fragment, { children: lowerCaseSzett(child) }, index.toString()));
33
- }
34
- return text;
35
- };
36
- function replaceShyInReactNode(node) {
37
- if (typeof node === "string") {
38
- return node.replace(/\u00AD/g, "");
39
- }
40
- if (isValidElement(node)) {
41
- const element = node;
42
- const { children, ...props } = element.props;
43
- return cloneElement(element, {
44
- ...props,
45
- children: replaceShyInReactNode(children)
46
- });
47
- }
48
- if (Array.isArray(node)) {
49
- return node.map((child, index) => /* @__PURE__ */ jsx(React.Fragment, { children: replaceShyInReactNode(child) }, index.toString()));
50
- }
51
- return node;
52
- }
53
- function shy(input) {
54
- if (input === null) {
55
- return null;
56
- }
57
- if (typeof input === "string") {
58
- return replaceShyInString(input);
59
- }
60
- return replaceShyInReactNode(input);
61
- }
62
- function replaceSpecialChars(text, locale) {
63
- return shy(typographicQuotes(text, locale));
64
- }
65
- function wrapSentences(text) {
66
- const sentences = splitIntoSentences(text);
67
- return sentences.map((sentence, index) => /* @__PURE__ */ jsxs("span", { children: [
68
- sentence,
69
- " "
70
- ] }, index.toString()));
71
- }
72
-
73
- export { lowerCaseSzett, replaceSpecialChars, shy, wrapSentences };