solid-uix 0.4.0 → 0.5.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.
- package/README.md +22 -2
- package/dist/main.css +1 -1
- package/dist/main.js +233 -538
- package/dist/main.js.map +1 -0
- package/dist/ssr/main.js +395 -0
- package/dist/ssr/main.js.map +1 -0
- package/dist/{button → types/button}/button.d.ts +2 -0
- package/dist/{field → types/field}/field.types.d.ts +1 -1
- package/dist/types/link/link.d.ts +2 -0
- package/dist/types/link/link.stories.d.ts +48 -0
- package/dist/types/link/link.types.d.ts +6 -0
- package/dist/{main.d.ts → types/main.d.ts} +3 -1
- package/dist/types/text_area/text_area.d.ts +2 -0
- package/dist/types/text_area/text_area.stories.d.ts +38 -0
- package/dist/types/text_area/text_area.types.d.ts +4 -0
- package/dist/types/text_input/text_input.stories.d.ts +30 -0
- package/package.json +10 -9
- package/dist/main.umd.cjs +0 -1
- /package/dist/{button → types/button}/button.types.d.ts +0 -0
- /package/dist/{checkbox → types/checkbox}/checkbox.d.ts +0 -0
- /package/dist/{checkbox → types/checkbox}/checkbox.stories.d.ts +0 -0
- /package/dist/{checkbox → types/checkbox}/checkbox.types.d.ts +0 -0
- /package/dist/{dialog → types/dialog}/dialog.d.ts +0 -0
- /package/dist/{dialog → types/dialog}/dialog.types.d.ts +0 -0
- /package/dist/{dialog → types/dialog}/provider/context.d.ts +0 -0
- /package/dist/{dialog → types/dialog}/provider/context.types.d.ts +0 -0
- /package/dist/{dialog → types/dialog}/provider/provider.d.ts +0 -0
- /package/dist/{dialog → types/dialog}/provider/provider.types.d.ts +0 -0
- /package/dist/{field → types/field}/field.context.d.ts +0 -0
- /package/dist/{field → types/field}/field.d.ts +0 -0
- /package/dist/{list → types/list}/list.d.ts +0 -0
- /package/dist/{list → types/list}/list.types.d.ts +0 -0
- /package/dist/{select → types/select}/select.d.ts +0 -0
- /package/dist/{select → types/select}/select.types.d.ts +0 -0
- /package/dist/{text_input → types/text_input}/text_input.d.ts +0 -0
- /package/dist/{text_input → types/text_input}/text_input.types.d.ts +0 -0
- /package/dist/{utils → types/utils}/cls.d.ts +0 -0
- /package/dist/{utils → types/utils}/message.d.ts +0 -0
- /package/dist/{utils → types/utils}/noop.d.ts +0 -0
- /package/dist/{utils → types/utils}/string.d.ts +0 -0
package/README.md
CHANGED
|
@@ -18,9 +18,9 @@ Solid UIX uses the Inter font by default. See [Setup — Fonts](/docs/setup_font
|
|
|
18
18
|
|
|
19
19
|
Import components and styles.
|
|
20
20
|
|
|
21
|
-
```
|
|
21
|
+
```jsx
|
|
22
22
|
import { Button, TextInput, Checkbox, Field } from "solid-uix";
|
|
23
|
-
import "solid-uix/
|
|
23
|
+
import "solid-uix/css";
|
|
24
24
|
|
|
25
25
|
const Example = () => {
|
|
26
26
|
return (
|
|
@@ -36,3 +36,23 @@ const Example = () => {
|
|
|
36
36
|
);
|
|
37
37
|
};
|
|
38
38
|
```
|
|
39
|
+
|
|
40
|
+
### Server Side Rendering
|
|
41
|
+
|
|
42
|
+
Import components from `solid-uix/ssr`
|
|
43
|
+
|
|
44
|
+
```js
|
|
45
|
+
import { Button, TextInput, Checkbox, Field } from "solid-uix/ssr";
|
|
46
|
+
```
|
|
47
|
+
|
|
48
|
+
Resolve styles as URL and append metadata element to document head.
|
|
49
|
+
Stylesheet will be preloaded.
|
|
50
|
+
See [@solidjs/meta Link](https://docs.solidjs.com/solid-meta/reference/meta/link)
|
|
51
|
+
|
|
52
|
+
```jsx
|
|
53
|
+
import styles from "solid-uix/css?url";
|
|
54
|
+
|
|
55
|
+
<head>
|
|
56
|
+
<link rel="stylesheet" href={style} />
|
|
57
|
+
</head>;
|
|
58
|
+
```
|
package/dist/main.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--colors-black-100: #efeff4;--colors-black-150: #d9d9df;--colors-black-200: #c1c2cb;--colors-black-300: #acadb6;--colors-black-400: #9495a0;--colors-black-500: #777987;--colors-black-600: #61636d;--colors-black-700: #494a56;--colors-black-800: #22232a;--colors-black-850: #17181e;--colors-black-900: #0a0b11;--colors-white-50-transparent: #ffffff0d;--colors-background: #191d3a;--colors-backdrop: #00000080;--colors-accent-400: #f7689d;--colors-accent-500: #ec5990;--colors-accent-600: #d8497d;--colors-error-400: #ff6645;--colors-error-500: #ec441f;color-scheme:light dark;color:var(--colors-black-100);background:var(--colors-background);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.
|
|
1
|
+
:root{--colors-black-100: #efeff4;--colors-black-150: #d9d9df;--colors-black-200: #c1c2cb;--colors-black-300: #acadb6;--colors-black-400: #9495a0;--colors-black-500: #777987;--colors-black-600: #61636d;--colors-black-700: #494a56;--colors-black-800: #22232a;--colors-black-850: #17181e;--colors-black-900: #0a0b11;--colors-white-50-transparent: #ffffff0d;--colors-background: #191d3a;--colors-backdrop: #00000080;--colors-accent-400: #f7689d;--colors-accent-500: #ec5990;--colors-accent-600: #d8497d;--colors-error-400: #ff6645;--colors-error-500: #ec441f;color-scheme:light dark;color:var(--colors-black-100);background:var(--colors-background);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}._button_1x3l8_1{height:48px;box-sizing:border-box;border:none;width:100%;min-width:164px;border-radius:6px;padding:0 10px;cursor:pointer;font-family:Inter;font-weight:500;font-size:16px;line-height:22px;letter-spacing:0;text-align:center}._button_1x3l8_1:disabled{cursor:not-allowed}._button_1x3l8_1:focus-visible{outline:solid 2px var(--colors-accent-500);outline-offset:2px}._solid_1x3l8_29{background:var(--colors-accent-500);color:var(--colors-black-900)}._solid_1x3l8_29:hover{background:var(--colors-accent-400)}._solid_1x3l8_29:disabled{background:var(--colors-black-700);color:var(--colors-black-400)}._outlined_1x3l8_44{background:none;border:1.5px var(--colors-black-100) solid;color:var(--colors-black-100)}._outlined_1x3l8_44:hover{border-color:var(--colors-black-300);color:var(--colors-black-300)}._outlined_1x3l8_44:disabled{border-color:var(--colors-black-500);color:var(--colors-black-500)}._link_1x3l8_60{display:inline-flex;align-items:center;justify-content:center}._link_yqbjv_1{color:var(--colors-accent-500);text-decoration:none;cursor:pointer;font-family:Inter;text-align:center}._link_yqbjv_1:hover,._underline_yqbjv_14{text-decoration-line:underline}._secondary_yqbjv_18{color:var(--colors-black-100)}._disabled_yqbjv_22{color:var(--colors-black-400);cursor:not-allowed}._disabled_yqbjv_22:hover{text-decoration-line:none}._checkbox_1npj4_1{position:relative;display:inline-flex;align-items:center;gap:6px}._input_1npj4_8{position:absolute;margin:0;opacity:0;height:100%;width:100%;cursor:pointer;outline:none}._indicator_1npj4_18{display:block;width:20px;height:20px;border:1.5px solid var(--colors-black-400);border-radius:50%}._input_1npj4_8:checked+._indicator_1npj4_18{content:url("data:image/svg+xml,%3csvg%20width='18'%20height='18'%20viewBox='0%200%2020%2020'%20fill='currentColor'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M15.7958%207.18239L8.41335%2014.5648C8.34906%2014.6293%208.27265%2014.6805%208.18853%2014.7155C8.1044%2014.7504%208.01421%2014.7684%207.92311%2014.7684C7.83202%2014.7684%207.74183%2014.7504%207.6577%2014.7155C7.57358%2014.6805%207.49717%2014.6293%207.43288%2014.5648L4.20306%2011.335C4.13868%2011.2706%204.08762%2011.1942%204.05277%2011.1101C4.01793%2011.026%204%2010.9358%204%2010.8448C4%2010.7537%204.01793%2010.6636%204.05277%2010.5794C4.08762%2010.4953%204.13868%2010.4189%204.20306%2010.3545C4.26744%2010.2901%204.34387%2010.2391%204.42799%2010.2042C4.5121%2010.1694%204.60226%2010.1515%204.6933%2010.1515C4.78435%2010.1515%204.8745%2010.1694%204.95862%2010.2042C5.04273%2010.2391%205.11916%2010.2901%205.18354%2010.3545L7.92369%2013.0947L14.8165%206.20306C14.9465%206.07304%2015.1228%206%2015.3067%206C15.4906%206%2015.6669%206.07304%2015.7969%206.20306C15.927%206.33308%2016%206.50943%2016%206.6933C16%206.87718%2015.927%207.05352%2015.7969%207.18354L15.7958%207.18239Z'%20/%3e%3c/svg%3e");background:var(--colors-accent-500);border-color:var(--colors-accent-500)}._input_1npj4_8:focus-visible+._indicator_1npj4_18{outline:solid 2px var(--colors-accent-500);outline-offset:2px}._label_1npj4_37{font-family:Inter;font-weight:400;font-size:14px;line-height:18px;letter-spacing:0;color:var(--colors-black-100)}._checkbox_1npj4_1._disabled_1npj4_46{opacity:.5}._input_1npj4_8:disabled{cursor:not-allowed}._input_1npj4_8[aria-invalid=true]+._indicator_1npj4_18{border-color:var(--colors-error-500)}._input_1npj4_8[aria-invalid=true]:checked+._indicator_1npj4_18{background:var(--colors-error-500)}._input_vvaje_1{appearance:none;height:48px;width:100%;padding:12px;box-sizing:border-box;border:1px solid var(--colors-black-500);border-radius:6px;outline:none;background-color:var(--colors-black-900);font-family:Inter;font-weight:400;font-size:16px;line-height:22px;letter-spacing:0;color:var(--colors-black-100)}._input_vvaje_1:focus{border-color:var(--colors-black-200)}._input_vvaje_1:disabled{border-color:var(--colors-black-700);color:var(--colors-black-600);cursor:not-allowed}._input_vvaje_1[aria-invalid=true]{border-color:var(--colors-error-500)}._input_vvaje_1[aria-invalid=true]:focus{border-color:var(--colors-error-400)}._dialog_1klsa_1[open]{background:var(--colors-black-800);border-radius:20px;border:none;padding:32px 24px;display:flex;flex-direction:column;box-shadow:0 6px 10px #0003}._dialog_1klsa_1::backdrop{background:var(--colors-backdrop);backdrop-filter:blur(10px)}._title_1klsa_16{margin:0 0 24px;font-family:Inter;font-weight:500;font-size:24px;text-align:center}._description_1klsa_26{margin:0;font-family:Inter;font-weight:400;font-style:Regular;font-size:16px;text-align:center;color:#ffffffb2}._actions_1klsa_37{margin-top:32px;display:flex;flex-direction:column;gap:16px}@media (min-width: 768px){._actions_1klsa_37{flex-direction:row-reverse;gap:24px}}._field_1ijme_1{display:flex;flex-direction:column;width:100%}._label_1ijme_7{width:fit-content;margin-bottom:6px;font-family:Inter;font-weight:400;font-size:14px;line-height:18px;letter-spacing:0;color:var(--colors-black-300)}._message_1ijme_19{margin:6px 0 0;font-family:Inter;font-weight:400;font-size:12px;line-height:16px;letter-spacing:0%;color:var(--colors-black-400)}._message_1ijme_19._error_1ijme_31{color:var(--colors-error-400)}
|