@cloudparker/moldex.js 0.0.65 → 0.0.67
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/services/dialog/dialog-service.d.ts +11 -11
- package/dist/services/navigation/navigation-service.d.ts +17 -0
- package/dist/services/navigation/navigation-service.js +38 -0
- package/dist/services/utils/melody-service.d.ts +5 -0
- package/dist/services/utils/melody-service.js +41 -0
- package/dist/tailwind.css +1 -1
- package/dist/views/core/button/components/button/button.svelte +84 -133
- package/dist/views/core/button/components/button/button.svelte.d.ts +8 -7
- package/dist/views/core/button/components/button-back/button-back.svelte +16 -29
- package/dist/views/core/button/components/button-close/button-close.svelte +2 -4
- package/dist/views/core/button/components/button-close/button-close.svelte.d.ts +2 -2
- package/dist/views/core/button/components/button-close-icon/button-close-icon.svelte +16 -30
- package/dist/views/core/button/components/button-dropdown/button-dropdown.svelte +86 -0
- package/dist/views/core/button/components/button-dropdown/button-dropdown.svelte.d.ts +38 -0
- package/dist/views/core/button/components/button-list-item/button-list-item.svelte +65 -132
- package/dist/views/core/button/components/button-list-item/button-list-item.svelte.d.ts +22 -31
- package/dist/views/core/button/components/button-menu/button-menu.svelte +72 -235
- package/dist/views/core/button/components/button-menu/button-menu.svelte.d.ts +23 -43
- package/dist/views/core/button/components/button-ok/button-ok.svelte +2 -4
- package/dist/views/core/button/components/button-ok/button-ok.svelte.d.ts +2 -2
- package/dist/views/core/button/components/button-search/button-search.svelte +39 -0
- package/dist/views/core/button/components/button-search/button-search.svelte.d.ts +31 -0
- package/dist/views/core/button/index.d.ts +8 -5
- package/dist/views/core/button/index.js +4 -2
- package/dist/views/core/content-area/components/content-area.svelte +27 -40
- package/dist/views/core/dialog/components/cropper-dialog/cropper-dialog.svelte +33 -49
- package/dist/views/core/dialog/components/dialog/dialog.svelte +164 -263
- package/dist/views/core/dialog/components/dialog/dialog.svelte.d.ts +12 -12
- package/dist/views/core/dialog/components/list-dialog/list-picker-dialog.svelte +112 -158
- package/dist/views/core/dialog/components/loading-dialog/loading-dialog.svelte +18 -30
- package/dist/views/core/dialog/components/msg-dialog/msg-dialog.svelte +13 -22
- package/dist/views/core/dialog/components/text-field-dialog/text-field-dialog.svelte +35 -41
- package/dist/views/core/dialog/components/text-field-dialog/text-field-dialog.svelte.d.ts +2 -2
- package/dist/views/core/dialog/components/textarea-field-dialog/textarea-field-dialog.svelte +25 -40
- package/dist/views/core/dialog/components/textarea-field-dialog/textarea-field-dialog.svelte.d.ts +2 -2
- package/dist/views/core/dialog/index.d.ts +2 -2
- package/dist/views/core/drawer/components/drawer/drawer.svelte +35 -57
- package/dist/views/core/icon/components/icon/icon.svelte +14 -26
- package/dist/views/core/icon/services/icon-path-service.d.ts +1 -0
- package/dist/views/core/icon/services/icon-path-service.js +1 -0
- package/dist/views/core/input/components/checkbox-field/checkbox-field.svelte +25 -44
- package/dist/views/core/input/components/color-field/color-field.svelte +69 -81
- package/dist/views/core/input/components/color-field/color-field.svelte.d.ts +2 -2
- package/dist/views/core/input/components/combobox-field/combobox-field.svelte +256 -331
- package/dist/views/core/input/components/combobox-field/combobox-field.svelte.d.ts +18 -17
- package/dist/views/core/input/components/date-field/date-field.svelte +30 -39
- package/dist/views/core/input/components/date-field/date-field.svelte.d.ts +2 -2
- package/dist/views/core/input/components/datetime-field/datetime-field.svelte +12 -18
- package/dist/views/core/input/components/datetime-field/datetime-field.svelte.d.ts +2 -2
- package/dist/views/core/input/components/email-field/email-field.svelte +12 -17
- package/dist/views/core/input/components/email-field/email-field.svelte.d.ts +2 -2
- package/dist/views/core/input/components/file-field/file-field.svelte +64 -78
- package/dist/views/core/input/components/file-field/file-field.svelte.d.ts +2 -2
- package/dist/views/core/input/components/input-field/input-field.svelte +159 -261
- package/dist/views/core/input/components/input-field/input-field.svelte.d.ts +8 -8
- package/dist/views/core/input/components/label/label.svelte +10 -24
- package/dist/views/core/input/components/number-field/number-field.svelte +12 -18
- package/dist/views/core/input/components/number-field/number-field.svelte.d.ts +2 -2
- package/dist/views/core/input/components/password-field/password-field.svelte +57 -70
- package/dist/views/core/input/components/password-field/password-field.svelte.d.ts +2 -2
- package/dist/views/core/input/components/phone-field/phone-field.svelte +118 -172
- package/dist/views/core/input/components/phone-field/phone-field.svelte.d.ts +2 -2
- package/dist/views/core/input/components/radio-field/radio-field.svelte +53 -84
- package/dist/views/core/input/components/radio-field/radio-field.svelte.d.ts +7 -7
- package/dist/views/core/input/components/range-field/range-field.svelte +42 -66
- package/dist/views/core/input/components/range-field/range-field.svelte.d.ts +2 -2
- package/dist/views/core/input/components/search-field/search-field.svelte +45 -62
- package/dist/views/core/input/components/search-field/search-field.svelte.d.ts +2 -2
- package/dist/views/core/input/components/text-field/text-field.svelte +16 -21
- package/dist/views/core/input/components/text-field/text-field.svelte.d.ts +2 -2
- package/dist/views/core/input/components/textarea-field/textarea-field.svelte +12 -17
- package/dist/views/core/input/components/textarea-field/textarea-field.svelte.d.ts +2 -2
- package/dist/views/core/input/components/time-field/time-field.svelte +12 -17
- package/dist/views/core/input/components/time-field/time-field.svelte.d.ts +2 -2
- package/dist/views/core/input/index.d.ts +4 -3
- package/dist/views/core/navbar/components/navbar/navbar.svelte +39 -77
- package/dist/views/core/no-data/components/no-data/no-data.svelte +20 -37
- package/dist/views/core/pagination/components/pagination/pagination.svelte +73 -102
- package/dist/views/core/progressbar/components/progressbar/progressbar.svelte +23 -37
- package/dist/views/core/ruler/components/vertical-ruler/verticcal-ruler.svelte +2 -6
- package/dist/views/core/screen-detector/components/screen-detector.svelte +9 -13
- package/dist/views/core/sidebar/components/sidebar.svelte +23 -36
- package/dist/views/core/spinner/components/spinner/spinner.svelte +2 -7
- package/dist/views/core/text/components/text-await/text-await.svelte +2 -8
- package/dist/views/core/text/components/text-copy/text-copy.svelte +17 -28
- package/dist/views/core/text/components/text-country/text-country.svelte +29 -41
- package/dist/views/core/text/components/text-country-state/text-country-state.svelte +29 -37
- package/dist/views/core/text/components/text-currency/text-currency.svelte +10 -21
- package/dist/views/core/text/components/text-date/text-date.svelte +21 -33
- package/dist/views/core/text/components/text-email/text-email.svelte +4 -13
- package/dist/views/core/text/components/text-html/text-html.svelte +2 -3
- package/dist/views/core/text/components/text-phone/text-phone.svelte +4 -13
- package/dist/views/core/toast/components/toast/toast.svelte +21 -44
- package/package.json +1 -1
|
@@ -1,29 +1,17 @@
|
|
|
1
|
-
<script lang="ts">
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
path,
|
|
16
|
-
className = '',
|
|
17
|
-
size = 24,
|
|
18
|
-
fill = 'currentColor',
|
|
19
|
-
viewBox = '',
|
|
20
|
-
color,
|
|
21
|
-
sizeClassName = 'w-6 h-6'
|
|
22
|
-
}: IconPropsType = $props();
|
|
23
|
-
|
|
24
|
-
$effect(() => {
|
|
25
|
-
viewBox = viewBox || `0 0 ${size} ${size}`;
|
|
26
|
-
});
|
|
1
|
+
<script lang="ts">import ColorField from "../../../input/components/color-field/color-field.svelte";
|
|
2
|
+
import "../../../../../tailwind.css";
|
|
3
|
+
let {
|
|
4
|
+
path,
|
|
5
|
+
className = "",
|
|
6
|
+
size = 24,
|
|
7
|
+
fill = "currentColor",
|
|
8
|
+
viewBox = "",
|
|
9
|
+
color,
|
|
10
|
+
sizeClassName = "w-6 h-6"
|
|
11
|
+
} = $props();
|
|
12
|
+
$effect(() => {
|
|
13
|
+
viewBox = viewBox || `0 0 ${size} ${size}`;
|
|
14
|
+
});
|
|
27
15
|
</script>
|
|
28
16
|
|
|
29
17
|
<svg class="align-middle {sizeClassName} {className}" {viewBox} fill={color || fill}>
|
|
@@ -20,3 +20,4 @@ export declare const mdiPhone = "M6.62,10.79C8.06,13.62 10.38,15.94 13.21,17.38L
|
|
|
20
20
|
export declare const mdiSquare = "M3,3V21H21V3";
|
|
21
21
|
export declare const mdiUnfoldMoreHorizontal = "M12,18.17L8.83,15L7.42,16.41L12,21L16.59,16.41L15.17,15M12,5.83L15.17,9L16.58,7.59L12,3L7.41,7.59L8.83,9L12,5.83Z";
|
|
22
22
|
export declare const mdiOpenInNew = "M14,3V5H17.59L7.76,14.83L9.17,16.24L19,6.41V10H21V3M19,19H5V5H12V3H5C3.89,3 3,3.9 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V12H19V19Z";
|
|
23
|
+
export declare const mdiDotsHorizontal = "M16,12A2,2 0 0,1 18,10A2,2 0 0,1 20,12A2,2 0 0,1 18,14A2,2 0 0,1 16,12M10,12A2,2 0 0,1 12,10A2,2 0 0,1 14,12A2,2 0 0,1 12,14A2,2 0 0,1 10,12M4,12A2,2 0 0,1 6,10A2,2 0 0,1 8,12A2,2 0 0,1 6,14A2,2 0 0,1 4,12Z";
|
|
@@ -21,3 +21,4 @@ export const mdiPhone = "M6.62,10.79C8.06,13.62 10.38,15.94 13.21,17.38L15.41,15
|
|
|
21
21
|
export const mdiSquare = "M3,3V21H21V3";
|
|
22
22
|
export const mdiUnfoldMoreHorizontal = "M12,18.17L8.83,15L7.42,16.41L12,21L16.59,16.41L15.17,15M12,5.83L15.17,9L16.58,7.59L12,3L7.41,7.59L8.83,9L12,5.83Z";
|
|
23
23
|
export const mdiOpenInNew = "M14,3V5H17.59L7.76,14.83L9.17,16.24L19,6.41V10H21V3M19,19H5V5H12V3H5C3.89,3 3,3.9 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V12H19V19Z";
|
|
24
|
+
export const mdiDotsHorizontal = "M16,12A2,2 0 0,1 18,10A2,2 0 0,1 20,12A2,2 0 0,1 18,14A2,2 0 0,1 16,12M10,12A2,2 0 0,1 12,10A2,2 0 0,1 14,12A2,2 0 0,1 12,14A2,2 0 0,1 10,12M4,12A2,2 0 0,1 6,10A2,2 0 0,1 8,12A2,2 0 0,1 6,14A2,2 0 0,1 4,12Z";
|
|
@@ -1,47 +1,28 @@
|
|
|
1
|
-
<script lang="ts">
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
position = 'left',
|
|
27
|
-
value = $bindable(false)
|
|
28
|
-
}: CheckboxPropsType = $props();
|
|
29
|
-
|
|
30
|
-
let inputRef: HTMLInputElement | null = $state(null);
|
|
31
|
-
|
|
32
|
-
export function getElement() {
|
|
33
|
-
return inputRef;
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
export function select() {
|
|
37
|
-
return inputRef && (inputRef as HTMLInputElement).select();
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
function handleChange(ev: Event) {
|
|
41
|
-
if (onChange) {
|
|
42
|
-
onChange(value);
|
|
43
|
-
}
|
|
44
|
-
}
|
|
1
|
+
<script lang="ts">let {
|
|
2
|
+
className,
|
|
3
|
+
containerClassName,
|
|
4
|
+
desc,
|
|
5
|
+
descClassName,
|
|
6
|
+
id,
|
|
7
|
+
label,
|
|
8
|
+
labelClassName,
|
|
9
|
+
name,
|
|
10
|
+
onChange,
|
|
11
|
+
position = "left",
|
|
12
|
+
value = $bindable(false)
|
|
13
|
+
} = $props();
|
|
14
|
+
let inputRef = $state(null);
|
|
15
|
+
export function getElement() {
|
|
16
|
+
return inputRef;
|
|
17
|
+
}
|
|
18
|
+
export function select() {
|
|
19
|
+
return inputRef && inputRef.select();
|
|
20
|
+
}
|
|
21
|
+
function handleChange(ev) {
|
|
22
|
+
if (onChange) {
|
|
23
|
+
onChange(value);
|
|
24
|
+
}
|
|
25
|
+
}
|
|
45
26
|
</script>
|
|
46
27
|
|
|
47
28
|
{#snippet labelSnippet()}
|
|
@@ -1,84 +1,72 @@
|
|
|
1
|
-
<script lang="ts">
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
case 'xs':
|
|
71
|
-
btnIconSizeClassName = '!h-4 !w-4';
|
|
72
|
-
break;
|
|
73
|
-
}
|
|
74
|
-
}
|
|
75
|
-
});
|
|
76
|
-
|
|
77
|
-
$effect(() => {
|
|
78
|
-
if (!appearance || appearance == 'normal') {
|
|
79
|
-
btnRoundedClassName = 'rounded-tr-lg rounded-br-lg';
|
|
80
|
-
}
|
|
81
|
-
});
|
|
1
|
+
<script lang="ts">import { ripple } from "../../../../../actions";
|
|
2
|
+
import { colorToHex, isValidHexColor } from "../../../../../services";
|
|
3
|
+
import { mdiSquare } from "../../../icon";
|
|
4
|
+
import Icon from "../../../icon/components/icon/icon.svelte";
|
|
5
|
+
import InputField, {} from "../input-field/input-field.svelte";
|
|
6
|
+
let {
|
|
7
|
+
id,
|
|
8
|
+
name,
|
|
9
|
+
size,
|
|
10
|
+
appearance,
|
|
11
|
+
value = $bindable("#000000"),
|
|
12
|
+
...props
|
|
13
|
+
} = $props();
|
|
14
|
+
let colorRef;
|
|
15
|
+
let btnIconSizeClassName = $state("");
|
|
16
|
+
let btnRoundedClassName = $state("");
|
|
17
|
+
let colorValue = $state("#000000");
|
|
18
|
+
let inputRef = $state(null);
|
|
19
|
+
export function focus() {
|
|
20
|
+
inputRef?.focus();
|
|
21
|
+
}
|
|
22
|
+
export function getElement() {
|
|
23
|
+
return inputRef;
|
|
24
|
+
}
|
|
25
|
+
export function select() {
|
|
26
|
+
return inputRef && inputRef.select();
|
|
27
|
+
}
|
|
28
|
+
function handleColorBtnClick() {
|
|
29
|
+
if (colorRef) {
|
|
30
|
+
colorRef.click();
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
function handleColorPickerChange(ev) {
|
|
34
|
+
let input = ev?.target;
|
|
35
|
+
if (input) {
|
|
36
|
+
value = input.value;
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
$effect(() => {
|
|
40
|
+
if (isValidHexColor(value)) {
|
|
41
|
+
colorValue = value;
|
|
42
|
+
if (colorRef) {
|
|
43
|
+
colorRef.value = colorToHex(value);
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
});
|
|
47
|
+
$effect(() => {
|
|
48
|
+
if (size) {
|
|
49
|
+
switch (size) {
|
|
50
|
+
case "lg":
|
|
51
|
+
btnIconSizeClassName = "!h-7 !w-7";
|
|
52
|
+
break;
|
|
53
|
+
case "md":
|
|
54
|
+
btnIconSizeClassName = "!h-6 !w-6";
|
|
55
|
+
break;
|
|
56
|
+
case "sm":
|
|
57
|
+
btnIconSizeClassName = "!h-5 !w-5";
|
|
58
|
+
break;
|
|
59
|
+
case "xs":
|
|
60
|
+
btnIconSizeClassName = "!h-4 !w-4";
|
|
61
|
+
break;
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
});
|
|
65
|
+
$effect(() => {
|
|
66
|
+
if (!appearance || appearance == "normal") {
|
|
67
|
+
btnRoundedClassName = "rounded-tr-lg rounded-br-lg";
|
|
68
|
+
}
|
|
69
|
+
});
|
|
82
70
|
</script>
|
|
83
71
|
|
|
84
72
|
{#snippet colorButton()}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { type
|
|
1
|
+
import { type InputFieldProps } from '../input-field/input-field.svelte';
|
|
2
2
|
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
|
3
3
|
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
|
4
4
|
$$bindings?: Bindings;
|
|
@@ -12,7 +12,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
|
|
|
12
12
|
};
|
|
13
13
|
z_$$bindings?: Bindings;
|
|
14
14
|
}
|
|
15
|
-
declare const ColorField: $$__sveltets_2_IsomorphicComponent<
|
|
15
|
+
declare const ColorField: $$__sveltets_2_IsomorphicComponent<InputFieldProps & {
|
|
16
16
|
value?: string;
|
|
17
17
|
}, {
|
|
18
18
|
[evt: string]: CustomEvent<any>;
|