@websline/system-components 1.0.12 → 1.0.14
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/components/atoms/icon/components/Ai.svelte +30 -0
- package/dist/components/atoms/icon/components/Ai.svelte.d.ts +41 -0
- package/dist/components/atoms/icon/index.d.ts +18 -0
- package/dist/components/atoms/icon/index.js +2 -0
- package/dist/components/molecules/tagSelector/Dropdown.svelte +3 -1
- package/dist/components/molecules/tagSelector/tagSelector.variants.d.ts +8 -0
- package/dist/components/molecules/tagSelector/tagSelector.variants.js +8 -0
- package/package.json +1 -1
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
<script>
|
|
2
|
+
/**
|
|
3
|
+
* @typedef {Object} Props
|
|
4
|
+
* @property {string} [color=""] Icon color
|
|
5
|
+
* @property {number} [height=24] Icon height
|
|
6
|
+
* @property {number} [strokeWidth=24] Icon StrokeWidth
|
|
7
|
+
* @property {number} [width=24] Icon width
|
|
8
|
+
*/
|
|
9
|
+
|
|
10
|
+
/** @type {Props} */
|
|
11
|
+
let { color, height, width, strokeWidth, ...rest } = $props();
|
|
12
|
+
</script>
|
|
13
|
+
|
|
14
|
+
<svg
|
|
15
|
+
{height}
|
|
16
|
+
{width}
|
|
17
|
+
viewBox="0 0 24 24"
|
|
18
|
+
fill="none"
|
|
19
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
20
|
+
{...rest}>
|
|
21
|
+
<path
|
|
22
|
+
d="M8 5C5.42857 4.57143 5.42857 4.57143 5 2C4.57143 4.57143 4.57143 4.57143 2 5C4.57143 5.42857 4.57143 5.42857 5 8C5.42857 5.42857 5.42857 5.42857 8 5Z"
|
|
23
|
+
stroke="#7fc1fd"
|
|
24
|
+
stroke-width={strokeWidth}
|
|
25
|
+
stroke-linecap="round"
|
|
26
|
+
stroke-linejoin="round" />
|
|
27
|
+
<path
|
|
28
|
+
d="M3 21H2.25C2.25 21.4142 2.58579 21.75 3 21.75V21ZM19.639 9.08297L20.1694 9.61331L19.639 9.08297ZM19.6391 4.36106L20.1695 3.83074L19.6391 4.36106ZM9.90081 18.821L9.37048 18.2907L9.90081 18.821ZM5.17897 14.099L5.7093 14.6293L5.17897 14.099ZM14.9171 4.36098L14.3868 3.83065L14.9171 4.36098ZM13.4493 20.2522C13.1681 20.5563 13.1867 21.0309 13.4908 21.3121C13.7949 21.5933 14.2694 21.5747 14.5507 21.2706L14 20.7614L13.4493 20.2522ZM22.5099 20.848C22.8136 20.5664 22.8316 20.0919 22.55 19.7881C22.2685 19.4843 21.7939 19.4663 21.4901 19.7479L22 20.2979L22.5099 20.848ZM14.9171 4.36098L14.3868 3.83065L4.64865 13.5687L5.17897 14.099L5.7093 14.6293L15.4475 4.89132L14.9171 4.36098ZM3 19.3594H2.25V21H3H3.75V19.3594H3ZM3 21V21.75H4.64029V21V20.25H3V21ZM9.90081 18.821L10.4311 19.3514L20.1694 9.61331L19.639 9.08297L19.1087 8.55264L9.37048 18.2907L9.90081 18.821ZM19.639 9.08297L20.1694 9.61331C21.7662 8.01652 21.7662 5.42759 20.1695 3.83074L19.6391 4.36106L19.1088 4.89138C20.1198 5.90243 20.1198 7.54162 19.1087 8.55264L19.639 9.08297ZM4.64029 21V21.75C6.81227 21.75 8.8953 20.8872 10.4311 19.3514L9.90081 18.821L9.37048 18.2907C8.11595 19.5452 6.41445 20.25 4.64029 20.25V21ZM5.17897 14.099L4.64865 13.5687C3.11282 15.1045 2.25 17.1875 2.25 19.3594H3H3.75C3.75 17.5853 4.45478 15.8838 5.7093 14.6293L5.17897 14.099ZM14.9171 4.36098L15.4475 4.89132C16.4585 3.88028 18.0978 3.88031 19.1088 4.89138L19.6391 4.36106L20.1695 3.83074C18.5727 2.23386 15.9837 2.23382 14.3868 3.83065L14.9171 4.36098ZM14 20.7614C14.5507 21.2706 14.5505 21.2708 14.5504 21.2709C14.5504 21.2709 14.5502 21.2711 14.5502 21.2711C14.5501 21.2712 14.55 21.2713 14.55 21.2713C14.5499 21.2714 14.5501 21.2712 14.5504 21.2709C14.551 21.2703 14.5523 21.2689 14.5543 21.2667C14.5583 21.2625 14.565 21.2555 14.5743 21.2458C14.5929 21.2265 14.6217 21.197 14.6597 21.1593C14.7359 21.0838 14.8481 20.9765 14.9875 20.8539C15.2702 20.6053 15.6473 20.3095 16.052 20.0844C16.4686 19.8528 16.8395 19.7381 17.131 19.751C17.3666 19.7614 17.6194 19.8542 17.8704 20.242L18.5 19.8345L19.1296 19.4269C18.6306 18.6561 17.9459 18.2855 17.1971 18.2524C16.5043 18.2218 15.8439 18.4838 15.323 18.7735C14.7902 19.0698 14.3235 19.4403 13.9969 19.7275C13.8316 19.8729 13.6977 20.0009 13.6039 20.0938C13.557 20.1403 13.5199 20.1782 13.4938 20.2053C13.4808 20.2189 13.4705 20.2297 13.463 20.2376C13.4593 20.2416 13.4563 20.2448 13.454 20.2472C13.4528 20.2485 13.4519 20.2495 13.4511 20.2503C13.4507 20.2507 13.4504 20.2511 13.4501 20.2514C13.4499 20.2516 13.4498 20.2518 13.4497 20.2519C13.4495 20.2521 13.4493 20.2522 14 20.7614ZM18.5 19.8345L17.8704 20.242C18.313 20.9259 18.8355 21.3651 19.4122 21.5852C19.987 21.8046 20.5403 21.7776 20.9963 21.6623C21.4463 21.5486 21.8203 21.345 22.0738 21.1796C22.2028 21.0954 22.3066 21.0173 22.3801 20.9584C22.417 20.9288 22.4466 20.9038 22.4684 20.885C22.4792 20.8755 22.4882 20.8676 22.4951 20.8614C22.4986 20.8583 22.5016 20.8556 22.504 20.8533C22.5052 20.8522 22.5063 20.8512 22.5073 20.8503C22.5078 20.8499 22.5083 20.8495 22.5087 20.8491C22.5089 20.8489 22.5092 20.8486 22.5093 20.8485C22.5096 20.8482 22.5099 20.848 22 20.2979C21.4901 19.7479 21.4904 19.7477 21.4907 19.7474C21.4907 19.7474 21.491 19.7471 21.4911 19.747C21.4914 19.7467 21.4917 19.7465 21.4919 19.7462C21.4924 19.7458 21.4928 19.7454 21.4931 19.7452C21.4936 19.7447 21.4937 19.7447 21.4933 19.745C21.4926 19.7456 21.4901 19.7478 21.486 19.7514C21.4777 19.7586 21.4629 19.7712 21.4422 19.7878C21.4004 19.8212 21.3362 19.8698 21.2543 19.9232C21.086 20.033 20.8662 20.148 20.6287 20.2081C20.3972 20.2666 20.1693 20.2686 19.9471 20.1838C19.727 20.0998 19.437 19.9018 19.1296 19.4269L18.5 19.8345Z"
|
|
29
|
+
fill={color} />
|
|
30
|
+
</svg>
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
export default Ai;
|
|
2
|
+
type Ai = {
|
|
3
|
+
$on?(type: string, callback: (e: any) => void): () => void;
|
|
4
|
+
$set?(props: Partial<Props>): void;
|
|
5
|
+
};
|
|
6
|
+
declare const Ai: import("svelte").Component<{
|
|
7
|
+
/**
|
|
8
|
+
* Icon color
|
|
9
|
+
*/
|
|
10
|
+
color?: string;
|
|
11
|
+
/**
|
|
12
|
+
* Icon height
|
|
13
|
+
*/
|
|
14
|
+
height?: number;
|
|
15
|
+
/**
|
|
16
|
+
* Icon StrokeWidth
|
|
17
|
+
*/
|
|
18
|
+
strokeWidth?: number;
|
|
19
|
+
/**
|
|
20
|
+
* Icon width
|
|
21
|
+
*/
|
|
22
|
+
width?: number;
|
|
23
|
+
}, {}, "">;
|
|
24
|
+
type Props = {
|
|
25
|
+
/**
|
|
26
|
+
* Icon color
|
|
27
|
+
*/
|
|
28
|
+
color?: string;
|
|
29
|
+
/**
|
|
30
|
+
* Icon height
|
|
31
|
+
*/
|
|
32
|
+
height?: number;
|
|
33
|
+
/**
|
|
34
|
+
* Icon StrokeWidth
|
|
35
|
+
*/
|
|
36
|
+
strokeWidth?: number;
|
|
37
|
+
/**
|
|
38
|
+
* Icon width
|
|
39
|
+
*/
|
|
40
|
+
width?: number;
|
|
41
|
+
};
|
|
@@ -35,6 +35,24 @@ export const registry: {
|
|
|
35
35
|
*/
|
|
36
36
|
width?: number;
|
|
37
37
|
}, {}, "">;
|
|
38
|
+
ai: import("svelte").Component<{
|
|
39
|
+
/**
|
|
40
|
+
* Icon color
|
|
41
|
+
*/
|
|
42
|
+
color?: string;
|
|
43
|
+
/**
|
|
44
|
+
* Icon height
|
|
45
|
+
*/
|
|
46
|
+
height?: number;
|
|
47
|
+
/**
|
|
48
|
+
* Icon StrokeWidth
|
|
49
|
+
*/
|
|
50
|
+
strokeWidth?: number;
|
|
51
|
+
/**
|
|
52
|
+
* Icon width
|
|
53
|
+
*/
|
|
54
|
+
width?: number;
|
|
55
|
+
}, {}, "">;
|
|
38
56
|
attach: import("svelte").Component<{
|
|
39
57
|
/**
|
|
40
58
|
* Icon color
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import Academy from "./components/Academy.svelte";
|
|
2
2
|
import Add from "./components/Add.svelte";
|
|
3
|
+
import Ai from "./components/Ai.svelte";
|
|
3
4
|
import Attach from "./components/Attach.svelte";
|
|
4
5
|
import Block from "./components/Block.svelte";
|
|
5
6
|
import Bold from "./components/Bold.svelte";
|
|
@@ -41,6 +42,7 @@ import WebslineSupport from "./components/WebslineSupport.svelte";
|
|
|
41
42
|
export const registry = {
|
|
42
43
|
academy: Academy,
|
|
43
44
|
add: Add,
|
|
45
|
+
ai: Ai,
|
|
44
46
|
attach: Attach,
|
|
45
47
|
block: Block,
|
|
46
48
|
bold: Bold,
|
|
@@ -61,12 +61,14 @@
|
|
|
61
61
|
onDestroy(() => {
|
|
62
62
|
inputRef?.removeAttribute("aria-activedescendant");
|
|
63
63
|
});
|
|
64
|
+
|
|
65
|
+
let showDropdown = $derived(filtered.length > 0 || showCreate);
|
|
64
66
|
</script>
|
|
65
67
|
|
|
66
68
|
<svelte:window onscroll={updateDropdownPosition} onresize={updateDropdownPosition} />
|
|
67
69
|
|
|
68
70
|
<div
|
|
69
|
-
class={styles.dropdown({ dropdownPosition })}
|
|
71
|
+
class={styles.dropdown({ dropdownPosition, showDropdown })}
|
|
70
72
|
id={localValues.id}
|
|
71
73
|
role="listbox"
|
|
72
74
|
style={`max-height: ${dropdownMaxHeight}px`}
|
|
@@ -7,6 +7,14 @@ export const tagSelectorVariants: import("tailwind-variants").TVReturnType<{
|
|
|
7
7
|
dropdown: string;
|
|
8
8
|
};
|
|
9
9
|
};
|
|
10
|
+
showDropdown: {
|
|
11
|
+
true: {
|
|
12
|
+
dropdown: string;
|
|
13
|
+
};
|
|
14
|
+
false: {
|
|
15
|
+
dropdown: string;
|
|
16
|
+
};
|
|
17
|
+
};
|
|
10
18
|
}, {
|
|
11
19
|
base: string;
|
|
12
20
|
valueList: string;
|