@code0-tech/pictor 0.6.4 → 0.7.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/dist/assets/components/form/EditorInput.style.css +1 -0
- package/dist/assets/components/form/InputWrapper.style.css +1 -0
- package/dist/assets/components/form/SelectInput.style.css +1 -0
- package/dist/components/command/Command.js +40 -33
- package/dist/components/editor/Editor.d.ts +2 -2
- package/dist/components/form/EditorInput.d.ts +16 -0
- package/dist/components/form/EditorInput.js +69 -0
- package/dist/components/form/InputWrapper.d.ts +13 -0
- package/dist/components/form/InputWrapper.js +62 -0
- package/dist/components/form/SelectInput.d.ts +23 -0
- package/dist/components/form/SelectInput.js +93 -0
- package/dist/components/form/index.d.ts +2 -0
- package/dist/components/form/index.js +45 -34
- package/dist/components/form/useForm.js +23 -23
- package/dist/index.js +163 -152
- package/package.json +5 -3
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.editor-input{width:100%;flex:1 1 auto;overflow:hidden;padding:.59rem 0;position:relative;align-self:stretch}.editor-input .cm-editor{height:100%;outline:none!important}.editor-input .cm-content{padding:0;position:relative}.editor-input .cm-line{align-self:stretch;padding-left:0}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.input-wrapper{display:flex;z-index:1;width:100%;align-items:start;box-sizing:border-box;gap:.175rem}.input-wrapper{background:#201e2c;box-shadow:inset 0 1px 1px #ffffff1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box}.input-wrapper:hover{background:#bfbfbf26;box-shadow:inset 0 1px 1px #ffffff1a}.input-wrapper:active,.input-wrapper:focus,.input-wrapper[aria-selected=true],.input-wrapper[data-state=open]{background:#bfbfbf33;box-shadow:inset 0 1px 1px #ffffff1a;outline:none}.input-wrapper{font-family:Inter,sans-serif;font-weight:400;letter-spacing:-.5px;border-radius:1rem}.input-wrapper:has(.input-wrapper__control:focus){background:#bfbfbf33;box-shadow:inset 0 1px 1px #ffffff1a;outline:none}.input-wrapper--not-valid{background:#1c0516;box-shadow:inset 0 1px 1px #d904291a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box}.input-wrapper>:first-child{padding-left:.7rem}.input-wrapper__left,.input-wrapper__right{display:flex;align-items:center;justify-content:center;min-height:30px;gap:.7rem;margin:.175rem}.input-wrapper__left>button,.input-wrapper__right>button{height:100%;padding-left:0;padding-right:0}.input-wrapper__left--action,.input-wrapper__right--action{padding:0}.input-wrapper__left--placeholder,.input-wrapper__right--placeholder{background:#070514;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;font-family:Inter,sans-serif;font-weight:400;letter-spacing:-.5px;border-radius:.825rem;padding:.7rem;box-shadow:none}.input-wrapper__left--icon,.input-wrapper__right--icon{align-items:center}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.select-input__content{padding:.35rem;position:relative;box-sizing:border-box;z-index:999}.select-input__content{border-radius:1rem}.select-input__item{border-radius:.65rem;padding:.35rem .7rem;gap:.7rem;cursor:pointer;width:100%;display:flex;align-items:center;font-size:.8rem}.select-input__item{background:#070514;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box}.select-input__item:focus{outline:none}.select-input__item{font-family:Inter,sans-serif;font-weight:400;letter-spacing:-.5px}.select-input__item:disabled,.select-input__item[data-disabled],.select-input__item[aria-disabled=true],.select-input__item--disabled{cursor:not-allowed;opacity:25%;pointer-events:unset}.select-input__item{box-shadow:none}.select-input__item:focus,.select-input__item[data-focus=true]{background:#191825;box-shadow:inset 0 1px 1px #ffffff1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;box-shadow:none;width:100%}.select-input__trigger{height:-webkit-fill-available;height:stretch;width:100%;position:relative;align-self:stretch;cursor:pointer}.select-input__content--primary{background:#070514;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:rgb(25.4,23.6,37.1) 2px solid}.select-input__content--secondary{background:#191825;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:rgb(25.4,23.6,37.1) 2px solid}.select-input__content--tertiary{background:#201e2c;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:rgb(25.4,23.6,37.1) 2px solid}.select-input__content--success{background:#0a1814;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:rgb(25.4,23.6,37.1) 2px solid}.select-input__content--warning{background:#201813;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:rgb(25.4,23.6,37.1) 2px solid}.select-input__content--error{background:#1c0516;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:rgb(25.4,23.6,37.1) 2px solid}.select-input__content--info{background:#121e24;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:rgb(25.4,23.6,37.1) 2px solid}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsx as
|
|
1
|
+
import { jsx as i, jsxs as s } from "react/jsx-runtime";
|
|
2
2
|
import { c } from "../../_virtual/compiler-runtime.js";
|
|
3
3
|
import { Command as a } from "cmdk";
|
|
4
4
|
import "../../utils/contextStore.js";
|
|
@@ -6,11 +6,16 @@ import "react";
|
|
|
6
6
|
import { mergeComponentProps as r } from "../../utils/component.js";
|
|
7
7
|
import "js-md5";
|
|
8
8
|
import { DialogPortal as u, DialogContent as h, Dialog as g, DialogOverlay as C } from "../dialog/Dialog.js";
|
|
9
|
-
import '../../assets/components/form/Input.style.css';import '../../assets/components/command/Command.style.css';/* empty css */
|
|
9
|
+
import '../../assets/components/form/SelectInput.style.css';import '../../assets/components/form/EditorInput.style.css';import '../../assets/components/form/Input.style.css';import '../../assets/components/command/Command.style.css';/* empty css */
|
|
10
10
|
import { Badge as _ } from "../badge/Badge.js";
|
|
11
11
|
import "@radix-ui/react-checkbox";
|
|
12
12
|
import "@tabler/icons-react";
|
|
13
13
|
/* empty css */
|
|
14
|
+
import "../form/InputWrapper.js";
|
|
15
|
+
import "@uiw/react-codemirror";
|
|
16
|
+
import "@uiw/codemirror-themes";
|
|
17
|
+
import "../../node_modules/@lezer/highlight/dist/index.js";
|
|
18
|
+
/* empty css */
|
|
14
19
|
import "../form/EmailInput.js";
|
|
15
20
|
import "../form/Input.js";
|
|
16
21
|
import "../form/InputSuggestion.js";
|
|
@@ -18,6 +23,8 @@ import "../form/NumberInput.js";
|
|
|
18
23
|
import "../form/PasswordInput.js";
|
|
19
24
|
import "@radix-ui/react-one-time-password-field";
|
|
20
25
|
import "@radix-ui/react-radio-group";
|
|
26
|
+
import "@radix-ui/react-select";
|
|
27
|
+
/* empty css */
|
|
21
28
|
import "../form/SwitchInput.js";
|
|
22
29
|
import "../form/TextAreaInput.js";
|
|
23
30
|
import { TextInput as $ } from "../form/TextInput.js";
|
|
@@ -27,28 +34,28 @@ const P = (e) => {
|
|
|
27
34
|
t[0] !== e ? (m = r("command", e), t[0] = e, t[1] = m) : m = t[1];
|
|
28
35
|
const o = m;
|
|
29
36
|
let n;
|
|
30
|
-
return t[2] !== o ? (n = /* @__PURE__ */
|
|
31
|
-
},
|
|
37
|
+
return t[2] !== o ? (n = /* @__PURE__ */ i(a, { ...o }), t[2] = o, t[3] = n) : n = t[3], n;
|
|
38
|
+
}, X = (e) => {
|
|
32
39
|
const t = c.c(11);
|
|
33
40
|
let m;
|
|
34
|
-
t[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (m = /* @__PURE__ */
|
|
41
|
+
t[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (m = /* @__PURE__ */ i(C, {}), t[0] = m) : m = t[0];
|
|
35
42
|
let o;
|
|
36
|
-
t[1] !== e ? (o = /* @__PURE__ */
|
|
43
|
+
t[1] !== e ? (o = /* @__PURE__ */ i(P, { ...e, h: "100%", children: e.children }), t[1] = e, t[2] = o) : o = t[2];
|
|
37
44
|
let n;
|
|
38
45
|
t[3] !== e.contentProps || t[4] !== o ? (n = /* @__PURE__ */ s(u, { children: [
|
|
39
46
|
m,
|
|
40
|
-
/* @__PURE__ */
|
|
47
|
+
/* @__PURE__ */ i(h, { className: "command__dialog", ...e.contentProps, children: o })
|
|
41
48
|
] }), t[3] = e.contentProps, t[4] = o, t[5] = n) : n = t[5];
|
|
42
|
-
let
|
|
43
|
-
return t[6] !== e.dialogProps || t[7] !== e.onOpenChange || t[8] !== e.open || t[9] !== n ? (
|
|
44
|
-
},
|
|
49
|
+
let l;
|
|
50
|
+
return t[6] !== e.dialogProps || t[7] !== e.onOpenChange || t[8] !== e.open || t[9] !== n ? (l = /* @__PURE__ */ i(g, { ...e.dialogProps, open: e.open, onOpenChange: e.onOpenChange, children: n }), t[6] = e.dialogProps, t[7] = e.onOpenChange, t[8] = e.open, t[9] = n, t[10] = l) : l = t[10], l;
|
|
51
|
+
}, Y = (e) => {
|
|
45
52
|
const t = c.c(4);
|
|
46
53
|
let m;
|
|
47
54
|
t[0] !== e ? (m = r("command__list", e), t[0] = e, t[1] = m) : m = t[1];
|
|
48
55
|
const o = m;
|
|
49
56
|
let n;
|
|
50
|
-
return t[2] !== o ? (n = /* @__PURE__ */
|
|
51
|
-
},
|
|
57
|
+
return t[2] !== o ? (n = /* @__PURE__ */ i(a.List, { ...o }), t[2] = o, t[3] = n) : n = t[3], n;
|
|
58
|
+
}, Z = (e) => {
|
|
52
59
|
const t = c.c(10);
|
|
53
60
|
let m;
|
|
54
61
|
t[0] !== e.value ? (m = e.value?.toString(), t[0] = e.value, t[1] = m) : m = t[1];
|
|
@@ -64,53 +71,53 @@ const P = (e) => {
|
|
|
64
71
|
}
|
|
65
72
|
}, t[2] = e, t[3] = o) : o = t[3];
|
|
66
73
|
let n;
|
|
67
|
-
t[4] !== e ? (n = /* @__PURE__ */
|
|
68
|
-
let
|
|
69
|
-
return t[6] !== m || t[7] !== o || t[8] !== n ? (
|
|
70
|
-
},
|
|
74
|
+
t[4] !== e ? (n = /* @__PURE__ */ i($, { className: "command__input", ...e }), t[4] = e, t[5] = n) : n = t[5];
|
|
75
|
+
let l;
|
|
76
|
+
return t[6] !== m || t[7] !== o || t[8] !== n ? (l = /* @__PURE__ */ i(a.Input, { value: m, onValueChange: o, asChild: !0, children: n }), t[6] = m, t[7] = o, t[8] = n, t[9] = l) : l = t[9], l;
|
|
77
|
+
}, p = (e) => {
|
|
71
78
|
const t = c.c(4);
|
|
72
79
|
let m;
|
|
73
80
|
t[0] !== e ? (m = r("command__empty", e), t[0] = e, t[1] = m) : m = t[1];
|
|
74
81
|
const o = m;
|
|
75
82
|
let n;
|
|
76
|
-
return t[2] !== o ? (n = /* @__PURE__ */
|
|
77
|
-
},
|
|
83
|
+
return t[2] !== o ? (n = /* @__PURE__ */ i(a.Empty, { ...o }), t[2] = o, t[3] = n) : n = t[3], n;
|
|
84
|
+
}, tt = (e) => {
|
|
78
85
|
const t = c.c(4);
|
|
79
86
|
let m;
|
|
80
87
|
t[0] !== e ? (m = r("command__group", e), t[0] = e, t[1] = m) : m = t[1];
|
|
81
88
|
const o = m;
|
|
82
89
|
let n;
|
|
83
|
-
return t[2] !== o ? (n = /* @__PURE__ */
|
|
84
|
-
},
|
|
90
|
+
return t[2] !== o ? (n = /* @__PURE__ */ i(a.Group, { ...o }), t[2] = o, t[3] = n) : n = t[3], n;
|
|
91
|
+
}, et = (e) => {
|
|
85
92
|
const t = c.c(4);
|
|
86
93
|
let m;
|
|
87
94
|
t[0] !== e ? (m = r("command__item", e), t[0] = e, t[1] = m) : m = t[1];
|
|
88
95
|
const o = m;
|
|
89
96
|
let n;
|
|
90
|
-
return t[2] !== o ? (n = /* @__PURE__ */
|
|
91
|
-
},
|
|
97
|
+
return t[2] !== o ? (n = /* @__PURE__ */ i(a.Item, { ...o }), t[2] = o, t[3] = n) : n = t[3], n;
|
|
98
|
+
}, nt = (e) => {
|
|
92
99
|
const t = c.c(4);
|
|
93
100
|
let m;
|
|
94
101
|
t[0] !== e ? (m = r("command__separator", e), t[0] = e, t[1] = m) : m = t[1];
|
|
95
102
|
const o = m;
|
|
96
103
|
let n;
|
|
97
|
-
return t[2] !== o ? (n = /* @__PURE__ */
|
|
98
|
-
},
|
|
104
|
+
return t[2] !== o ? (n = /* @__PURE__ */ i(a.Separator, { ...o }), t[2] = o, t[3] = n) : n = t[3], n;
|
|
105
|
+
}, mt = (e) => {
|
|
99
106
|
const t = c.c(5);
|
|
100
107
|
let m;
|
|
101
108
|
t[0] !== e ? (m = r("command__shortcut", e), t[0] = e, t[1] = m) : m = t[1];
|
|
102
109
|
const o = m;
|
|
103
110
|
let n;
|
|
104
|
-
return t[2] !== e.children || t[3] !== o ? (n = /* @__PURE__ */
|
|
111
|
+
return t[2] !== e.children || t[3] !== o ? (n = /* @__PURE__ */ i(_, { ...o, children: e.children }), t[2] = e.children, t[3] = o, t[4] = n) : n = t[4], n;
|
|
105
112
|
};
|
|
106
113
|
export {
|
|
107
114
|
P as Command,
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
115
|
+
X as CommandDialog,
|
|
116
|
+
p as CommandEmpty,
|
|
117
|
+
tt as CommandGroup,
|
|
118
|
+
Z as CommandInput,
|
|
119
|
+
et as CommandItem,
|
|
120
|
+
Y as CommandList,
|
|
121
|
+
nt as CommandSeparator,
|
|
122
|
+
mt as CommandShortcut
|
|
116
123
|
};
|
|
@@ -12,7 +12,7 @@ export interface EditorRendererProps {
|
|
|
12
12
|
export interface EditorTokenHighlights {
|
|
13
13
|
[tokenName: string]: (props: EditorRendererProps) => React.ReactNode;
|
|
14
14
|
}
|
|
15
|
-
export interface
|
|
15
|
+
export interface EditorProps extends Omit<Component<HTMLDivElement>, 'onChange' | 'defaultValue' | 'value'>, ValidationProps<any> {
|
|
16
16
|
language?: 'json' | StreamLanguage<unknown>;
|
|
17
17
|
tokenizer?: EditorTokenizer;
|
|
18
18
|
tokenHighlights?: EditorTokenHighlights;
|
|
@@ -28,4 +28,4 @@ export interface EditorInputProps extends Omit<Component<HTMLDivElement>, 'onCha
|
|
|
28
28
|
basicSetup?: BasicSetupOptions;
|
|
29
29
|
tokenStyles?: TagStyle[];
|
|
30
30
|
}
|
|
31
|
-
export declare const Editor: React.FC<
|
|
31
|
+
export declare const Editor: React.FC<EditorProps>;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { ValidationProps } from './useForm';
|
|
3
|
+
import { InputWrapperProps } from './InputWrapper';
|
|
4
|
+
import { CompletionContext, CompletionResult } from '@codemirror/autocomplete';
|
|
5
|
+
import { Extension } from '@uiw/react-codemirror';
|
|
6
|
+
import { StreamLanguage, TagStyle } from '@codemirror/language';
|
|
7
|
+
export interface EditorInputProps extends Omit<InputWrapperProps, 'onChange'>, ValidationProps<any> {
|
|
8
|
+
language?: StreamLanguage<unknown>;
|
|
9
|
+
suggestions?: (context: CompletionContext) => CompletionResult;
|
|
10
|
+
extensions?: Extension[];
|
|
11
|
+
disabled?: boolean;
|
|
12
|
+
readonly?: boolean;
|
|
13
|
+
tokenStyles?: TagStyle[];
|
|
14
|
+
onChange?: (value: string) => void;
|
|
15
|
+
}
|
|
16
|
+
export declare const EditorInput: React.FC<EditorInputProps>;
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
import { jsx as a } from "react/jsx-runtime";
|
|
2
|
+
import x from "react";
|
|
3
|
+
import { InputWrapper as y } from "./InputWrapper.js";
|
|
4
|
+
import T from "@uiw/react-codemirror";
|
|
5
|
+
import { createTheme as B } from "@uiw/codemirror-themes";
|
|
6
|
+
import { tags as t } from "../../node_modules/@lezer/highlight/dist/index.js";
|
|
7
|
+
import "../../utils/contextStore.js";
|
|
8
|
+
import { mergeComponentProps as C } from "../../utils/component.js";
|
|
9
|
+
import { hashToColor as e } from "../../utils/color.js";
|
|
10
|
+
import '../../assets/components/form/EditorInput.style.css';/* empty css */
|
|
11
|
+
const N = (i) => {
|
|
12
|
+
const {
|
|
13
|
+
title: g,
|
|
14
|
+
right: s,
|
|
15
|
+
left: m,
|
|
16
|
+
rightType: l,
|
|
17
|
+
leftType: c,
|
|
18
|
+
language: p,
|
|
19
|
+
description: u,
|
|
20
|
+
extensions: h = [],
|
|
21
|
+
tokenStyles: r = [],
|
|
22
|
+
formValidation: o,
|
|
23
|
+
onChange: f,
|
|
24
|
+
...b
|
|
25
|
+
} = i, d = [...h, p], k = x.useMemo(() => B({
|
|
26
|
+
theme: "light",
|
|
27
|
+
settings: {
|
|
28
|
+
background: "transparent",
|
|
29
|
+
backgroundImage: "",
|
|
30
|
+
foreground: "rgba(255,255,255, 0.75)",
|
|
31
|
+
caret: "gray",
|
|
32
|
+
selection: "rgba(112,179,255,0.25)",
|
|
33
|
+
selectionMatch: "rgba(112,179,255,0.1)",
|
|
34
|
+
fontSize: "0.8rem",
|
|
35
|
+
gutterBackground: "transparent",
|
|
36
|
+
gutterForeground: "rgba(255,255,255, 0.5)",
|
|
37
|
+
gutterBorder: "transparent",
|
|
38
|
+
gutterActiveForeground: "rgba(255,255,255, 1)",
|
|
39
|
+
lineHighlight: "rgba(255,255,255, 0.1)"
|
|
40
|
+
},
|
|
41
|
+
styles: [{
|
|
42
|
+
tag: t.squareBracket,
|
|
43
|
+
color: e("squareBracket")
|
|
44
|
+
}, {
|
|
45
|
+
tag: t.bracket,
|
|
46
|
+
color: e("bracket")
|
|
47
|
+
}, {
|
|
48
|
+
tag: t.string,
|
|
49
|
+
color: e("Text")
|
|
50
|
+
}, {
|
|
51
|
+
tag: t.bool,
|
|
52
|
+
color: e("Boolean")
|
|
53
|
+
}, {
|
|
54
|
+
tag: t.number,
|
|
55
|
+
color: e("Number")
|
|
56
|
+
}, ...r]
|
|
57
|
+
}), [r]);
|
|
58
|
+
return /* @__PURE__ */ a(y, { title: g, description: u, right: s, left: m, rightType: l, leftType: c, formValidation: o, children: /* @__PURE__ */ a(T, { extensions: d, onChange: (n) => {
|
|
59
|
+
f?.(n), o?.setValue(n);
|
|
60
|
+
}, theme: k, ...C("editor-input", b), basicSetup: {
|
|
61
|
+
lineNumbers: !1,
|
|
62
|
+
foldGutter: !1,
|
|
63
|
+
highlightActiveLine: !1,
|
|
64
|
+
highlightActiveLineGutter: !1
|
|
65
|
+
} }) });
|
|
66
|
+
};
|
|
67
|
+
export {
|
|
68
|
+
N as EditorInput
|
|
69
|
+
};
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { Component } from '../../utils';
|
|
2
|
+
import { default as React } from 'react';
|
|
3
|
+
import { ValidationProps } from './useForm';
|
|
4
|
+
export interface InputWrapperProps<T = any> extends Omit<Component<HTMLElement>, 'left' | 'right' | 'title' | "defaultValue" | "value">, ValidationProps<T> {
|
|
5
|
+
right?: React.ReactNode;
|
|
6
|
+
left?: React.ReactNode;
|
|
7
|
+
leftType?: "action" | "placeholder" | "icon";
|
|
8
|
+
rightType?: "action" | "placeholder" | "icon";
|
|
9
|
+
title?: React.ReactNode;
|
|
10
|
+
description?: React.ReactNode;
|
|
11
|
+
wrapperComponent?: Component<HTMLDivElement>;
|
|
12
|
+
}
|
|
13
|
+
export declare const InputWrapper: React.ForwardRefExoticComponent<InputWrapperProps>;
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
import { jsxs as $, jsx as a, Fragment as R } from "react/jsx-runtime";
|
|
2
|
+
import { c as j } from "../../_virtual/compiler-runtime.js";
|
|
3
|
+
import "../../utils/contextStore.js";
|
|
4
|
+
import N from "react";
|
|
5
|
+
import { mergeComponentProps as b } from "../../utils/component.js";
|
|
6
|
+
import "js-md5";
|
|
7
|
+
import { InputMessage as D } from "./InputMessage.js";
|
|
8
|
+
import { InputLabel as E } from "./InputLabel.js";
|
|
9
|
+
import { InputDescription as F } from "./InputDescription.js";
|
|
10
|
+
import '../../assets/components/form/InputWrapper.style.css';/* empty css */
|
|
11
|
+
const K = N.forwardRef((C, L) => {
|
|
12
|
+
const e = j.c(29), {
|
|
13
|
+
children: _,
|
|
14
|
+
wrapperComponent: m,
|
|
15
|
+
left: f,
|
|
16
|
+
right: c,
|
|
17
|
+
leftType: M,
|
|
18
|
+
rightType: T,
|
|
19
|
+
title: d,
|
|
20
|
+
description: u,
|
|
21
|
+
formValidation: h
|
|
22
|
+
} = C;
|
|
23
|
+
let g;
|
|
24
|
+
e[0] !== m ? (g = m === void 0 ? {} : m, e[0] = m, e[1] = g) : g = e[1];
|
|
25
|
+
const V = g, x = M === void 0 ? "icon" : M, y = T === void 0 ? "action" : T;
|
|
26
|
+
let v;
|
|
27
|
+
e[2] !== h ? (v = h === void 0 ? {
|
|
28
|
+
valid: !0,
|
|
29
|
+
notValidMessage: null,
|
|
30
|
+
setValue: null
|
|
31
|
+
} : h, e[2] = h, e[3] = v) : v = e[3];
|
|
32
|
+
const t = v;
|
|
33
|
+
let i;
|
|
34
|
+
e[4] !== d ? (i = d && /* @__PURE__ */ a(E, { children: d }), e[4] = d, e[5] = i) : i = e[5];
|
|
35
|
+
let r;
|
|
36
|
+
e[6] !== u ? (r = u && /* @__PURE__ */ a(F, { children: u }), e[6] = u, e[7] = r) : r = e[7];
|
|
37
|
+
const I = `input-wrapper ${t?.valid ? "" : "input-wrapper--not-valid"}`;
|
|
38
|
+
let l;
|
|
39
|
+
e[8] !== I || e[9] !== V ? (l = b(I, V), e[8] = I, e[9] = V, e[10] = l) : l = e[10];
|
|
40
|
+
let o;
|
|
41
|
+
e[11] !== f || e[12] !== x ? (o = f && /* @__PURE__ */ a("div", { className: `input-wrapper__left input__left--${x}`, children: f }), e[11] = f, e[12] = x, e[13] = o) : o = e[13];
|
|
42
|
+
let p;
|
|
43
|
+
e[14] !== c || e[15] !== y ? (p = c && /* @__PURE__ */ a("div", { className: `input-wrapper__right input-wrapper__right--${y}`, children: c }), e[14] = c, e[15] = y, e[16] = p) : p = e[16];
|
|
44
|
+
let n;
|
|
45
|
+
e[17] !== _ || e[18] !== o || e[19] !== p || e[20] !== l ? (n = /* @__PURE__ */ $("div", { ...l, children: [
|
|
46
|
+
o,
|
|
47
|
+
_,
|
|
48
|
+
p
|
|
49
|
+
] }), e[17] = _, e[18] = o, e[19] = p, e[20] = l, e[21] = n) : n = e[21];
|
|
50
|
+
let s;
|
|
51
|
+
e[22] !== t ? (s = !t?.valid && t?.notValidMessage && /* @__PURE__ */ a(D, { children: t.notValidMessage }), e[22] = t, e[23] = s) : s = e[23];
|
|
52
|
+
let w;
|
|
53
|
+
return e[24] !== n || e[25] !== s || e[26] !== i || e[27] !== r ? (w = /* @__PURE__ */ $(R, { children: [
|
|
54
|
+
i,
|
|
55
|
+
r,
|
|
56
|
+
n,
|
|
57
|
+
s
|
|
58
|
+
] }), e[24] = n, e[25] = s, e[26] = i, e[27] = r, e[28] = w) : w = e[28], w;
|
|
59
|
+
});
|
|
60
|
+
export {
|
|
61
|
+
K as InputWrapper
|
|
62
|
+
};
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { Color, ComponentProps } from '../../utils';
|
|
2
|
+
import { default as React } from 'react';
|
|
3
|
+
import { InputWrapperProps } from './InputWrapper';
|
|
4
|
+
import * as RadixSelect from "@radix-ui/react-select";
|
|
5
|
+
export type SelectInputProps = InputWrapperProps;
|
|
6
|
+
export type SelectProps = SelectInputProps & RadixSelect.SelectProps;
|
|
7
|
+
export type SelectTriggerProps = ComponentProps & RadixSelect.SelectTriggerProps;
|
|
8
|
+
export type SelectValueProps = ComponentProps & RadixSelect.SelectValueProps;
|
|
9
|
+
export type SelectContentProps = ComponentProps & RadixSelect.SelectContentProps & {
|
|
10
|
+
color?: Color;
|
|
11
|
+
};
|
|
12
|
+
export type SelectPortalProps = ComponentProps & RadixSelect.SelectPortalProps;
|
|
13
|
+
export type SelectViewportProps = ComponentProps & RadixSelect.SelectViewportProps;
|
|
14
|
+
export type SelectItemProps = ComponentProps & RadixSelect.SelectItemProps;
|
|
15
|
+
export type SelectItemTextProps = ComponentProps & RadixSelect.SelectItemTextProps;
|
|
16
|
+
export declare const SelectInput: React.FC<SelectProps>;
|
|
17
|
+
export declare const SelectTrigger: React.FC<SelectTriggerProps>;
|
|
18
|
+
export declare const SelectValue: React.FC<SelectValueProps>;
|
|
19
|
+
export declare const SelectContent: React.FC<SelectContentProps>;
|
|
20
|
+
export declare const SelectPortal: React.FC<SelectPortalProps>;
|
|
21
|
+
export declare const SelectViewport: React.FC<SelectViewportProps>;
|
|
22
|
+
export declare const SelectItem: React.FC<SelectItemProps>;
|
|
23
|
+
export declare const SelectItemText: React.FC<SelectItemTextProps>;
|
|
@@ -0,0 +1,93 @@
|
|
|
1
|
+
import { jsx as o } from "react/jsx-runtime";
|
|
2
|
+
import { c as r } from "../../_virtual/compiler-runtime.js";
|
|
3
|
+
import * as s from "@radix-ui/react-select";
|
|
4
|
+
import "../../utils/contextStore.js";
|
|
5
|
+
import "react";
|
|
6
|
+
import { mergeComponentProps as f } from "../../utils/component.js";
|
|
7
|
+
import "js-md5";
|
|
8
|
+
import { InputWrapper as p } from "./InputWrapper.js";
|
|
9
|
+
import '../../assets/components/form/SelectInput.style.css';/* empty css */
|
|
10
|
+
const A = (n) => {
|
|
11
|
+
const t = r.c(24);
|
|
12
|
+
let e, l, i, c, m, u, a, _, g, T;
|
|
13
|
+
if (t[0] !== n) {
|
|
14
|
+
const {
|
|
15
|
+
title: C,
|
|
16
|
+
description: I,
|
|
17
|
+
left: y,
|
|
18
|
+
leftType: w,
|
|
19
|
+
rightType: P,
|
|
20
|
+
right: R,
|
|
21
|
+
formValidation: h,
|
|
22
|
+
...x
|
|
23
|
+
} = n;
|
|
24
|
+
l = p, c = C, m = I, u = y, a = w, _ = R, g = P, T = h, e = s.Root, i = f("select-input", {
|
|
25
|
+
...x,
|
|
26
|
+
onValueChange: (d) => {
|
|
27
|
+
h?.setValue(d), x.onValueChange?.(d), n.onChange?.({});
|
|
28
|
+
}
|
|
29
|
+
}), t[0] = n, t[1] = e, t[2] = l, t[3] = i, t[4] = c, t[5] = m, t[6] = u, t[7] = a, t[8] = _, t[9] = g, t[10] = T;
|
|
30
|
+
} else
|
|
31
|
+
e = t[1], l = t[2], i = t[3], c = t[4], m = t[5], u = t[6], a = t[7], _ = t[8], g = t[9], T = t[10];
|
|
32
|
+
const $ = i;
|
|
33
|
+
let S;
|
|
34
|
+
t[11] !== e || t[12] !== $ ? (S = /* @__PURE__ */ o(e, { ...$ }), t[11] = e, t[12] = $, t[13] = S) : S = t[13];
|
|
35
|
+
let V;
|
|
36
|
+
return t[14] !== l || t[15] !== c || t[16] !== m || t[17] !== u || t[18] !== a || t[19] !== _ || t[20] !== g || t[21] !== T || t[22] !== S ? (V = /* @__PURE__ */ o(l, { title: c, description: m, left: u, leftType: a, right: _, rightType: g, formValidation: T, children: S }), t[14] = l, t[15] = c, t[16] = m, t[17] = u, t[18] = a, t[19] = _, t[20] = g, t[21] = T, t[22] = S, t[23] = V) : V = t[23], V;
|
|
37
|
+
}, B = (n) => {
|
|
38
|
+
const t = r.c(4);
|
|
39
|
+
let e;
|
|
40
|
+
t[0] !== n ? (e = f("select-input__trigger", n), t[0] = n, t[1] = e) : e = t[1];
|
|
41
|
+
let l;
|
|
42
|
+
return t[2] !== e ? (l = /* @__PURE__ */ o(s.Trigger, { ...e }), t[2] = e, t[3] = l) : l = t[3], l;
|
|
43
|
+
}, D = (n) => {
|
|
44
|
+
const t = r.c(4);
|
|
45
|
+
let e;
|
|
46
|
+
t[0] !== n ? (e = f("select-input__value", n), t[0] = n, t[1] = e) : e = t[1];
|
|
47
|
+
let l;
|
|
48
|
+
return t[2] !== e ? (l = /* @__PURE__ */ o(s.Value, { ...e }), t[2] = e, t[3] = l) : l = t[3], l;
|
|
49
|
+
}, F = (n) => {
|
|
50
|
+
const t = r.c(5), e = `select-input__content select-input__content--${n.color ?? "primary"}`;
|
|
51
|
+
let l;
|
|
52
|
+
t[0] !== n || t[1] !== e ? (l = f(e, n), t[0] = n, t[1] = e, t[2] = l) : l = t[2];
|
|
53
|
+
const i = l;
|
|
54
|
+
let c;
|
|
55
|
+
return t[3] !== i ? (c = /* @__PURE__ */ o(s.Content, { ...i }), t[3] = i, t[4] = c) : c = t[4], c;
|
|
56
|
+
}, G = (n) => {
|
|
57
|
+
const t = r.c(4);
|
|
58
|
+
let e;
|
|
59
|
+
t[0] !== n ? (e = f("select-input__portal", n), t[0] = n, t[1] = e) : e = t[1];
|
|
60
|
+
const l = e;
|
|
61
|
+
let i;
|
|
62
|
+
return t[2] !== l ? (i = /* @__PURE__ */ o(s.Portal, { ...l }), t[2] = l, t[3] = i) : i = t[3], i;
|
|
63
|
+
}, H = (n) => {
|
|
64
|
+
const t = r.c(4);
|
|
65
|
+
let e;
|
|
66
|
+
t[0] !== n ? (e = f("select-input__viewport", n), t[0] = n, t[1] = e) : e = t[1];
|
|
67
|
+
let l;
|
|
68
|
+
return t[2] !== e ? (l = /* @__PURE__ */ o(s.Viewport, { ...e }), t[2] = e, t[3] = l) : l = t[3], l;
|
|
69
|
+
}, J = (n) => {
|
|
70
|
+
const t = r.c(4);
|
|
71
|
+
let e;
|
|
72
|
+
t[0] !== n ? (e = f("select-input__item", n), t[0] = n, t[1] = e) : e = t[1];
|
|
73
|
+
const l = e;
|
|
74
|
+
let i;
|
|
75
|
+
return t[2] !== l ? (i = /* @__PURE__ */ o(s.Item, { ...l }), t[2] = l, t[3] = i) : i = t[3], i;
|
|
76
|
+
}, K = (n) => {
|
|
77
|
+
const t = r.c(4);
|
|
78
|
+
let e;
|
|
79
|
+
t[0] !== n ? (e = f("select-input__item-text", n), t[0] = n, t[1] = e) : e = t[1];
|
|
80
|
+
const l = e;
|
|
81
|
+
let i;
|
|
82
|
+
return t[2] !== l ? (i = /* @__PURE__ */ o(s.ItemText, { ...l }), t[2] = l, t[3] = i) : i = t[3], i;
|
|
83
|
+
};
|
|
84
|
+
export {
|
|
85
|
+
F as SelectContent,
|
|
86
|
+
A as SelectInput,
|
|
87
|
+
J as SelectItem,
|
|
88
|
+
K as SelectItemText,
|
|
89
|
+
G as SelectPortal,
|
|
90
|
+
B as SelectTrigger,
|
|
91
|
+
D as SelectValue,
|
|
92
|
+
H as SelectViewport
|
|
93
|
+
};
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
export * from './CheckboxInput';
|
|
2
|
+
export * from './EditorInput';
|
|
2
3
|
export * from './EmailInput';
|
|
3
4
|
export * from './Input';
|
|
4
5
|
export * from './InputDescription';
|
|
@@ -10,6 +11,7 @@ export * from './PasswordInput';
|
|
|
10
11
|
export * from './PinInput';
|
|
11
12
|
export * from './RadioGroup';
|
|
12
13
|
export * from './RadioInput';
|
|
14
|
+
export * from './SelectInput';
|
|
13
15
|
export * from './SwitchInput';
|
|
14
16
|
export * from './TextAreaInput';
|
|
15
17
|
export * from './TextInput';
|
|
@@ -1,41 +1,52 @@
|
|
|
1
|
-
import { CheckboxInput as
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
1
|
+
import { CheckboxInput as o } from "./CheckboxInput.js";
|
|
2
|
+
import { EditorInput as p } from "./EditorInput.js";
|
|
3
|
+
import { EmailInput as u, emailValidation as m } from "./EmailInput.js";
|
|
4
|
+
import { Input as i } from "./Input.js";
|
|
5
|
+
import { InputDescription as f } from "./InputDescription.js";
|
|
6
|
+
import { InputLabel as a } from "./InputLabel.js";
|
|
7
|
+
import { InputMessage as S } from "./InputMessage.js";
|
|
8
|
+
import { InputSuggestionMenuContent as s, InputSuggestionMenuContentItems as g } from "./InputSuggestion.js";
|
|
9
|
+
import { NumberInput as b } from "./NumberInput.js";
|
|
10
|
+
import { PasswordInput as C, passwordValidation as T } from "./PasswordInput.js";
|
|
10
11
|
import { PinInput as F, PinInputField as M, PinInputHiddenField as h } from "./PinInput.js";
|
|
11
|
-
import { RadioGroup as
|
|
12
|
-
import { RadioInput as
|
|
13
|
-
import {
|
|
14
|
-
import {
|
|
15
|
-
import {
|
|
16
|
-
import {
|
|
17
|
-
import {
|
|
12
|
+
import { RadioGroup as E } from "./RadioGroup.js";
|
|
13
|
+
import { RadioInput as k } from "./RadioInput.js";
|
|
14
|
+
import { SelectContent as A, SelectInput as G, SelectItem as H, SelectItemText as L, SelectPortal as N, SelectTrigger as j, SelectValue as q, SelectViewport as v } from "./SelectInput.js";
|
|
15
|
+
import { SwitchInput as B } from "./SwitchInput.js";
|
|
16
|
+
import { TextAreaInput as K } from "./TextAreaInput.js";
|
|
17
|
+
import { TextInput as Q } from "./TextInput.js";
|
|
18
|
+
import { useForm as W } from "./useForm.js";
|
|
19
|
+
import { buildDefaultSyntax as Y } from "./Input.syntax.hook.js";
|
|
18
20
|
export {
|
|
19
|
-
|
|
20
|
-
p as
|
|
21
|
-
|
|
22
|
-
i as
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
21
|
+
o as CheckboxInput,
|
|
22
|
+
p as EditorInput,
|
|
23
|
+
u as EmailInput,
|
|
24
|
+
i as Input,
|
|
25
|
+
f as InputDescription,
|
|
26
|
+
a as InputLabel,
|
|
27
|
+
S as InputMessage,
|
|
28
|
+
s as InputSuggestionMenuContent,
|
|
26
29
|
g as InputSuggestionMenuContentItems,
|
|
27
|
-
|
|
28
|
-
|
|
30
|
+
b as NumberInput,
|
|
31
|
+
C as PasswordInput,
|
|
29
32
|
F as PinInput,
|
|
30
33
|
M as PinInputField,
|
|
31
34
|
h as PinInputHiddenField,
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
H as
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
35
|
+
E as RadioGroup,
|
|
36
|
+
k as RadioInput,
|
|
37
|
+
A as SelectContent,
|
|
38
|
+
G as SelectInput,
|
|
39
|
+
H as SelectItem,
|
|
40
|
+
L as SelectItemText,
|
|
41
|
+
N as SelectPortal,
|
|
42
|
+
j as SelectTrigger,
|
|
43
|
+
q as SelectValue,
|
|
44
|
+
v as SelectViewport,
|
|
45
|
+
B as SwitchInput,
|
|
46
|
+
K as TextAreaInput,
|
|
47
|
+
Q as TextInput,
|
|
48
|
+
Y as buildDefaultSyntax,
|
|
49
|
+
m as emailValidation,
|
|
50
|
+
T as passwordValidation,
|
|
51
|
+
W as useForm
|
|
41
52
|
};
|
|
@@ -1,24 +1,24 @@
|
|
|
1
1
|
import { useState as m, useRef as w, useCallback as b, useEffect as j } from "react";
|
|
2
|
-
function
|
|
3
|
-
return (e = y(e)) in
|
|
2
|
+
function o(i, e, t) {
|
|
3
|
+
return (e = y(e)) in i ? Object.defineProperty(i, e, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : i[e] = t, i;
|
|
4
4
|
}
|
|
5
|
-
function y(
|
|
6
|
-
var e = P(
|
|
5
|
+
function y(i) {
|
|
6
|
+
var e = P(i, "string");
|
|
7
7
|
return typeof e == "symbol" ? e : e + "";
|
|
8
8
|
}
|
|
9
|
-
function P(
|
|
10
|
-
if (typeof
|
|
11
|
-
var t =
|
|
9
|
+
function P(i, e) {
|
|
10
|
+
if (typeof i != "object" || !i) return i;
|
|
11
|
+
var t = i[Symbol.toPrimitive];
|
|
12
12
|
if (t !== void 0) {
|
|
13
|
-
var
|
|
14
|
-
if (typeof
|
|
13
|
+
var a = t.call(i, e);
|
|
14
|
+
if (typeof a != "object") return a;
|
|
15
15
|
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
16
16
|
}
|
|
17
|
-
return (e === "string" ? String : Number)(
|
|
17
|
+
return (e === "string" ? String : Number)(i);
|
|
18
18
|
}
|
|
19
19
|
class v {
|
|
20
|
-
constructor(e, t,
|
|
21
|
-
|
|
20
|
+
constructor(e, t, a, u = /* @__PURE__ */ new Map(), r = /* @__PURE__ */ new Map()) {
|
|
21
|
+
o(this, "changeValue", void 0), o(this, "currentValues", void 0), o(this, "currentValidations", void 0), o(this, "shouldValidate", void 0), o(this, "cachedMessages", void 0), this.changeValue = e, this.currentValues = t, this.currentValidations = a, this.shouldValidate = u, this.cachedMessages = r;
|
|
22
22
|
}
|
|
23
23
|
isValid() {
|
|
24
24
|
if (!this.currentValidations) return !0;
|
|
@@ -30,12 +30,12 @@ class v {
|
|
|
30
30
|
return !0;
|
|
31
31
|
}
|
|
32
32
|
getInputProps(e) {
|
|
33
|
-
const t = this.currentValues[e],
|
|
33
|
+
const t = this.currentValues[e], a = t ?? null, u = e, r = this.currentValidations && this.currentValidations[e] ? this.currentValidations[e] : (l) => null;
|
|
34
34
|
let s = null;
|
|
35
35
|
return this.shouldValidate.has(e) ? (s = r(t, this.currentValues), this.cachedMessages.set(e, s)) : s = this.cachedMessages.get(e) ?? null, {
|
|
36
36
|
// @ts-ignore – z.B. wenn dein Input `defaultValue` kennt
|
|
37
|
-
defaultValue:
|
|
38
|
-
initialValue:
|
|
37
|
+
defaultValue: a ?? void 0,
|
|
38
|
+
initialValue: a ?? void 0,
|
|
39
39
|
formValidation: {
|
|
40
40
|
setValue: (l) => {
|
|
41
41
|
this.changeValue(u, l);
|
|
@@ -49,29 +49,29 @@ class v {
|
|
|
49
49
|
};
|
|
50
50
|
}
|
|
51
51
|
}
|
|
52
|
-
const F = (
|
|
52
|
+
const F = (i) => {
|
|
53
53
|
const {
|
|
54
54
|
initialValues: e,
|
|
55
55
|
validate: t = {},
|
|
56
|
-
truthyValidationBeforeSubmit:
|
|
56
|
+
truthyValidationBeforeSubmit: a = !0,
|
|
57
57
|
useInitialValidation: u = !0,
|
|
58
58
|
onSubmit: r
|
|
59
|
-
} =
|
|
59
|
+
} = i, [s, l] = m(e), c = w(e), f = w(/* @__PURE__ */ new Map()), d = b((n, p) => {
|
|
60
60
|
l((h) => {
|
|
61
61
|
const V = {
|
|
62
62
|
...h,
|
|
63
63
|
[n]: p
|
|
64
64
|
};
|
|
65
|
-
return
|
|
65
|
+
return c.current = V, V;
|
|
66
66
|
});
|
|
67
67
|
}, []), [M, g] = m(new v(d, s, t, u ? new Map(Object.keys(e).map((n) => [n, !0])) : /* @__PURE__ */ new Map(), f.current));
|
|
68
68
|
j(() => {
|
|
69
|
-
l(e),
|
|
69
|
+
l(e), c.current = e, g(new v(d, e, t, u ? new Map(Object.keys(e).map((n) => [n, !0])) : /* @__PURE__ */ new Map(), f.current));
|
|
70
70
|
}, [e]);
|
|
71
71
|
const S = b((n) => {
|
|
72
|
-
const p = n && new Set(Object.keys(e)).has(String(n)) ? /* @__PURE__ */ new Map([[n, !0]]) : new Map(Object.keys(e).map((V) => [String(V), !0])), h = new v(d,
|
|
73
|
-
g(h), !new Set(Object.keys(e)).has(String(n)) && r && (!
|
|
74
|
-
}, [d, t, r,
|
|
72
|
+
const p = n && new Set(Object.keys(e)).has(String(n)) ? /* @__PURE__ */ new Map([[n, !0]]) : new Map(Object.keys(e).map((V) => [String(V), !0])), h = new v(d, c.current, t, p, f.current);
|
|
73
|
+
g(h), !new Set(Object.keys(e)).has(String(n)) && r && (!a || h.isValid()) && r(c.current);
|
|
74
|
+
}, [d, t, r, a, e]);
|
|
75
75
|
return [M, S];
|
|
76
76
|
};
|
|
77
77
|
export {
|
package/dist/index.js
CHANGED
|
@@ -1,188 +1,199 @@
|
|
|
1
1
|
import { Alert as r } from "./components/alert/Alert.js";
|
|
2
2
|
import { AuroraBackground as n } from "./components/aurora/Aurora.js";
|
|
3
3
|
import { Avatar as p } from "./components/avatar/Avatar.js";
|
|
4
|
-
import { Badge as
|
|
5
|
-
import { Breadcrumb as
|
|
4
|
+
import { Badge as l } from "./components/badge/Badge.js";
|
|
5
|
+
import { Breadcrumb as i } from "./components/breadcrumb/Breadcrumb.js";
|
|
6
6
|
import { Button as f } from "./components/button/Button.js";
|
|
7
7
|
import { ButtonGroup as g } from "./components/button-group/ButtonGroup.js";
|
|
8
|
-
import { Card as
|
|
9
|
-
import { Col as
|
|
10
|
-
import { Command as
|
|
8
|
+
import { Card as T } from "./components/card/Card.js";
|
|
9
|
+
import { Col as s } from "./components/col/Col.js";
|
|
10
|
+
import { Command as c, CommandDialog as I, CommandEmpty as M, CommandGroup as D, CommandInput as A, CommandItem as F, CommandList as P, CommandSeparator as v, CommandShortcut as w } from "./components/command/Command.js";
|
|
11
11
|
import { Container as R } from "./components/container/Container.js";
|
|
12
|
-
import { ContextMenu as y, ContextMenuArrow as G, ContextMenuContent as
|
|
12
|
+
import { ContextMenu as y, ContextMenuArrow as G, ContextMenuContent as V, ContextMenuGroup as z, ContextMenuItem as B, ContextMenuLabel as E, ContextMenuPortal as k, ContextMenuSeparator as H, ContextMenuSub as O, ContextMenuSubContent as Q, ContextMenuSubTrigger as N, ContextMenuTrigger as Z } from "./components/context-menu/ContextMenu.js";
|
|
13
13
|
import { DataTable as q } from "./components/data-table/DataTable.js";
|
|
14
14
|
import { DataTableColumn as K } from "./components/data-table/DataTableColumn.js";
|
|
15
15
|
import { DataTableFilterInput as W, createFilterQueryLanguage as X } from "./components/data-table/DataTableFilterInput.js";
|
|
16
16
|
import { DataTableFilterSuggestionMenu as _ } from "./components/data-table/DataTableFilterSuggestionMenu.js";
|
|
17
|
-
import { Dialog as
|
|
18
|
-
import { Editor as
|
|
19
|
-
import { FileTabsService as
|
|
20
|
-
import { FileTabs as
|
|
21
|
-
import { Flex as
|
|
22
|
-
import { CheckboxInput as
|
|
23
|
-
import {
|
|
24
|
-
import {
|
|
25
|
-
import {
|
|
26
|
-
import {
|
|
27
|
-
import {
|
|
28
|
-
import {
|
|
29
|
-
import {
|
|
30
|
-
import {
|
|
31
|
-
import {
|
|
32
|
-
import {
|
|
33
|
-
import {
|
|
34
|
-
import {
|
|
35
|
-
import {
|
|
36
|
-
import {
|
|
37
|
-
import {
|
|
38
|
-
import {
|
|
39
|
-
import {
|
|
40
|
-
import {
|
|
41
|
-
import {
|
|
42
|
-
import {
|
|
43
|
-
import {
|
|
44
|
-
import {
|
|
45
|
-
import {
|
|
46
|
-
import {
|
|
47
|
-
import {
|
|
48
|
-
import {
|
|
49
|
-
import {
|
|
50
|
-
import {
|
|
51
|
-
import {
|
|
52
|
-
import {
|
|
53
|
-
import {
|
|
54
|
-
import {
|
|
55
|
-
import {
|
|
56
|
-
import {
|
|
57
|
-
import {
|
|
17
|
+
import { Dialog as ee, DialogClose as oe, DialogContent as re, DialogDescription as te, DialogFooter as ne, DialogHeader as ae, DialogOverlay as pe, DialogPortal as me, DialogTitle as le, DialogTrigger as ue } from "./components/dialog/Dialog.js";
|
|
18
|
+
import { Editor as xe } from "./components/editor/Editor.js";
|
|
19
|
+
import { FileTabsService as Ce } from "./components/file-tabs/FileTabs.service.js";
|
|
20
|
+
import { FileTabs as Se, FileTabsContent as Te, FileTabsList as de, FileTabsTrigger as se } from "./components/file-tabs/FileTabs.js";
|
|
21
|
+
import { Flex as ce } from "./components/flex/Flex.js";
|
|
22
|
+
import { CheckboxInput as Me } from "./components/form/CheckboxInput.js";
|
|
23
|
+
import { EditorInput as Ae } from "./components/form/EditorInput.js";
|
|
24
|
+
import { EmailInput as Pe, emailValidation as ve } from "./components/form/EmailInput.js";
|
|
25
|
+
import { Input as he } from "./components/form/Input.js";
|
|
26
|
+
import { InputDescription as Le } from "./components/form/InputDescription.js";
|
|
27
|
+
import { InputLabel as Ge } from "./components/form/InputLabel.js";
|
|
28
|
+
import { InputMessage as ze } from "./components/form/InputMessage.js";
|
|
29
|
+
import { InputSuggestionMenuContent as Ee, InputSuggestionMenuContentItems as ke } from "./components/form/InputSuggestion.js";
|
|
30
|
+
import { NumberInput as Oe } from "./components/form/NumberInput.js";
|
|
31
|
+
import { PasswordInput as Ne, passwordValidation as Ze } from "./components/form/PasswordInput.js";
|
|
32
|
+
import { PinInput as qe, PinInputField as Je, PinInputHiddenField as Ke } from "./components/form/PinInput.js";
|
|
33
|
+
import { RadioGroup as We } from "./components/form/RadioGroup.js";
|
|
34
|
+
import { RadioInput as Ye } from "./components/form/RadioInput.js";
|
|
35
|
+
import { SelectContent as $e, SelectInput as eo, SelectItem as oo, SelectItemText as ro, SelectPortal as to, SelectTrigger as no, SelectValue as ao, SelectViewport as po } from "./components/form/SelectInput.js";
|
|
36
|
+
import { SwitchInput as lo } from "./components/form/SwitchInput.js";
|
|
37
|
+
import { TextAreaInput as io } from "./components/form/TextAreaInput.js";
|
|
38
|
+
import { TextInput as fo } from "./components/form/TextInput.js";
|
|
39
|
+
import { useForm as go } from "./components/form/useForm.js";
|
|
40
|
+
import { buildDefaultSyntax as To } from "./components/form/Input.syntax.hook.js";
|
|
41
|
+
import { FullScreen as bo } from "./components/fullscreen/FullScreen.js";
|
|
42
|
+
import { Gantt as Io, getRelativeValue as Mo } from "./components/gantt/Gantt.js";
|
|
43
|
+
import { Layout as Ao } from "./components/layout/Layout.js";
|
|
44
|
+
import { Menu as Po, MenuArrow as vo, MenuCheckboxItem as wo, MenuContent as ho, MenuGroup as Ro, MenuItem as Lo, MenuItemIndicator as yo, MenuLabel as Go, MenuPortal as Vo, MenuSeparator as zo, MenuSub as Bo, MenuSubContent as Eo, MenuSubTrigger as ko, MenuTrigger as Ho } from "./components/menu/Menu.js";
|
|
45
|
+
import { Quote as Qo } from "./components/quote/Quote.js";
|
|
46
|
+
import { ResizableHandle as Zo, ResizablePanel as jo, ResizablePanelGroup as qo } from "./components/resizable/Resizable.js";
|
|
47
|
+
import { Row as Ko } from "./components/row/Row.js";
|
|
48
|
+
import { ScrollArea as Wo, ScrollAreaCorner as Xo, ScrollAreaScrollbar as Yo, ScrollAreaThumb as _o, ScrollAreaViewport as $o } from "./components/scroll-area/ScrollArea.js";
|
|
49
|
+
import { SegmentedControl as or, SegmentedControlItem as rr } from "./components/segmented-control/SegmentedControl.js";
|
|
50
|
+
import { Spacing as nr } from "./components/spacing/Spacing.js";
|
|
51
|
+
import { Tab as pr, TabContent as mr, TabList as lr, TabTrigger as ur } from "./components/tab/Tab.js";
|
|
52
|
+
import { Text as xr } from "./components/text/Text.js";
|
|
53
|
+
import { Toast as Cr, toast as gr } from "./components/toast/Toast.js";
|
|
54
|
+
import { Tooltip as Tr, TooltipArrow as dr, TooltipContent as sr, TooltipPortal as br, TooltipTrigger as cr } from "./components/tooltip/Tooltip.js";
|
|
55
|
+
import { ContextStore as Mr, ContextStoreProvider as Dr, useService as Ar, useStore as Fr } from "./utils/contextStore.js";
|
|
56
|
+
import { ReactiveArrayService as vr, useReactiveArrayService as wr } from "./utils/reactiveArrayService.js";
|
|
57
|
+
import { mergeComponentProps as Rr } from "./utils/component.js";
|
|
58
|
+
import { Colors as yr, hashToColor as Gr, withAlpha as Vr } from "./utils/color.js";
|
|
59
|
+
import { getDOMSizeFromCodeZeroSize as Br } from "./utils/size.js";
|
|
58
60
|
export {
|
|
59
61
|
r as Alert,
|
|
60
62
|
n as AuroraBackground,
|
|
61
63
|
p as Avatar,
|
|
62
|
-
|
|
63
|
-
|
|
64
|
+
l as Badge,
|
|
65
|
+
i as Breadcrumb,
|
|
64
66
|
f as Button,
|
|
65
67
|
g as ButtonGroup,
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
68
|
+
T as Card,
|
|
69
|
+
Me as CheckboxInput,
|
|
70
|
+
s as Col,
|
|
71
|
+
yr as Colors,
|
|
72
|
+
c as Command,
|
|
71
73
|
I as CommandDialog,
|
|
72
|
-
|
|
74
|
+
M as CommandEmpty,
|
|
73
75
|
D as CommandGroup,
|
|
74
76
|
A as CommandInput,
|
|
75
77
|
F as CommandItem,
|
|
76
78
|
P as CommandList,
|
|
77
79
|
v as CommandSeparator,
|
|
78
|
-
|
|
80
|
+
w as CommandShortcut,
|
|
79
81
|
R as Container,
|
|
80
82
|
y as ContextMenu,
|
|
81
83
|
G as ContextMenuArrow,
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
84
|
+
V as ContextMenuContent,
|
|
85
|
+
z as ContextMenuGroup,
|
|
86
|
+
B as ContextMenuItem,
|
|
87
|
+
E as ContextMenuLabel,
|
|
88
|
+
k as ContextMenuPortal,
|
|
87
89
|
H as ContextMenuSeparator,
|
|
88
90
|
O as ContextMenuSub,
|
|
89
91
|
Q as ContextMenuSubContent,
|
|
90
92
|
N as ContextMenuSubTrigger,
|
|
91
93
|
Z as ContextMenuTrigger,
|
|
92
|
-
|
|
93
|
-
|
|
94
|
+
Mr as ContextStore,
|
|
95
|
+
Dr as ContextStoreProvider,
|
|
94
96
|
q as DataTable,
|
|
95
97
|
K as DataTableColumn,
|
|
96
98
|
W as DataTableFilterInput,
|
|
97
99
|
_ as DataTableFilterSuggestionMenu,
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
Ho as
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
pr as
|
|
171
|
-
mr as
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
100
|
+
ee as Dialog,
|
|
101
|
+
oe as DialogClose,
|
|
102
|
+
re as DialogContent,
|
|
103
|
+
te as DialogDescription,
|
|
104
|
+
ne as DialogFooter,
|
|
105
|
+
ae as DialogHeader,
|
|
106
|
+
pe as DialogOverlay,
|
|
107
|
+
me as DialogPortal,
|
|
108
|
+
le as DialogTitle,
|
|
109
|
+
ue as DialogTrigger,
|
|
110
|
+
xe as Editor,
|
|
111
|
+
Ae as EditorInput,
|
|
112
|
+
Pe as EmailInput,
|
|
113
|
+
Se as FileTabs,
|
|
114
|
+
Te as FileTabsContent,
|
|
115
|
+
de as FileTabsList,
|
|
116
|
+
Ce as FileTabsService,
|
|
117
|
+
se as FileTabsTrigger,
|
|
118
|
+
ce as Flex,
|
|
119
|
+
bo as FullScreen,
|
|
120
|
+
Io as Gantt,
|
|
121
|
+
he as Input,
|
|
122
|
+
Le as InputDescription,
|
|
123
|
+
Ge as InputLabel,
|
|
124
|
+
ze as InputMessage,
|
|
125
|
+
Ee as InputSuggestionMenuContent,
|
|
126
|
+
ke as InputSuggestionMenuContentItems,
|
|
127
|
+
Ao as Layout,
|
|
128
|
+
Po as Menu,
|
|
129
|
+
vo as MenuArrow,
|
|
130
|
+
wo as MenuCheckboxItem,
|
|
131
|
+
ho as MenuContent,
|
|
132
|
+
Ro as MenuGroup,
|
|
133
|
+
Lo as MenuItem,
|
|
134
|
+
yo as MenuItemIndicator,
|
|
135
|
+
Go as MenuLabel,
|
|
136
|
+
Vo as MenuPortal,
|
|
137
|
+
zo as MenuSeparator,
|
|
138
|
+
Bo as MenuSub,
|
|
139
|
+
Eo as MenuSubContent,
|
|
140
|
+
ko as MenuSubTrigger,
|
|
141
|
+
Ho as MenuTrigger,
|
|
142
|
+
Oe as NumberInput,
|
|
143
|
+
Ne as PasswordInput,
|
|
144
|
+
qe as PinInput,
|
|
145
|
+
Je as PinInputField,
|
|
146
|
+
Ke as PinInputHiddenField,
|
|
147
|
+
Qo as Quote,
|
|
148
|
+
We as RadioGroup,
|
|
149
|
+
Ye as RadioInput,
|
|
150
|
+
vr as ReactiveArrayService,
|
|
151
|
+
Zo as ResizableHandle,
|
|
152
|
+
jo as ResizablePanel,
|
|
153
|
+
qo as ResizablePanelGroup,
|
|
154
|
+
Ko as Row,
|
|
155
|
+
Wo as ScrollArea,
|
|
156
|
+
Xo as ScrollAreaCorner,
|
|
157
|
+
Yo as ScrollAreaScrollbar,
|
|
158
|
+
_o as ScrollAreaThumb,
|
|
159
|
+
$o as ScrollAreaViewport,
|
|
160
|
+
or as SegmentedControl,
|
|
161
|
+
rr as SegmentedControlItem,
|
|
162
|
+
$e as SelectContent,
|
|
163
|
+
eo as SelectInput,
|
|
164
|
+
oo as SelectItem,
|
|
165
|
+
ro as SelectItemText,
|
|
166
|
+
to as SelectPortal,
|
|
167
|
+
no as SelectTrigger,
|
|
168
|
+
ao as SelectValue,
|
|
169
|
+
po as SelectViewport,
|
|
170
|
+
nr as Spacing,
|
|
171
|
+
lo as SwitchInput,
|
|
172
|
+
pr as Tab,
|
|
173
|
+
mr as TabContent,
|
|
174
|
+
lr as TabList,
|
|
175
|
+
ur as TabTrigger,
|
|
176
|
+
xr as Text,
|
|
177
|
+
io as TextAreaInput,
|
|
178
|
+
fo as TextInput,
|
|
179
|
+
Cr as Toast,
|
|
180
|
+
Tr as Tooltip,
|
|
181
|
+
dr as TooltipArrow,
|
|
182
|
+
sr as TooltipContent,
|
|
183
|
+
br as TooltipPortal,
|
|
184
|
+
cr as TooltipTrigger,
|
|
185
|
+
To as buildDefaultSyntax,
|
|
175
186
|
X as createFilterQueryLanguage,
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
187
|
+
ve as emailValidation,
|
|
188
|
+
Br as getDOMSizeFromCodeZeroSize,
|
|
189
|
+
Mo as getRelativeValue,
|
|
190
|
+
Gr as hashToColor,
|
|
191
|
+
Rr as mergeComponentProps,
|
|
192
|
+
Ze as passwordValidation,
|
|
193
|
+
gr as toast,
|
|
194
|
+
go as useForm,
|
|
195
|
+
wr as useReactiveArrayService,
|
|
196
|
+
Ar as useService,
|
|
197
|
+
Fr as useStore,
|
|
198
|
+
Vr as withAlpha
|
|
188
199
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@code0-tech/pictor",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.7.0",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "A simple template for a custom React component library",
|
|
6
6
|
"scripts": {
|
|
@@ -62,6 +62,7 @@
|
|
|
62
62
|
"@vitest/browser-playwright": "^4.1.2",
|
|
63
63
|
"@vitest/coverage-v8": "^4.1.2",
|
|
64
64
|
"@xyflow/react": "^12.10.1",
|
|
65
|
+
"avvvatars-react": "^0.4.2",
|
|
65
66
|
"axe-playwright": "^2.2.2",
|
|
66
67
|
"babel-loader": "^10.1.1",
|
|
67
68
|
"babel-plugin-react-compiler": "^19.1.0-rc.3",
|
|
@@ -91,7 +92,7 @@
|
|
|
91
92
|
"vite-plugin-dts": "^4.5.4",
|
|
92
93
|
"vite-plugin-lib-inject-css": "^2.2.2",
|
|
93
94
|
"vitest": "^4.1.2",
|
|
94
|
-
"
|
|
95
|
+
"@radix-ui/react-select": "^2.2.6"
|
|
95
96
|
},
|
|
96
97
|
"main": "dist/index.js",
|
|
97
98
|
"repository": {
|
|
@@ -124,6 +125,7 @@
|
|
|
124
125
|
"@uiw/codemirror-themes": "^4.25.4",
|
|
125
126
|
"@uiw/react-codemirror": "^4.25.4",
|
|
126
127
|
"@xyflow/react": "^12.10.0",
|
|
128
|
+
"avvvatars-react": "^0.4.2",
|
|
127
129
|
"cmdk": "^1.1.1",
|
|
128
130
|
"js-md5": "^0.8.3",
|
|
129
131
|
"merge-props": "^6.0.0",
|
|
@@ -132,7 +134,7 @@
|
|
|
132
134
|
"react-resizable-panels": "^4.3.1",
|
|
133
135
|
"react-zoom-pan-pinch": "^3.7.0",
|
|
134
136
|
"sonner": "^2.0.7",
|
|
135
|
-
"
|
|
137
|
+
"@radix-ui/react-select": "^2.2.6"
|
|
136
138
|
},
|
|
137
139
|
"publishConfig": {
|
|
138
140
|
"access": "public"
|