@luminescent/ui-qwik 2.1.0 → 3.0.2
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/lib/index.qwik.cjs +212 -126
- package/lib/index.qwik.mjs +213 -127
- package/lib-types/components/docs/SelectMenu.d.ts +2 -0
- package/lib-types/components/elements/Dropdown.d.ts +3 -9
- package/lib-types/components/elements/SelectMenu.d.ts +16 -0
- package/lib-types/components/elements.d.ts +1 -0
- package/lib-types/components/logos/IconProps.d.ts +3 -1
- package/lib-types/svg/Menu.d.ts +2 -0
- package/package.json +2 -2
package/lib/index.qwik.cjs
CHANGED
|
@@ -2,34 +2,43 @@
|
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
3
|
const jsxRuntime = require("@builder.io/qwik/jsx-runtime");
|
|
4
4
|
const qwik = require("@builder.io/qwik");
|
|
5
|
-
const Link = qwik.component$((props) => {
|
|
6
|
-
return /* @__PURE__ */ jsxRuntime.
|
|
5
|
+
const Link = qwik.component$(({ size, ...props }) => {
|
|
6
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("svg", {
|
|
7
7
|
xmlns: "http://www.w3.org/2000/svg",
|
|
8
|
-
|
|
8
|
+
width: size,
|
|
9
|
+
height: size,
|
|
10
|
+
viewBox: "0 0 24 24",
|
|
11
|
+
fill: "none",
|
|
12
|
+
stroke: "currentColor",
|
|
13
|
+
"stroke-width": "2",
|
|
14
|
+
"stroke-linecap": "round",
|
|
15
|
+
"stroke-linejoin": "round",
|
|
16
|
+
class: "lucide lucide-link2-icon lucide-link-2",
|
|
9
17
|
...props,
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
"
|
|
18
|
-
|
|
18
|
+
children: [
|
|
19
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
20
|
+
d: "M9 17H7A5 5 0 0 1 7 7h2"
|
|
21
|
+
}),
|
|
22
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
23
|
+
d: "M15 7h2a5 5 0 1 1 0 10h-2"
|
|
24
|
+
}),
|
|
25
|
+
/* @__PURE__ */ jsxRuntime.jsx("line", {
|
|
26
|
+
x1: "8",
|
|
27
|
+
x2: "16",
|
|
28
|
+
y1: "12",
|
|
29
|
+
y2: "12"
|
|
30
|
+
})
|
|
31
|
+
]
|
|
19
32
|
});
|
|
20
33
|
});
|
|
21
34
|
const Anchor = qwik.component$(({ id, ...props }) => /* @__PURE__ */ jsxRuntime.jsxs("div", {
|
|
22
35
|
...props,
|
|
23
36
|
class: {
|
|
24
|
-
"group flex items-center gap-2": true,
|
|
37
|
+
"group flex items-center gap-2 scroll-mt-32": true,
|
|
25
38
|
...props.class
|
|
26
39
|
},
|
|
27
40
|
children: [
|
|
28
41
|
/* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, {}),
|
|
29
|
-
id && /* @__PURE__ */ jsxRuntime.jsx("span", {
|
|
30
|
-
id,
|
|
31
|
-
class: "pointer-events-none -mt-32 block h-32"
|
|
32
|
-
}),
|
|
33
42
|
id && /* @__PURE__ */ jsxRuntime.jsx("a", {
|
|
34
43
|
href: `#${id}`,
|
|
35
44
|
onClick$: async () => {
|
|
@@ -37,7 +46,7 @@ const Anchor = qwik.component$(({ id, ...props }) => /* @__PURE__ */ jsxRuntime.
|
|
|
37
46
|
},
|
|
38
47
|
children: /* @__PURE__ */ jsxRuntime.jsx(Link, {
|
|
39
48
|
class: "opacity-10 transition-all duration-300 group-hover:opacity-100 group-hover:duration-75",
|
|
40
|
-
|
|
49
|
+
size: 20
|
|
41
50
|
})
|
|
42
51
|
})
|
|
43
52
|
]
|
|
@@ -336,28 +345,34 @@ function rgbToHsv(color) {
|
|
|
336
345
|
v
|
|
337
346
|
};
|
|
338
347
|
}
|
|
339
|
-
const Shuffle = qwik.component$((props) => {
|
|
348
|
+
const Shuffle = qwik.component$(({ size, ...props }) => {
|
|
340
349
|
return /* @__PURE__ */ jsxRuntime.jsxs("svg", {
|
|
341
350
|
xmlns: "http://www.w3.org/2000/svg",
|
|
342
|
-
|
|
351
|
+
width: size,
|
|
352
|
+
height: size,
|
|
353
|
+
viewBox: "0 0 24 24",
|
|
354
|
+
fill: "none",
|
|
355
|
+
stroke: "currentColor",
|
|
356
|
+
"stroke-width": "2",
|
|
357
|
+
"stroke-linecap": "round",
|
|
358
|
+
"stroke-linejoin": "round",
|
|
359
|
+
class: "lucide lucide-shuffle-icon lucide-shuffle",
|
|
343
360
|
...props,
|
|
344
|
-
height: props.width,
|
|
345
361
|
children: [
|
|
346
362
|
/* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
347
|
-
|
|
348
|
-
stroke: "currentColor",
|
|
349
|
-
"stroke-linecap": "round",
|
|
350
|
-
"stroke-linejoin": "round",
|
|
351
|
-
"stroke-width": "32",
|
|
352
|
-
d: "M400 304l48 48-48 48M400 112l48 48-48 48M64 352h85.19a80 80 0 0066.56-35.62L256 256"
|
|
363
|
+
d: "m18 14 4 4-4 4"
|
|
353
364
|
}),
|
|
354
365
|
/* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
355
|
-
d: "
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
"
|
|
359
|
-
|
|
360
|
-
|
|
366
|
+
d: "m18 2 4 4-4 4"
|
|
367
|
+
}),
|
|
368
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
369
|
+
d: "M2 18h1.973a4 4 0 0 0 3.3-1.7l5.454-8.6a4 4 0 0 1 3.3-1.7H22"
|
|
370
|
+
}),
|
|
371
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
372
|
+
d: "M2 6h1.972a4 4 0 0 1 3.6 2.2"
|
|
373
|
+
}),
|
|
374
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
375
|
+
d: "M22 18h-6.041a4 4 0 0 1-3.3-1.8l-.359-.45"
|
|
361
376
|
})
|
|
362
377
|
]
|
|
363
378
|
});
|
|
@@ -590,7 +605,7 @@ const ColorPicker = qwik.component$(({ id, value = "#000000", colors = [
|
|
|
590
605
|
await setColor(color);
|
|
591
606
|
},
|
|
592
607
|
children: /* @__PURE__ */ jsxRuntime.jsx(Shuffle, {
|
|
593
|
-
class: "
|
|
608
|
+
class: "p-0.5 pl-0.5 text-gray-300"
|
|
594
609
|
})
|
|
595
610
|
})
|
|
596
611
|
]
|
|
@@ -598,23 +613,49 @@ const ColorPicker = qwik.component$(({ id, value = "#000000", colors = [
|
|
|
598
613
|
]
|
|
599
614
|
});
|
|
600
615
|
});
|
|
601
|
-
const ChevronDown = qwik.component$((props) => {
|
|
616
|
+
const ChevronDown = qwik.component$(({ size, ...props }) => {
|
|
602
617
|
return /* @__PURE__ */ jsxRuntime.jsx("svg", {
|
|
603
618
|
xmlns: "http://www.w3.org/2000/svg",
|
|
604
|
-
|
|
619
|
+
width: size,
|
|
620
|
+
height: size,
|
|
621
|
+
viewBox: "0 0 24 24",
|
|
622
|
+
fill: "none",
|
|
623
|
+
stroke: "currentColor",
|
|
624
|
+
"stroke-width": "2",
|
|
625
|
+
"stroke-linecap": "round",
|
|
626
|
+
"stroke-linejoin": "round",
|
|
627
|
+
class: "lucide lucide-chevron-down-icon lucide-chevron-down",
|
|
605
628
|
...props,
|
|
606
|
-
height: props.width,
|
|
607
629
|
children: /* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
608
|
-
|
|
609
|
-
stroke: "currentColor",
|
|
610
|
-
"stroke-linecap": "round",
|
|
611
|
-
"stroke-linejoin": "round",
|
|
612
|
-
"stroke-width": "48",
|
|
613
|
-
d: "M112 184l144 144 144-144"
|
|
630
|
+
d: "m6 9 6 6 6-6"
|
|
614
631
|
})
|
|
615
632
|
});
|
|
616
633
|
});
|
|
617
|
-
const Dropdown = qwik.component$((props) => {
|
|
634
|
+
const Dropdown = qwik.component$(({ class: Class, hover, opened, ...props }) => {
|
|
635
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("button", {
|
|
636
|
+
class: {
|
|
637
|
+
"lum-btn": true,
|
|
638
|
+
...Class
|
|
639
|
+
},
|
|
640
|
+
...props,
|
|
641
|
+
children: [
|
|
642
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
643
|
+
class: "flex-1 text-left",
|
|
644
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, {})
|
|
645
|
+
}),
|
|
646
|
+
/* @__PURE__ */ jsxRuntime.jsx(ChevronDown, {
|
|
647
|
+
size: 16,
|
|
648
|
+
class: {
|
|
649
|
+
"ease-out motion-safe:transition-all": true,
|
|
650
|
+
"rotate-180 transform": opened,
|
|
651
|
+
"duration-300 group-hover:rotate-180 group-hover:transform group-hover:duration-75": hover,
|
|
652
|
+
"focus-within:rotate-180 focus-within:transform focus-within:duration-75": true
|
|
653
|
+
}
|
|
654
|
+
})
|
|
655
|
+
]
|
|
656
|
+
});
|
|
657
|
+
});
|
|
658
|
+
const SelectMenu = qwik.component$((props) => {
|
|
618
659
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", {
|
|
619
660
|
class: "flex flex-col",
|
|
620
661
|
children: [
|
|
@@ -623,13 +664,27 @@ const Dropdown = qwik.component$((props) => {
|
|
|
623
664
|
class: "pb-1 text-gray-300 select-none",
|
|
624
665
|
children: /* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, {})
|
|
625
666
|
}),
|
|
626
|
-
/* @__PURE__ */ jsxRuntime.
|
|
627
|
-
...props
|
|
667
|
+
/* @__PURE__ */ jsxRuntime.jsxs(SelectMenuRaw, {
|
|
668
|
+
...props,
|
|
669
|
+
children: [
|
|
670
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
671
|
+
"q:slot": "dropdown",
|
|
672
|
+
children: (props.customDropdown || !props.values?.length) && /* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, {
|
|
673
|
+
name: "dropdown"
|
|
674
|
+
})
|
|
675
|
+
}),
|
|
676
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
677
|
+
"q:slot": "extra-buttons",
|
|
678
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, {
|
|
679
|
+
name: "extra-buttons"
|
|
680
|
+
})
|
|
681
|
+
})
|
|
682
|
+
]
|
|
628
683
|
})
|
|
629
684
|
]
|
|
630
685
|
});
|
|
631
686
|
});
|
|
632
|
-
const
|
|
687
|
+
const SelectMenuRaw = qwik.component$(({ id, values, class: Class, customDropdown, hover, ...props }) => {
|
|
633
688
|
const store = qwik.useStore({
|
|
634
689
|
opened: false,
|
|
635
690
|
value: props.value
|
|
@@ -653,29 +708,24 @@ const DropdownRaw = qwik.component$(({ id, values, class: Class, display, hover,
|
|
|
653
708
|
}, i);
|
|
654
709
|
})
|
|
655
710
|
}),
|
|
656
|
-
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
657
|
-
|
|
658
|
-
|
|
659
|
-
...Class
|
|
660
|
-
},
|
|
711
|
+
/* @__PURE__ */ jsxRuntime.jsxs(Dropdown, {
|
|
712
|
+
opened: store.opened,
|
|
713
|
+
class: Class,
|
|
661
714
|
onClick$: () => {
|
|
662
715
|
if (!hover) store.opened = !store.opened;
|
|
663
716
|
},
|
|
664
717
|
children: [
|
|
665
|
-
|
|
666
|
-
|
|
667
|
-
id: `lui-${id}-name`,
|
|
668
|
-
class: "flex-1 text-left",
|
|
669
|
-
children: values.find((value) => value.value.toString() === store.value)?.name ?? values[0].name
|
|
718
|
+
customDropdown && /* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, {
|
|
719
|
+
name: "dropdown"
|
|
670
720
|
}),
|
|
671
|
-
/* @__PURE__ */ jsxRuntime.
|
|
672
|
-
|
|
673
|
-
|
|
674
|
-
|
|
675
|
-
|
|
676
|
-
|
|
677
|
-
|
|
678
|
-
|
|
721
|
+
!customDropdown && /* @__PURE__ */ jsxRuntime.jsxs("span", {
|
|
722
|
+
id: `lui-${id}-name`,
|
|
723
|
+
children: [
|
|
724
|
+
values && (values.find((value) => value.value.toString() === store.value)?.name ?? values[0].name),
|
|
725
|
+
!values && /* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, {
|
|
726
|
+
name: "dropdown"
|
|
727
|
+
})
|
|
728
|
+
]
|
|
679
729
|
})
|
|
680
730
|
]
|
|
681
731
|
}),
|
|
@@ -718,6 +768,32 @@ const DropdownRaw = qwik.component$(({ id, values, class: Class, display, hover,
|
|
|
718
768
|
]
|
|
719
769
|
});
|
|
720
770
|
});
|
|
771
|
+
const Menu = qwik.component$(({ size, ...props }) => {
|
|
772
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("svg", {
|
|
773
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
774
|
+
width: size,
|
|
775
|
+
height: size,
|
|
776
|
+
viewBox: "0 0 24 24",
|
|
777
|
+
fill: "none",
|
|
778
|
+
stroke: "currentColor",
|
|
779
|
+
"stroke-width": "2",
|
|
780
|
+
"stroke-linecap": "round",
|
|
781
|
+
"stroke-linejoin": "round",
|
|
782
|
+
class: "lucide lucide-menu-icon lucide-menu",
|
|
783
|
+
...props,
|
|
784
|
+
children: [
|
|
785
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
786
|
+
d: "M4 12h16"
|
|
787
|
+
}),
|
|
788
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
789
|
+
d: "M4 18h16"
|
|
790
|
+
}),
|
|
791
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
792
|
+
d: "M4 6h16"
|
|
793
|
+
})
|
|
794
|
+
]
|
|
795
|
+
});
|
|
796
|
+
});
|
|
721
797
|
const Nav = qwik.component$(({ fixed, floating, nohamburger, colorClass = "lum-bg-gray-900", ...props }) => {
|
|
722
798
|
const menu = qwik.useSignal(false);
|
|
723
799
|
return /* @__PURE__ */ jsxRuntime.jsxs("nav", {
|
|
@@ -785,18 +861,8 @@ const Nav = qwik.component$(({ fixed, floating, nohamburger, colorClass = "lum-b
|
|
|
785
861
|
!nohamburger && /* @__PURE__ */ jsxRuntime.jsx("button", {
|
|
786
862
|
class: "lum-btn lum-bg-transparent p-2 sm:hidden",
|
|
787
863
|
onClick$: () => menu.value = !menu.value,
|
|
788
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
789
|
-
|
|
790
|
-
fill: "none",
|
|
791
|
-
stroke: "currentColor",
|
|
792
|
-
viewBox: "0 0 24 24",
|
|
793
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
794
|
-
children: /* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
795
|
-
"stroke-linecap": "round",
|
|
796
|
-
"stroke-linejoin": "round",
|
|
797
|
-
"stroke-width": "2",
|
|
798
|
-
d: "M4 6h16M4 12h16M4 18h16"
|
|
799
|
-
})
|
|
864
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(Menu, {
|
|
865
|
+
size: 24
|
|
800
866
|
})
|
|
801
867
|
})
|
|
802
868
|
]
|
|
@@ -807,35 +873,44 @@ const Nav = qwik.component$(({ fixed, floating, nohamburger, colorClass = "lum-b
|
|
|
807
873
|
]
|
|
808
874
|
});
|
|
809
875
|
});
|
|
810
|
-
const Plus = qwik.component$((props) => {
|
|
811
|
-
return /* @__PURE__ */ jsxRuntime.
|
|
876
|
+
const Plus = qwik.component$(({ size, ...props }) => {
|
|
877
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("svg", {
|
|
812
878
|
xmlns: "http://www.w3.org/2000/svg",
|
|
813
|
-
|
|
879
|
+
width: size,
|
|
880
|
+
height: size,
|
|
881
|
+
viewBox: "0 0 24 24",
|
|
882
|
+
fill: "none",
|
|
883
|
+
stroke: "currentColor",
|
|
884
|
+
"stroke-width": "2",
|
|
885
|
+
"stroke-linecap": "round",
|
|
886
|
+
"stroke-linejoin": "round",
|
|
887
|
+
class: "lucide lucide-plus-icon lucide-plus",
|
|
814
888
|
...props,
|
|
815
|
-
|
|
816
|
-
|
|
817
|
-
|
|
818
|
-
|
|
819
|
-
|
|
820
|
-
|
|
821
|
-
|
|
822
|
-
|
|
823
|
-
})
|
|
889
|
+
children: [
|
|
890
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
891
|
+
d: "M5 12h14"
|
|
892
|
+
}),
|
|
893
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
894
|
+
d: "M12 5v14"
|
|
895
|
+
})
|
|
896
|
+
]
|
|
824
897
|
});
|
|
825
898
|
});
|
|
826
|
-
const Minus = qwik.component$((props) => {
|
|
899
|
+
const Minus = qwik.component$(({ size, ...props }) => {
|
|
827
900
|
return /* @__PURE__ */ jsxRuntime.jsx("svg", {
|
|
828
901
|
xmlns: "http://www.w3.org/2000/svg",
|
|
829
|
-
|
|
902
|
+
width: size,
|
|
903
|
+
height: size,
|
|
904
|
+
viewBox: "0 0 24 24",
|
|
905
|
+
fill: "none",
|
|
906
|
+
stroke: "currentColor",
|
|
907
|
+
"stroke-width": "2",
|
|
908
|
+
"stroke-linecap": "round",
|
|
909
|
+
"stroke-linejoin": "round",
|
|
910
|
+
class: "lucide lucide-minus-icon lucide-minus",
|
|
830
911
|
...props,
|
|
831
|
-
height: props.width,
|
|
832
912
|
children: /* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
833
|
-
|
|
834
|
-
stroke: "currentColor",
|
|
835
|
-
"stroke-linecap": "round",
|
|
836
|
-
"stroke-linejoin": "round",
|
|
837
|
-
"stroke-width": "32",
|
|
838
|
-
d: "M400 256H112"
|
|
913
|
+
d: "M5 12h14"
|
|
839
914
|
})
|
|
840
915
|
});
|
|
841
916
|
});
|
|
@@ -884,8 +959,7 @@ const NumberInputRaw = qwik.component$(({ input, onDecrement$, onIncrement$, val
|
|
|
884
959
|
await onDecrement$(event, element, siblingInput);
|
|
885
960
|
}) : onDecrement$,
|
|
886
961
|
children: /* @__PURE__ */ jsxRuntime.jsx(Minus, {
|
|
887
|
-
|
|
888
|
-
class: "fill-current"
|
|
962
|
+
size: 24
|
|
889
963
|
})
|
|
890
964
|
}),
|
|
891
965
|
input && /* @__PURE__ */ jsxRuntime.jsx("input", {
|
|
@@ -911,8 +985,7 @@ const NumberInputRaw = qwik.component$(({ input, onDecrement$, onIncrement$, val
|
|
|
911
985
|
await onIncrement$(event, element, siblingInput);
|
|
912
986
|
}) : onIncrement$,
|
|
913
987
|
children: /* @__PURE__ */ jsxRuntime.jsx(Plus, {
|
|
914
|
-
|
|
915
|
-
class: "fill-current"
|
|
988
|
+
size: 24
|
|
916
989
|
})
|
|
917
990
|
})
|
|
918
991
|
]
|
|
@@ -1156,18 +1229,20 @@ const Toggle = qwik.component$(({ checkbox, round, center, label, onColor = "blu
|
|
|
1156
1229
|
]
|
|
1157
1230
|
});
|
|
1158
1231
|
});
|
|
1159
|
-
const LogoBirdflop = qwik.component$(({ confused, fillGradient, ...props }) => {
|
|
1232
|
+
const LogoBirdflop = qwik.component$(({ confused, fillGradient, size, ...props }) => {
|
|
1233
|
+
const gradientId = fillGradient?.join("-").replace("#", "");
|
|
1160
1234
|
return /* @__PURE__ */ jsxRuntime.jsxs("svg", {
|
|
1161
1235
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1162
1236
|
"xmlns:xlink": "http://www.w3.org/1999/xlink",
|
|
1163
1237
|
viewBox: "0 0 1080 1080",
|
|
1238
|
+
width: size,
|
|
1239
|
+
height: size,
|
|
1164
1240
|
...props,
|
|
1165
|
-
height: props.width,
|
|
1166
1241
|
children: [
|
|
1167
1242
|
/* @__PURE__ */ jsxRuntime.jsxs("defs", {
|
|
1168
1243
|
children: [
|
|
1169
1244
|
fillGradient && /* @__PURE__ */ jsxRuntime.jsx("linearGradient", {
|
|
1170
|
-
id:
|
|
1245
|
+
id: `linear-gradient-${gradientId}`,
|
|
1171
1246
|
x1: "0.5",
|
|
1172
1247
|
x2: "0.5",
|
|
1173
1248
|
y2: "1",
|
|
@@ -1196,7 +1271,7 @@ const LogoBirdflop = qwik.component$(({ confused, fillGradient, ...props }) => {
|
|
|
1196
1271
|
"data-name": "Union 26",
|
|
1197
1272
|
d: "M-1886.608-89.36c-8.311-65.774-27.64-219.008-27.64-221.333a.279.279,0,0,1,.09-.159q-.474-4.88-.477-9.885A101.066,101.066,0,0,1-1813.61-421.844a100.671,100.671,0,0,1,71.913,30.1l.093-.042c-.077-.093-8.783-10.549-22.7-24.758-8.216-8.388-16.645-16.459-25.052-23.993-10.51-9.417-21.018-18.013-31.23-25.552a120.5,120.5,0,0,0-40.468-71.567,119.916,119.916,0,0,0-77.984-28.881c-66.215,0-120.083,53.941-120.083,120.244h-.237v116.01h-.24c-.131,132.971-107.6,240.728-240.16,240.728V-330.289H-2300V-449.818h.362V-931.536h0V-1170c132.71,0,240.293,106.764,240.293,238.464v145.112a358.089,358.089,0,0,1,47.7-13.28,362.475,362.475,0,0,1,72.6-7.329,362.455,362.455,0,0,1,72.6,7.329,358.112,358.112,0,0,1,67.622,21.02,360.042,360.042,0,0,1,61.191,33.26,362.833,362.833,0,0,1,53.315,44.049,363.178,363.178,0,0,1,43.99,53.387,360.83,360.83,0,0,1,33.213,61.276A359.3,359.3,0,0,1-1586.118-519a363.948,363.948,0,0,1,7.317,72.7,363.957,363.957,0,0,1-7.317,72.7,359.333,359.333,0,0,1-20.992,67.714,360.95,360.95,0,0,1-33.213,61.277,363.233,363.233,0,0,1-43.99,53.388,362.833,362.833,0,0,1-53.315,44.049,360.017,360.017,0,0,1-61.191,33.259,358.108,358.108,0,0,1-67.622,21.02c-6.636,1.36-13.421,2.548-20.165,3.532Zm-79.831-365.056a27.049,27.049,0,0,1,27.038-27.059,27.048,27.048,0,0,1,27.037,27.059,27.049,27.049,0,0,1-27.037,27.06A27.05,27.05,0,0,1-1966.439-454.416Z",
|
|
1198
1273
|
transform: "translate(2479.9 1169.7)",
|
|
1199
|
-
fill: fillGradient ?
|
|
1274
|
+
fill: fillGradient ? `url(#linear-gradient-${gradientId})` : ""
|
|
1200
1275
|
})
|
|
1201
1276
|
}),
|
|
1202
1277
|
confused && /* @__PURE__ */ jsxRuntime.jsxs("g", {
|
|
@@ -1222,19 +1297,20 @@ const LogoBirdflop = qwik.component$(({ confused, fillGradient, ...props }) => {
|
|
|
1222
1297
|
]
|
|
1223
1298
|
});
|
|
1224
1299
|
});
|
|
1225
|
-
const LogoDiscord = qwik.component$((props) => {
|
|
1300
|
+
const LogoDiscord = qwik.component$(({ size, ...props }) => {
|
|
1226
1301
|
return /* @__PURE__ */ jsxRuntime.jsx("svg", {
|
|
1227
1302
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1228
1303
|
viewBox: "0 0 127.14 96.36",
|
|
1229
1304
|
fill: "currentColor",
|
|
1305
|
+
width: size,
|
|
1306
|
+
height: size,
|
|
1230
1307
|
...props,
|
|
1231
|
-
height: props.width,
|
|
1232
1308
|
children: /* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
1233
1309
|
d: "M107.7,8.07A105.15,105.15,0,0,0,81.47,0a72.06,72.06,0,0,0-3.36,6.83A97.68,97.68,0,0,0,49,6.83,72.37,72.37,0,0,0,45.64,0,105.89,105.89,0,0,0,19.39,8.09C2.79,32.65-1.71,56.6.54,80.21h0A105.73,105.73,0,0,0,32.71,96.36,77.7,77.7,0,0,0,39.6,85.25a68.42,68.42,0,0,1-10.85-5.18c.91-.66,1.8-1.34,2.66-2a75.57,75.57,0,0,0,64.32,0c.87.71,1.76,1.39,2.66,2a68.68,68.68,0,0,1-10.87,5.19,77,77,0,0,0,6.89,11.1A105.25,105.25,0,0,0,126.6,80.22h0C129.24,52.84,122.09,29.11,107.7,8.07ZM42.45,65.69C36.18,65.69,31,60,31,53s5-12.74,11.43-12.74S54,46,53.89,53,48.84,65.69,42.45,65.69Zm42.24,0C78.41,65.69,73.25,60,73.25,53s5-12.74,11.44-12.74S96.23,46,96.12,53,91.08,65.69,84.69,65.69Z"
|
|
1234
1310
|
})
|
|
1235
1311
|
});
|
|
1236
1312
|
});
|
|
1237
|
-
const LogoFabric = qwik.component$((props) => {
|
|
1313
|
+
const LogoFabric = qwik.component$(({ size, ...props }) => {
|
|
1238
1314
|
return /* @__PURE__ */ jsxRuntime.jsxs("svg", {
|
|
1239
1315
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1240
1316
|
"xml:space": "preserve",
|
|
@@ -1243,8 +1319,9 @@ const LogoFabric = qwik.component$((props) => {
|
|
|
1243
1319
|
"stroke-linejoin": "round",
|
|
1244
1320
|
"clip-rule": "evenodd",
|
|
1245
1321
|
viewBox: "0 0 24 24",
|
|
1322
|
+
width: size,
|
|
1323
|
+
height: size,
|
|
1246
1324
|
...props,
|
|
1247
|
-
height: props.width,
|
|
1248
1325
|
children: [
|
|
1249
1326
|
/* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
1250
1327
|
fill: "none",
|
|
@@ -1260,7 +1337,7 @@ const LogoFabric = qwik.component$((props) => {
|
|
|
1260
1337
|
]
|
|
1261
1338
|
});
|
|
1262
1339
|
});
|
|
1263
|
-
const LogoForge = qwik.component$((props) => {
|
|
1340
|
+
const LogoForge = qwik.component$(({ size, ...props }) => {
|
|
1264
1341
|
return /* @__PURE__ */ jsxRuntime.jsxs("svg", {
|
|
1265
1342
|
"xml:space": "preserve",
|
|
1266
1343
|
"fill-rule": "evenodd",
|
|
@@ -1269,8 +1346,9 @@ const LogoForge = qwik.component$((props) => {
|
|
|
1269
1346
|
"stroke-miterlimit": "1.5",
|
|
1270
1347
|
"clip-rule": "evenodd",
|
|
1271
1348
|
viewBox: "0 0 24 24",
|
|
1349
|
+
width: size,
|
|
1350
|
+
height: size,
|
|
1272
1351
|
...props,
|
|
1273
|
-
height: props.width,
|
|
1274
1352
|
children: [
|
|
1275
1353
|
/* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
1276
1354
|
fill: "none",
|
|
@@ -1285,7 +1363,7 @@ const LogoForge = qwik.component$((props) => {
|
|
|
1285
1363
|
]
|
|
1286
1364
|
});
|
|
1287
1365
|
});
|
|
1288
|
-
const LogoLuminescent = qwik.component$((props) => {
|
|
1366
|
+
const LogoLuminescent = qwik.component$(({ size, ...props }) => {
|
|
1289
1367
|
return /* @__PURE__ */ jsxRuntime.jsx("svg", {
|
|
1290
1368
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1291
1369
|
"xmlns:xlink": "http://www.w3.org/1999/xlink",
|
|
@@ -1294,8 +1372,9 @@ const LogoLuminescent = qwik.component$((props) => {
|
|
|
1294
1372
|
preserveAspectRatio: "xMidYMid meet",
|
|
1295
1373
|
version: "1.0",
|
|
1296
1374
|
fill: "currentColor",
|
|
1375
|
+
width: size,
|
|
1376
|
+
height: size,
|
|
1297
1377
|
...props,
|
|
1298
|
-
height: props.width,
|
|
1299
1378
|
children: /* @__PURE__ */ jsxRuntime.jsx("g", {
|
|
1300
1379
|
"fill-opacity": "1",
|
|
1301
1380
|
children: /* @__PURE__ */ jsxRuntime.jsx("g", {
|
|
@@ -1307,7 +1386,7 @@ const LogoLuminescent = qwik.component$((props) => {
|
|
|
1307
1386
|
})
|
|
1308
1387
|
});
|
|
1309
1388
|
});
|
|
1310
|
-
const LogoLuminescentFull = qwik.component$((props) => {
|
|
1389
|
+
const LogoLuminescentFull = qwik.component$(({ size, ...props }) => {
|
|
1311
1390
|
return /* @__PURE__ */ jsxRuntime.jsxs("svg", {
|
|
1312
1391
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1313
1392
|
"xmlns:xlink": "http://www.w3.org/1999/xlink",
|
|
@@ -1316,6 +1395,7 @@ const LogoLuminescentFull = qwik.component$((props) => {
|
|
|
1316
1395
|
preserveAspectRatio: "xMidYMid meet",
|
|
1317
1396
|
version: "1.0",
|
|
1318
1397
|
fill: "currentColor",
|
|
1398
|
+
height: size,
|
|
1319
1399
|
...props,
|
|
1320
1400
|
children: [
|
|
1321
1401
|
/* @__PURE__ */ jsxRuntime.jsx("g", {
|
|
@@ -1420,7 +1500,7 @@ const LogoLuminescentFull = qwik.component$((props) => {
|
|
|
1420
1500
|
]
|
|
1421
1501
|
});
|
|
1422
1502
|
});
|
|
1423
|
-
const LogoPaper = qwik.component$((props) => {
|
|
1503
|
+
const LogoPaper = qwik.component$(({ size, ...props }) => {
|
|
1424
1504
|
return /* @__PURE__ */ jsxRuntime.jsxs("svg", {
|
|
1425
1505
|
"xml:space": "preserve",
|
|
1426
1506
|
"fill-rule": "evenodd",
|
|
@@ -1429,8 +1509,9 @@ const LogoPaper = qwik.component$((props) => {
|
|
|
1429
1509
|
"stroke-miterlimit": "1.5",
|
|
1430
1510
|
"clip-rule": "evenodd",
|
|
1431
1511
|
viewBox: "0 0 24 24",
|
|
1512
|
+
width: size,
|
|
1513
|
+
height: size,
|
|
1432
1514
|
...props,
|
|
1433
|
-
height: props.width,
|
|
1434
1515
|
children: [
|
|
1435
1516
|
/* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
1436
1517
|
fill: "none",
|
|
@@ -1454,14 +1535,15 @@ const LogoPaper = qwik.component$((props) => {
|
|
|
1454
1535
|
]
|
|
1455
1536
|
});
|
|
1456
1537
|
});
|
|
1457
|
-
const LogoPterodactyl = qwik.component$((props) => {
|
|
1538
|
+
const LogoPterodactyl = qwik.component$(({ size, ...props }) => {
|
|
1458
1539
|
return /* @__PURE__ */ jsxRuntime.jsx("svg", {
|
|
1459
1540
|
version: "1.0",
|
|
1460
1541
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1461
1542
|
viewBox: "0 0 180 180",
|
|
1462
1543
|
preserveAspectRatio: "xMidYMid meet",
|
|
1544
|
+
width: size,
|
|
1545
|
+
height: size,
|
|
1463
1546
|
...props,
|
|
1464
|
-
height: props.width,
|
|
1465
1547
|
children: /* @__PURE__ */ jsxRuntime.jsxs("g", {
|
|
1466
1548
|
transform: "translate(0,180) scale(0.100000,-0.100000)",
|
|
1467
1549
|
fill: "currentColor",
|
|
@@ -1483,7 +1565,7 @@ const LogoPterodactyl = qwik.component$((props) => {
|
|
|
1483
1565
|
})
|
|
1484
1566
|
});
|
|
1485
1567
|
});
|
|
1486
|
-
const LogoPurpur = qwik.component$((props) => {
|
|
1568
|
+
const LogoPurpur = qwik.component$(({ size, ...props }) => {
|
|
1487
1569
|
return /* @__PURE__ */ jsxRuntime.jsxs("svg", {
|
|
1488
1570
|
"xml:space": "preserve",
|
|
1489
1571
|
"fill-rule": "evenodd",
|
|
@@ -1492,8 +1574,9 @@ const LogoPurpur = qwik.component$((props) => {
|
|
|
1492
1574
|
"stroke-miterlimit": "1.5",
|
|
1493
1575
|
"clip-rule": "evenodd",
|
|
1494
1576
|
viewBox: "0 0 24 24",
|
|
1577
|
+
width: size,
|
|
1578
|
+
height: size,
|
|
1495
1579
|
...props,
|
|
1496
|
-
height: props.width,
|
|
1497
1580
|
children: [
|
|
1498
1581
|
/* @__PURE__ */ jsxRuntime.jsx("defs", {
|
|
1499
1582
|
children: /* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
@@ -1553,12 +1636,13 @@ const LogoPurpur = qwik.component$((props) => {
|
|
|
1553
1636
|
]
|
|
1554
1637
|
});
|
|
1555
1638
|
});
|
|
1556
|
-
const LogoVelocity = qwik.component$((props) => {
|
|
1639
|
+
const LogoVelocity = qwik.component$(({ size, ...props }) => {
|
|
1557
1640
|
return /* @__PURE__ */ jsxRuntime.jsxs("svg", {
|
|
1558
1641
|
viewBox: "0 0 500 500",
|
|
1559
1642
|
fill: "currentColor",
|
|
1643
|
+
width: size,
|
|
1644
|
+
height: size,
|
|
1560
1645
|
...props,
|
|
1561
|
-
height: props.width,
|
|
1562
1646
|
children: [
|
|
1563
1647
|
/* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
1564
1648
|
d: "M236.25 232.55l-54.08-73.79a11.86 11.86 0 00-11.91-4.62L84 171.57a11.88 11.88 0 00-8 5.88l-42.64 77.07a11.84 11.84 0 00.81 12.75l54.21 74a11.86 11.86 0 0011.91 4.62l86-17.37a11.85 11.85 0 008-5.89l42.78-77.3a11.86 11.86 0 00-.82-12.78zm-59.45 74.21a9.57 9.57 0 01-13.39-2.06l-31-42.24a16 16 0 00-16-6.21l-52.58 10.63a9.58 9.58 0 01-11.29-7.49A9.58 9.58 0 0160 248.1l57-11.52a16 16 0 0010.81-7.92L156.42 177a9.58 9.58 0 0113-3.75 9.58 9.58 0 013.75 13L146.81 234a16 16 0 001.09 17.16l31 42.23a9.58 9.58 0 01-2.1 13.37z"
|
|
@@ -1574,7 +1658,7 @@ const LogoVelocity = qwik.component$((props) => {
|
|
|
1574
1658
|
]
|
|
1575
1659
|
});
|
|
1576
1660
|
});
|
|
1577
|
-
const LogoWaterfall = qwik.component$((props) => {
|
|
1661
|
+
const LogoWaterfall = qwik.component$(({ size, ...props }) => {
|
|
1578
1662
|
return /* @__PURE__ */ jsxRuntime.jsx("svg", {
|
|
1579
1663
|
viewBox: "0 0 24 24",
|
|
1580
1664
|
fill: "none",
|
|
@@ -1582,8 +1666,9 @@ const LogoWaterfall = qwik.component$((props) => {
|
|
|
1582
1666
|
"stroke-width": "2",
|
|
1583
1667
|
"stroke-linecap": "round",
|
|
1584
1668
|
"stroke-linejoin": "round",
|
|
1669
|
+
width: size,
|
|
1670
|
+
height: size,
|
|
1585
1671
|
...props,
|
|
1586
|
-
height: props.width,
|
|
1587
1672
|
children: /* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
1588
1673
|
d: "M12 2.69l5.66 5.66a8 8 0 1 1-11.31 0z"
|
|
1589
1674
|
})
|
|
@@ -1593,7 +1678,6 @@ exports.Anchor = Anchor;
|
|
|
1593
1678
|
exports.Blobs = Blobs;
|
|
1594
1679
|
exports.ColorPicker = ColorPicker;
|
|
1595
1680
|
exports.Dropdown = Dropdown;
|
|
1596
|
-
exports.DropdownRaw = DropdownRaw;
|
|
1597
1681
|
exports.LogoBirdflop = LogoBirdflop;
|
|
1598
1682
|
exports.LogoDiscord = LogoDiscord;
|
|
1599
1683
|
exports.LogoFabric = LogoFabric;
|
|
@@ -1608,6 +1692,8 @@ exports.LogoWaterfall = LogoWaterfall;
|
|
|
1608
1692
|
exports.Nav = Nav;
|
|
1609
1693
|
exports.NumberInput = NumberInput;
|
|
1610
1694
|
exports.NumberInputRaw = NumberInputRaw;
|
|
1695
|
+
exports.SelectMenu = SelectMenu;
|
|
1696
|
+
exports.SelectMenuRaw = SelectMenuRaw;
|
|
1611
1697
|
exports.Toggle = Toggle;
|
|
1612
1698
|
exports.blobColorClasses = blobColorClasses;
|
|
1613
1699
|
exports.toggleOffColorClasses = toggleOffColorClasses;
|
package/lib/index.qwik.mjs
CHANGED
|
@@ -1,33 +1,42 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { jsxs, jsx } from "@builder.io/qwik/jsx-runtime";
|
|
2
2
|
import { component$, Slot, useStore, $, useSignal, useStyles$ } from "@builder.io/qwik";
|
|
3
|
-
const Link = component$((props) => {
|
|
4
|
-
return /* @__PURE__ */
|
|
3
|
+
const Link = component$(({ size, ...props }) => {
|
|
4
|
+
return /* @__PURE__ */ jsxs("svg", {
|
|
5
5
|
xmlns: "http://www.w3.org/2000/svg",
|
|
6
|
-
|
|
6
|
+
width: size,
|
|
7
|
+
height: size,
|
|
8
|
+
viewBox: "0 0 24 24",
|
|
9
|
+
fill: "none",
|
|
10
|
+
stroke: "currentColor",
|
|
11
|
+
"stroke-width": "2",
|
|
12
|
+
"stroke-linecap": "round",
|
|
13
|
+
"stroke-linejoin": "round",
|
|
14
|
+
class: "lucide lucide-link2-icon lucide-link-2",
|
|
7
15
|
...props,
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
"
|
|
16
|
-
|
|
16
|
+
children: [
|
|
17
|
+
/* @__PURE__ */ jsx("path", {
|
|
18
|
+
d: "M9 17H7A5 5 0 0 1 7 7h2"
|
|
19
|
+
}),
|
|
20
|
+
/* @__PURE__ */ jsx("path", {
|
|
21
|
+
d: "M15 7h2a5 5 0 1 1 0 10h-2"
|
|
22
|
+
}),
|
|
23
|
+
/* @__PURE__ */ jsx("line", {
|
|
24
|
+
x1: "8",
|
|
25
|
+
x2: "16",
|
|
26
|
+
y1: "12",
|
|
27
|
+
y2: "12"
|
|
28
|
+
})
|
|
29
|
+
]
|
|
17
30
|
});
|
|
18
31
|
});
|
|
19
32
|
const Anchor = component$(({ id, ...props }) => /* @__PURE__ */ jsxs("div", {
|
|
20
33
|
...props,
|
|
21
34
|
class: {
|
|
22
|
-
"group flex items-center gap-2": true,
|
|
35
|
+
"group flex items-center gap-2 scroll-mt-32": true,
|
|
23
36
|
...props.class
|
|
24
37
|
},
|
|
25
38
|
children: [
|
|
26
39
|
/* @__PURE__ */ jsx(Slot, {}),
|
|
27
|
-
id && /* @__PURE__ */ jsx("span", {
|
|
28
|
-
id,
|
|
29
|
-
class: "pointer-events-none -mt-32 block h-32"
|
|
30
|
-
}),
|
|
31
40
|
id && /* @__PURE__ */ jsx("a", {
|
|
32
41
|
href: `#${id}`,
|
|
33
42
|
onClick$: async () => {
|
|
@@ -35,7 +44,7 @@ const Anchor = component$(({ id, ...props }) => /* @__PURE__ */ jsxs("div", {
|
|
|
35
44
|
},
|
|
36
45
|
children: /* @__PURE__ */ jsx(Link, {
|
|
37
46
|
class: "opacity-10 transition-all duration-300 group-hover:opacity-100 group-hover:duration-75",
|
|
38
|
-
|
|
47
|
+
size: 20
|
|
39
48
|
})
|
|
40
49
|
})
|
|
41
50
|
]
|
|
@@ -334,28 +343,34 @@ function rgbToHsv(color) {
|
|
|
334
343
|
v
|
|
335
344
|
};
|
|
336
345
|
}
|
|
337
|
-
const Shuffle = component$((props) => {
|
|
346
|
+
const Shuffle = component$(({ size, ...props }) => {
|
|
338
347
|
return /* @__PURE__ */ jsxs("svg", {
|
|
339
348
|
xmlns: "http://www.w3.org/2000/svg",
|
|
340
|
-
|
|
349
|
+
width: size,
|
|
350
|
+
height: size,
|
|
351
|
+
viewBox: "0 0 24 24",
|
|
352
|
+
fill: "none",
|
|
353
|
+
stroke: "currentColor",
|
|
354
|
+
"stroke-width": "2",
|
|
355
|
+
"stroke-linecap": "round",
|
|
356
|
+
"stroke-linejoin": "round",
|
|
357
|
+
class: "lucide lucide-shuffle-icon lucide-shuffle",
|
|
341
358
|
...props,
|
|
342
|
-
height: props.width,
|
|
343
359
|
children: [
|
|
344
360
|
/* @__PURE__ */ jsx("path", {
|
|
345
|
-
|
|
346
|
-
stroke: "currentColor",
|
|
347
|
-
"stroke-linecap": "round",
|
|
348
|
-
"stroke-linejoin": "round",
|
|
349
|
-
"stroke-width": "32",
|
|
350
|
-
d: "M400 304l48 48-48 48M400 112l48 48-48 48M64 352h85.19a80 80 0 0066.56-35.62L256 256"
|
|
361
|
+
d: "m18 14 4 4-4 4"
|
|
351
362
|
}),
|
|
352
363
|
/* @__PURE__ */ jsx("path", {
|
|
353
|
-
d: "
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
"
|
|
357
|
-
|
|
358
|
-
|
|
364
|
+
d: "m18 2 4 4-4 4"
|
|
365
|
+
}),
|
|
366
|
+
/* @__PURE__ */ jsx("path", {
|
|
367
|
+
d: "M2 18h1.973a4 4 0 0 0 3.3-1.7l5.454-8.6a4 4 0 0 1 3.3-1.7H22"
|
|
368
|
+
}),
|
|
369
|
+
/* @__PURE__ */ jsx("path", {
|
|
370
|
+
d: "M2 6h1.972a4 4 0 0 1 3.6 2.2"
|
|
371
|
+
}),
|
|
372
|
+
/* @__PURE__ */ jsx("path", {
|
|
373
|
+
d: "M22 18h-6.041a4 4 0 0 1-3.3-1.8l-.359-.45"
|
|
359
374
|
})
|
|
360
375
|
]
|
|
361
376
|
});
|
|
@@ -588,7 +603,7 @@ const ColorPicker = component$(({ id, value = "#000000", colors = [
|
|
|
588
603
|
await setColor(color);
|
|
589
604
|
},
|
|
590
605
|
children: /* @__PURE__ */ jsx(Shuffle, {
|
|
591
|
-
class: "
|
|
606
|
+
class: "p-0.5 pl-0.5 text-gray-300"
|
|
592
607
|
})
|
|
593
608
|
})
|
|
594
609
|
]
|
|
@@ -596,23 +611,49 @@ const ColorPicker = component$(({ id, value = "#000000", colors = [
|
|
|
596
611
|
]
|
|
597
612
|
});
|
|
598
613
|
});
|
|
599
|
-
const ChevronDown = component$((props) => {
|
|
614
|
+
const ChevronDown = component$(({ size, ...props }) => {
|
|
600
615
|
return /* @__PURE__ */ jsx("svg", {
|
|
601
616
|
xmlns: "http://www.w3.org/2000/svg",
|
|
602
|
-
|
|
617
|
+
width: size,
|
|
618
|
+
height: size,
|
|
619
|
+
viewBox: "0 0 24 24",
|
|
620
|
+
fill: "none",
|
|
621
|
+
stroke: "currentColor",
|
|
622
|
+
"stroke-width": "2",
|
|
623
|
+
"stroke-linecap": "round",
|
|
624
|
+
"stroke-linejoin": "round",
|
|
625
|
+
class: "lucide lucide-chevron-down-icon lucide-chevron-down",
|
|
603
626
|
...props,
|
|
604
|
-
height: props.width,
|
|
605
627
|
children: /* @__PURE__ */ jsx("path", {
|
|
606
|
-
|
|
607
|
-
stroke: "currentColor",
|
|
608
|
-
"stroke-linecap": "round",
|
|
609
|
-
"stroke-linejoin": "round",
|
|
610
|
-
"stroke-width": "48",
|
|
611
|
-
d: "M112 184l144 144 144-144"
|
|
628
|
+
d: "m6 9 6 6 6-6"
|
|
612
629
|
})
|
|
613
630
|
});
|
|
614
631
|
});
|
|
615
|
-
const Dropdown = component$((props) => {
|
|
632
|
+
const Dropdown = component$(({ class: Class, hover, opened, ...props }) => {
|
|
633
|
+
return /* @__PURE__ */ jsxs("button", {
|
|
634
|
+
class: {
|
|
635
|
+
"lum-btn": true,
|
|
636
|
+
...Class
|
|
637
|
+
},
|
|
638
|
+
...props,
|
|
639
|
+
children: [
|
|
640
|
+
/* @__PURE__ */ jsx("div", {
|
|
641
|
+
class: "flex-1 text-left",
|
|
642
|
+
children: /* @__PURE__ */ jsx(Slot, {})
|
|
643
|
+
}),
|
|
644
|
+
/* @__PURE__ */ jsx(ChevronDown, {
|
|
645
|
+
size: 16,
|
|
646
|
+
class: {
|
|
647
|
+
"ease-out motion-safe:transition-all": true,
|
|
648
|
+
"rotate-180 transform": opened,
|
|
649
|
+
"duration-300 group-hover:rotate-180 group-hover:transform group-hover:duration-75": hover,
|
|
650
|
+
"focus-within:rotate-180 focus-within:transform focus-within:duration-75": true
|
|
651
|
+
}
|
|
652
|
+
})
|
|
653
|
+
]
|
|
654
|
+
});
|
|
655
|
+
});
|
|
656
|
+
const SelectMenu = component$((props) => {
|
|
616
657
|
return /* @__PURE__ */ jsxs("div", {
|
|
617
658
|
class: "flex flex-col",
|
|
618
659
|
children: [
|
|
@@ -621,13 +662,27 @@ const Dropdown = component$((props) => {
|
|
|
621
662
|
class: "pb-1 text-gray-300 select-none",
|
|
622
663
|
children: /* @__PURE__ */ jsx(Slot, {})
|
|
623
664
|
}),
|
|
624
|
-
/* @__PURE__ */
|
|
625
|
-
...props
|
|
665
|
+
/* @__PURE__ */ jsxs(SelectMenuRaw, {
|
|
666
|
+
...props,
|
|
667
|
+
children: [
|
|
668
|
+
/* @__PURE__ */ jsx("div", {
|
|
669
|
+
"q:slot": "dropdown",
|
|
670
|
+
children: (props.customDropdown || !props.values?.length) && /* @__PURE__ */ jsx(Slot, {
|
|
671
|
+
name: "dropdown"
|
|
672
|
+
})
|
|
673
|
+
}),
|
|
674
|
+
/* @__PURE__ */ jsx("div", {
|
|
675
|
+
"q:slot": "extra-buttons",
|
|
676
|
+
children: /* @__PURE__ */ jsx(Slot, {
|
|
677
|
+
name: "extra-buttons"
|
|
678
|
+
})
|
|
679
|
+
})
|
|
680
|
+
]
|
|
626
681
|
})
|
|
627
682
|
]
|
|
628
683
|
});
|
|
629
684
|
});
|
|
630
|
-
const
|
|
685
|
+
const SelectMenuRaw = component$(({ id, values, class: Class, customDropdown, hover, ...props }) => {
|
|
631
686
|
const store = useStore({
|
|
632
687
|
opened: false,
|
|
633
688
|
value: props.value
|
|
@@ -651,29 +706,24 @@ const DropdownRaw = component$(({ id, values, class: Class, display, hover, ...p
|
|
|
651
706
|
}, i);
|
|
652
707
|
})
|
|
653
708
|
}),
|
|
654
|
-
/* @__PURE__ */ jsxs(
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
...Class
|
|
658
|
-
},
|
|
709
|
+
/* @__PURE__ */ jsxs(Dropdown, {
|
|
710
|
+
opened: store.opened,
|
|
711
|
+
class: Class,
|
|
659
712
|
onClick$: () => {
|
|
660
713
|
if (!hover) store.opened = !store.opened;
|
|
661
714
|
},
|
|
662
715
|
children: [
|
|
663
|
-
|
|
664
|
-
|
|
665
|
-
id: `lui-${id}-name`,
|
|
666
|
-
class: "flex-1 text-left",
|
|
667
|
-
children: values.find((value) => value.value.toString() === store.value)?.name ?? values[0].name
|
|
716
|
+
customDropdown && /* @__PURE__ */ jsx(Slot, {
|
|
717
|
+
name: "dropdown"
|
|
668
718
|
}),
|
|
669
|
-
/* @__PURE__ */
|
|
670
|
-
|
|
671
|
-
|
|
672
|
-
|
|
673
|
-
|
|
674
|
-
|
|
675
|
-
|
|
676
|
-
|
|
719
|
+
!customDropdown && /* @__PURE__ */ jsxs("span", {
|
|
720
|
+
id: `lui-${id}-name`,
|
|
721
|
+
children: [
|
|
722
|
+
values && (values.find((value) => value.value.toString() === store.value)?.name ?? values[0].name),
|
|
723
|
+
!values && /* @__PURE__ */ jsx(Slot, {
|
|
724
|
+
name: "dropdown"
|
|
725
|
+
})
|
|
726
|
+
]
|
|
677
727
|
})
|
|
678
728
|
]
|
|
679
729
|
}),
|
|
@@ -716,6 +766,32 @@ const DropdownRaw = component$(({ id, values, class: Class, display, hover, ...p
|
|
|
716
766
|
]
|
|
717
767
|
});
|
|
718
768
|
});
|
|
769
|
+
const Menu = component$(({ size, ...props }) => {
|
|
770
|
+
return /* @__PURE__ */ jsxs("svg", {
|
|
771
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
772
|
+
width: size,
|
|
773
|
+
height: size,
|
|
774
|
+
viewBox: "0 0 24 24",
|
|
775
|
+
fill: "none",
|
|
776
|
+
stroke: "currentColor",
|
|
777
|
+
"stroke-width": "2",
|
|
778
|
+
"stroke-linecap": "round",
|
|
779
|
+
"stroke-linejoin": "round",
|
|
780
|
+
class: "lucide lucide-menu-icon lucide-menu",
|
|
781
|
+
...props,
|
|
782
|
+
children: [
|
|
783
|
+
/* @__PURE__ */ jsx("path", {
|
|
784
|
+
d: "M4 12h16"
|
|
785
|
+
}),
|
|
786
|
+
/* @__PURE__ */ jsx("path", {
|
|
787
|
+
d: "M4 18h16"
|
|
788
|
+
}),
|
|
789
|
+
/* @__PURE__ */ jsx("path", {
|
|
790
|
+
d: "M4 6h16"
|
|
791
|
+
})
|
|
792
|
+
]
|
|
793
|
+
});
|
|
794
|
+
});
|
|
719
795
|
const Nav = component$(({ fixed, floating, nohamburger, colorClass = "lum-bg-gray-900", ...props }) => {
|
|
720
796
|
const menu = useSignal(false);
|
|
721
797
|
return /* @__PURE__ */ jsxs("nav", {
|
|
@@ -783,18 +859,8 @@ const Nav = component$(({ fixed, floating, nohamburger, colorClass = "lum-bg-gra
|
|
|
783
859
|
!nohamburger && /* @__PURE__ */ jsx("button", {
|
|
784
860
|
class: "lum-btn lum-bg-transparent p-2 sm:hidden",
|
|
785
861
|
onClick$: () => menu.value = !menu.value,
|
|
786
|
-
children: /* @__PURE__ */ jsx(
|
|
787
|
-
|
|
788
|
-
fill: "none",
|
|
789
|
-
stroke: "currentColor",
|
|
790
|
-
viewBox: "0 0 24 24",
|
|
791
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
792
|
-
children: /* @__PURE__ */ jsx("path", {
|
|
793
|
-
"stroke-linecap": "round",
|
|
794
|
-
"stroke-linejoin": "round",
|
|
795
|
-
"stroke-width": "2",
|
|
796
|
-
d: "M4 6h16M4 12h16M4 18h16"
|
|
797
|
-
})
|
|
862
|
+
children: /* @__PURE__ */ jsx(Menu, {
|
|
863
|
+
size: 24
|
|
798
864
|
})
|
|
799
865
|
})
|
|
800
866
|
]
|
|
@@ -805,35 +871,44 @@ const Nav = component$(({ fixed, floating, nohamburger, colorClass = "lum-bg-gra
|
|
|
805
871
|
]
|
|
806
872
|
});
|
|
807
873
|
});
|
|
808
|
-
const Plus = component$((props) => {
|
|
809
|
-
return /* @__PURE__ */
|
|
874
|
+
const Plus = component$(({ size, ...props }) => {
|
|
875
|
+
return /* @__PURE__ */ jsxs("svg", {
|
|
810
876
|
xmlns: "http://www.w3.org/2000/svg",
|
|
811
|
-
|
|
877
|
+
width: size,
|
|
878
|
+
height: size,
|
|
879
|
+
viewBox: "0 0 24 24",
|
|
880
|
+
fill: "none",
|
|
881
|
+
stroke: "currentColor",
|
|
882
|
+
"stroke-width": "2",
|
|
883
|
+
"stroke-linecap": "round",
|
|
884
|
+
"stroke-linejoin": "round",
|
|
885
|
+
class: "lucide lucide-plus-icon lucide-plus",
|
|
812
886
|
...props,
|
|
813
|
-
|
|
814
|
-
|
|
815
|
-
|
|
816
|
-
|
|
817
|
-
|
|
818
|
-
|
|
819
|
-
|
|
820
|
-
|
|
821
|
-
})
|
|
887
|
+
children: [
|
|
888
|
+
/* @__PURE__ */ jsx("path", {
|
|
889
|
+
d: "M5 12h14"
|
|
890
|
+
}),
|
|
891
|
+
/* @__PURE__ */ jsx("path", {
|
|
892
|
+
d: "M12 5v14"
|
|
893
|
+
})
|
|
894
|
+
]
|
|
822
895
|
});
|
|
823
896
|
});
|
|
824
|
-
const Minus = component$((props) => {
|
|
897
|
+
const Minus = component$(({ size, ...props }) => {
|
|
825
898
|
return /* @__PURE__ */ jsx("svg", {
|
|
826
899
|
xmlns: "http://www.w3.org/2000/svg",
|
|
827
|
-
|
|
900
|
+
width: size,
|
|
901
|
+
height: size,
|
|
902
|
+
viewBox: "0 0 24 24",
|
|
903
|
+
fill: "none",
|
|
904
|
+
stroke: "currentColor",
|
|
905
|
+
"stroke-width": "2",
|
|
906
|
+
"stroke-linecap": "round",
|
|
907
|
+
"stroke-linejoin": "round",
|
|
908
|
+
class: "lucide lucide-minus-icon lucide-minus",
|
|
828
909
|
...props,
|
|
829
|
-
height: props.width,
|
|
830
910
|
children: /* @__PURE__ */ jsx("path", {
|
|
831
|
-
|
|
832
|
-
stroke: "currentColor",
|
|
833
|
-
"stroke-linecap": "round",
|
|
834
|
-
"stroke-linejoin": "round",
|
|
835
|
-
"stroke-width": "32",
|
|
836
|
-
d: "M400 256H112"
|
|
911
|
+
d: "M5 12h14"
|
|
837
912
|
})
|
|
838
913
|
});
|
|
839
914
|
});
|
|
@@ -882,8 +957,7 @@ const NumberInputRaw = component$(({ input, onDecrement$, onIncrement$, value =
|
|
|
882
957
|
await onDecrement$(event, element, siblingInput);
|
|
883
958
|
}) : onDecrement$,
|
|
884
959
|
children: /* @__PURE__ */ jsx(Minus, {
|
|
885
|
-
|
|
886
|
-
class: "fill-current"
|
|
960
|
+
size: 24
|
|
887
961
|
})
|
|
888
962
|
}),
|
|
889
963
|
input && /* @__PURE__ */ jsx("input", {
|
|
@@ -909,8 +983,7 @@ const NumberInputRaw = component$(({ input, onDecrement$, onIncrement$, value =
|
|
|
909
983
|
await onIncrement$(event, element, siblingInput);
|
|
910
984
|
}) : onIncrement$,
|
|
911
985
|
children: /* @__PURE__ */ jsx(Plus, {
|
|
912
|
-
|
|
913
|
-
class: "fill-current"
|
|
986
|
+
size: 24
|
|
914
987
|
})
|
|
915
988
|
})
|
|
916
989
|
]
|
|
@@ -1154,18 +1227,20 @@ const Toggle = component$(({ checkbox, round, center, label, onColor = "blue", o
|
|
|
1154
1227
|
]
|
|
1155
1228
|
});
|
|
1156
1229
|
});
|
|
1157
|
-
const LogoBirdflop = component$(({ confused, fillGradient, ...props }) => {
|
|
1230
|
+
const LogoBirdflop = component$(({ confused, fillGradient, size, ...props }) => {
|
|
1231
|
+
const gradientId = fillGradient?.join("-").replace("#", "");
|
|
1158
1232
|
return /* @__PURE__ */ jsxs("svg", {
|
|
1159
1233
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1160
1234
|
"xmlns:xlink": "http://www.w3.org/1999/xlink",
|
|
1161
1235
|
viewBox: "0 0 1080 1080",
|
|
1236
|
+
width: size,
|
|
1237
|
+
height: size,
|
|
1162
1238
|
...props,
|
|
1163
|
-
height: props.width,
|
|
1164
1239
|
children: [
|
|
1165
1240
|
/* @__PURE__ */ jsxs("defs", {
|
|
1166
1241
|
children: [
|
|
1167
1242
|
fillGradient && /* @__PURE__ */ jsx("linearGradient", {
|
|
1168
|
-
id:
|
|
1243
|
+
id: `linear-gradient-${gradientId}`,
|
|
1169
1244
|
x1: "0.5",
|
|
1170
1245
|
x2: "0.5",
|
|
1171
1246
|
y2: "1",
|
|
@@ -1194,7 +1269,7 @@ const LogoBirdflop = component$(({ confused, fillGradient, ...props }) => {
|
|
|
1194
1269
|
"data-name": "Union 26",
|
|
1195
1270
|
d: "M-1886.608-89.36c-8.311-65.774-27.64-219.008-27.64-221.333a.279.279,0,0,1,.09-.159q-.474-4.88-.477-9.885A101.066,101.066,0,0,1-1813.61-421.844a100.671,100.671,0,0,1,71.913,30.1l.093-.042c-.077-.093-8.783-10.549-22.7-24.758-8.216-8.388-16.645-16.459-25.052-23.993-10.51-9.417-21.018-18.013-31.23-25.552a120.5,120.5,0,0,0-40.468-71.567,119.916,119.916,0,0,0-77.984-28.881c-66.215,0-120.083,53.941-120.083,120.244h-.237v116.01h-.24c-.131,132.971-107.6,240.728-240.16,240.728V-330.289H-2300V-449.818h.362V-931.536h0V-1170c132.71,0,240.293,106.764,240.293,238.464v145.112a358.089,358.089,0,0,1,47.7-13.28,362.475,362.475,0,0,1,72.6-7.329,362.455,362.455,0,0,1,72.6,7.329,358.112,358.112,0,0,1,67.622,21.02,360.042,360.042,0,0,1,61.191,33.26,362.833,362.833,0,0,1,53.315,44.049,363.178,363.178,0,0,1,43.99,53.387,360.83,360.83,0,0,1,33.213,61.276A359.3,359.3,0,0,1-1586.118-519a363.948,363.948,0,0,1,7.317,72.7,363.957,363.957,0,0,1-7.317,72.7,359.333,359.333,0,0,1-20.992,67.714,360.95,360.95,0,0,1-33.213,61.277,363.233,363.233,0,0,1-43.99,53.388,362.833,362.833,0,0,1-53.315,44.049,360.017,360.017,0,0,1-61.191,33.259,358.108,358.108,0,0,1-67.622,21.02c-6.636,1.36-13.421,2.548-20.165,3.532Zm-79.831-365.056a27.049,27.049,0,0,1,27.038-27.059,27.048,27.048,0,0,1,27.037,27.059,27.049,27.049,0,0,1-27.037,27.06A27.05,27.05,0,0,1-1966.439-454.416Z",
|
|
1196
1271
|
transform: "translate(2479.9 1169.7)",
|
|
1197
|
-
fill: fillGradient ?
|
|
1272
|
+
fill: fillGradient ? `url(#linear-gradient-${gradientId})` : ""
|
|
1198
1273
|
})
|
|
1199
1274
|
}),
|
|
1200
1275
|
confused && /* @__PURE__ */ jsxs("g", {
|
|
@@ -1220,19 +1295,20 @@ const LogoBirdflop = component$(({ confused, fillGradient, ...props }) => {
|
|
|
1220
1295
|
]
|
|
1221
1296
|
});
|
|
1222
1297
|
});
|
|
1223
|
-
const LogoDiscord = component$((props) => {
|
|
1298
|
+
const LogoDiscord = component$(({ size, ...props }) => {
|
|
1224
1299
|
return /* @__PURE__ */ jsx("svg", {
|
|
1225
1300
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1226
1301
|
viewBox: "0 0 127.14 96.36",
|
|
1227
1302
|
fill: "currentColor",
|
|
1303
|
+
width: size,
|
|
1304
|
+
height: size,
|
|
1228
1305
|
...props,
|
|
1229
|
-
height: props.width,
|
|
1230
1306
|
children: /* @__PURE__ */ jsx("path", {
|
|
1231
1307
|
d: "M107.7,8.07A105.15,105.15,0,0,0,81.47,0a72.06,72.06,0,0,0-3.36,6.83A97.68,97.68,0,0,0,49,6.83,72.37,72.37,0,0,0,45.64,0,105.89,105.89,0,0,0,19.39,8.09C2.79,32.65-1.71,56.6.54,80.21h0A105.73,105.73,0,0,0,32.71,96.36,77.7,77.7,0,0,0,39.6,85.25a68.42,68.42,0,0,1-10.85-5.18c.91-.66,1.8-1.34,2.66-2a75.57,75.57,0,0,0,64.32,0c.87.71,1.76,1.39,2.66,2a68.68,68.68,0,0,1-10.87,5.19,77,77,0,0,0,6.89,11.1A105.25,105.25,0,0,0,126.6,80.22h0C129.24,52.84,122.09,29.11,107.7,8.07ZM42.45,65.69C36.18,65.69,31,60,31,53s5-12.74,11.43-12.74S54,46,53.89,53,48.84,65.69,42.45,65.69Zm42.24,0C78.41,65.69,73.25,60,73.25,53s5-12.74,11.44-12.74S96.23,46,96.12,53,91.08,65.69,84.69,65.69Z"
|
|
1232
1308
|
})
|
|
1233
1309
|
});
|
|
1234
1310
|
});
|
|
1235
|
-
const LogoFabric = component$((props) => {
|
|
1311
|
+
const LogoFabric = component$(({ size, ...props }) => {
|
|
1236
1312
|
return /* @__PURE__ */ jsxs("svg", {
|
|
1237
1313
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1238
1314
|
"xml:space": "preserve",
|
|
@@ -1241,8 +1317,9 @@ const LogoFabric = component$((props) => {
|
|
|
1241
1317
|
"stroke-linejoin": "round",
|
|
1242
1318
|
"clip-rule": "evenodd",
|
|
1243
1319
|
viewBox: "0 0 24 24",
|
|
1320
|
+
width: size,
|
|
1321
|
+
height: size,
|
|
1244
1322
|
...props,
|
|
1245
|
-
height: props.width,
|
|
1246
1323
|
children: [
|
|
1247
1324
|
/* @__PURE__ */ jsx("path", {
|
|
1248
1325
|
fill: "none",
|
|
@@ -1258,7 +1335,7 @@ const LogoFabric = component$((props) => {
|
|
|
1258
1335
|
]
|
|
1259
1336
|
});
|
|
1260
1337
|
});
|
|
1261
|
-
const LogoForge = component$((props) => {
|
|
1338
|
+
const LogoForge = component$(({ size, ...props }) => {
|
|
1262
1339
|
return /* @__PURE__ */ jsxs("svg", {
|
|
1263
1340
|
"xml:space": "preserve",
|
|
1264
1341
|
"fill-rule": "evenodd",
|
|
@@ -1267,8 +1344,9 @@ const LogoForge = component$((props) => {
|
|
|
1267
1344
|
"stroke-miterlimit": "1.5",
|
|
1268
1345
|
"clip-rule": "evenodd",
|
|
1269
1346
|
viewBox: "0 0 24 24",
|
|
1347
|
+
width: size,
|
|
1348
|
+
height: size,
|
|
1270
1349
|
...props,
|
|
1271
|
-
height: props.width,
|
|
1272
1350
|
children: [
|
|
1273
1351
|
/* @__PURE__ */ jsx("path", {
|
|
1274
1352
|
fill: "none",
|
|
@@ -1283,7 +1361,7 @@ const LogoForge = component$((props) => {
|
|
|
1283
1361
|
]
|
|
1284
1362
|
});
|
|
1285
1363
|
});
|
|
1286
|
-
const LogoLuminescent = component$((props) => {
|
|
1364
|
+
const LogoLuminescent = component$(({ size, ...props }) => {
|
|
1287
1365
|
return /* @__PURE__ */ jsx("svg", {
|
|
1288
1366
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1289
1367
|
"xmlns:xlink": "http://www.w3.org/1999/xlink",
|
|
@@ -1292,8 +1370,9 @@ const LogoLuminescent = component$((props) => {
|
|
|
1292
1370
|
preserveAspectRatio: "xMidYMid meet",
|
|
1293
1371
|
version: "1.0",
|
|
1294
1372
|
fill: "currentColor",
|
|
1373
|
+
width: size,
|
|
1374
|
+
height: size,
|
|
1295
1375
|
...props,
|
|
1296
|
-
height: props.width,
|
|
1297
1376
|
children: /* @__PURE__ */ jsx("g", {
|
|
1298
1377
|
"fill-opacity": "1",
|
|
1299
1378
|
children: /* @__PURE__ */ jsx("g", {
|
|
@@ -1305,7 +1384,7 @@ const LogoLuminescent = component$((props) => {
|
|
|
1305
1384
|
})
|
|
1306
1385
|
});
|
|
1307
1386
|
});
|
|
1308
|
-
const LogoLuminescentFull = component$((props) => {
|
|
1387
|
+
const LogoLuminescentFull = component$(({ size, ...props }) => {
|
|
1309
1388
|
return /* @__PURE__ */ jsxs("svg", {
|
|
1310
1389
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1311
1390
|
"xmlns:xlink": "http://www.w3.org/1999/xlink",
|
|
@@ -1314,6 +1393,7 @@ const LogoLuminescentFull = component$((props) => {
|
|
|
1314
1393
|
preserveAspectRatio: "xMidYMid meet",
|
|
1315
1394
|
version: "1.0",
|
|
1316
1395
|
fill: "currentColor",
|
|
1396
|
+
height: size,
|
|
1317
1397
|
...props,
|
|
1318
1398
|
children: [
|
|
1319
1399
|
/* @__PURE__ */ jsx("g", {
|
|
@@ -1418,7 +1498,7 @@ const LogoLuminescentFull = component$((props) => {
|
|
|
1418
1498
|
]
|
|
1419
1499
|
});
|
|
1420
1500
|
});
|
|
1421
|
-
const LogoPaper = component$((props) => {
|
|
1501
|
+
const LogoPaper = component$(({ size, ...props }) => {
|
|
1422
1502
|
return /* @__PURE__ */ jsxs("svg", {
|
|
1423
1503
|
"xml:space": "preserve",
|
|
1424
1504
|
"fill-rule": "evenodd",
|
|
@@ -1427,8 +1507,9 @@ const LogoPaper = component$((props) => {
|
|
|
1427
1507
|
"stroke-miterlimit": "1.5",
|
|
1428
1508
|
"clip-rule": "evenodd",
|
|
1429
1509
|
viewBox: "0 0 24 24",
|
|
1510
|
+
width: size,
|
|
1511
|
+
height: size,
|
|
1430
1512
|
...props,
|
|
1431
|
-
height: props.width,
|
|
1432
1513
|
children: [
|
|
1433
1514
|
/* @__PURE__ */ jsx("path", {
|
|
1434
1515
|
fill: "none",
|
|
@@ -1452,14 +1533,15 @@ const LogoPaper = component$((props) => {
|
|
|
1452
1533
|
]
|
|
1453
1534
|
});
|
|
1454
1535
|
});
|
|
1455
|
-
const LogoPterodactyl = component$((props) => {
|
|
1536
|
+
const LogoPterodactyl = component$(({ size, ...props }) => {
|
|
1456
1537
|
return /* @__PURE__ */ jsx("svg", {
|
|
1457
1538
|
version: "1.0",
|
|
1458
1539
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1459
1540
|
viewBox: "0 0 180 180",
|
|
1460
1541
|
preserveAspectRatio: "xMidYMid meet",
|
|
1542
|
+
width: size,
|
|
1543
|
+
height: size,
|
|
1461
1544
|
...props,
|
|
1462
|
-
height: props.width,
|
|
1463
1545
|
children: /* @__PURE__ */ jsxs("g", {
|
|
1464
1546
|
transform: "translate(0,180) scale(0.100000,-0.100000)",
|
|
1465
1547
|
fill: "currentColor",
|
|
@@ -1481,7 +1563,7 @@ const LogoPterodactyl = component$((props) => {
|
|
|
1481
1563
|
})
|
|
1482
1564
|
});
|
|
1483
1565
|
});
|
|
1484
|
-
const LogoPurpur = component$((props) => {
|
|
1566
|
+
const LogoPurpur = component$(({ size, ...props }) => {
|
|
1485
1567
|
return /* @__PURE__ */ jsxs("svg", {
|
|
1486
1568
|
"xml:space": "preserve",
|
|
1487
1569
|
"fill-rule": "evenodd",
|
|
@@ -1490,8 +1572,9 @@ const LogoPurpur = component$((props) => {
|
|
|
1490
1572
|
"stroke-miterlimit": "1.5",
|
|
1491
1573
|
"clip-rule": "evenodd",
|
|
1492
1574
|
viewBox: "0 0 24 24",
|
|
1575
|
+
width: size,
|
|
1576
|
+
height: size,
|
|
1493
1577
|
...props,
|
|
1494
|
-
height: props.width,
|
|
1495
1578
|
children: [
|
|
1496
1579
|
/* @__PURE__ */ jsx("defs", {
|
|
1497
1580
|
children: /* @__PURE__ */ jsx("path", {
|
|
@@ -1551,12 +1634,13 @@ const LogoPurpur = component$((props) => {
|
|
|
1551
1634
|
]
|
|
1552
1635
|
});
|
|
1553
1636
|
});
|
|
1554
|
-
const LogoVelocity = component$((props) => {
|
|
1637
|
+
const LogoVelocity = component$(({ size, ...props }) => {
|
|
1555
1638
|
return /* @__PURE__ */ jsxs("svg", {
|
|
1556
1639
|
viewBox: "0 0 500 500",
|
|
1557
1640
|
fill: "currentColor",
|
|
1641
|
+
width: size,
|
|
1642
|
+
height: size,
|
|
1558
1643
|
...props,
|
|
1559
|
-
height: props.width,
|
|
1560
1644
|
children: [
|
|
1561
1645
|
/* @__PURE__ */ jsx("path", {
|
|
1562
1646
|
d: "M236.25 232.55l-54.08-73.79a11.86 11.86 0 00-11.91-4.62L84 171.57a11.88 11.88 0 00-8 5.88l-42.64 77.07a11.84 11.84 0 00.81 12.75l54.21 74a11.86 11.86 0 0011.91 4.62l86-17.37a11.85 11.85 0 008-5.89l42.78-77.3a11.86 11.86 0 00-.82-12.78zm-59.45 74.21a9.57 9.57 0 01-13.39-2.06l-31-42.24a16 16 0 00-16-6.21l-52.58 10.63a9.58 9.58 0 01-11.29-7.49A9.58 9.58 0 0160 248.1l57-11.52a16 16 0 0010.81-7.92L156.42 177a9.58 9.58 0 0113-3.75 9.58 9.58 0 013.75 13L146.81 234a16 16 0 001.09 17.16l31 42.23a9.58 9.58 0 01-2.1 13.37z"
|
|
@@ -1572,7 +1656,7 @@ const LogoVelocity = component$((props) => {
|
|
|
1572
1656
|
]
|
|
1573
1657
|
});
|
|
1574
1658
|
});
|
|
1575
|
-
const LogoWaterfall = component$((props) => {
|
|
1659
|
+
const LogoWaterfall = component$(({ size, ...props }) => {
|
|
1576
1660
|
return /* @__PURE__ */ jsx("svg", {
|
|
1577
1661
|
viewBox: "0 0 24 24",
|
|
1578
1662
|
fill: "none",
|
|
@@ -1580,8 +1664,9 @@ const LogoWaterfall = component$((props) => {
|
|
|
1580
1664
|
"stroke-width": "2",
|
|
1581
1665
|
"stroke-linecap": "round",
|
|
1582
1666
|
"stroke-linejoin": "round",
|
|
1667
|
+
width: size,
|
|
1668
|
+
height: size,
|
|
1583
1669
|
...props,
|
|
1584
|
-
height: props.width,
|
|
1585
1670
|
children: /* @__PURE__ */ jsx("path", {
|
|
1586
1671
|
d: "M12 2.69l5.66 5.66a8 8 0 1 1-11.31 0z"
|
|
1587
1672
|
})
|
|
@@ -1592,7 +1677,6 @@ export {
|
|
|
1592
1677
|
Blobs,
|
|
1593
1678
|
ColorPicker,
|
|
1594
1679
|
Dropdown,
|
|
1595
|
-
DropdownRaw,
|
|
1596
1680
|
LogoBirdflop,
|
|
1597
1681
|
LogoDiscord,
|
|
1598
1682
|
LogoFabric,
|
|
@@ -1607,6 +1691,8 @@ export {
|
|
|
1607
1691
|
Nav,
|
|
1608
1692
|
NumberInput,
|
|
1609
1693
|
NumberInputRaw,
|
|
1694
|
+
SelectMenu,
|
|
1695
|
+
SelectMenuRaw,
|
|
1610
1696
|
Toggle,
|
|
1611
1697
|
blobColorClasses,
|
|
1612
1698
|
toggleOffColorClasses,
|
|
@@ -1,16 +1,10 @@
|
|
|
1
|
-
import type {
|
|
2
|
-
interface DropdownProps extends Omit<PropsOf<'
|
|
1
|
+
import type { PropsOf } from '@builder.io/qwik';
|
|
2
|
+
interface DropdownProps extends Omit<PropsOf<'button'>, 'class'> {
|
|
3
3
|
class?: {
|
|
4
4
|
[key: string]: boolean;
|
|
5
5
|
};
|
|
6
|
-
display?: JSXChildren;
|
|
7
6
|
hover?: boolean;
|
|
8
|
-
|
|
9
|
-
name: JSXChildren;
|
|
10
|
-
value: string | number;
|
|
11
|
-
}[];
|
|
12
|
-
id: string;
|
|
7
|
+
opened?: boolean;
|
|
13
8
|
}
|
|
14
9
|
export declare const Dropdown: import("@builder.io/qwik").Component<DropdownProps>;
|
|
15
|
-
export declare const DropdownRaw: import("@builder.io/qwik").Component<DropdownProps>;
|
|
16
10
|
export {};
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import type { JSXChildren, PropsOf } from '@builder.io/qwik';
|
|
2
|
+
interface SelectMenuProps extends Omit<PropsOf<'select'>, 'class' | 'size'> {
|
|
3
|
+
class?: {
|
|
4
|
+
[key: string]: boolean;
|
|
5
|
+
};
|
|
6
|
+
customDropdown?: boolean;
|
|
7
|
+
hover?: boolean;
|
|
8
|
+
values?: {
|
|
9
|
+
name: JSXChildren;
|
|
10
|
+
value: string | number;
|
|
11
|
+
}[];
|
|
12
|
+
id: string;
|
|
13
|
+
}
|
|
14
|
+
export declare const SelectMenu: import("@builder.io/qwik").Component<SelectMenuProps>;
|
|
15
|
+
export declare const SelectMenuRaw: import("@builder.io/qwik").Component<SelectMenuProps>;
|
|
16
|
+
export {};
|
|
@@ -2,6 +2,7 @@ export * from './elements/Anchor';
|
|
|
2
2
|
export * from './elements/Blobs';
|
|
3
3
|
export * from './elements/ColorPicker';
|
|
4
4
|
export * from './elements/Dropdown';
|
|
5
|
+
export * from './elements/SelectMenu';
|
|
5
6
|
export * from './elements/Nav';
|
|
6
7
|
export * from './elements/NumberInput';
|
|
7
8
|
export * from './elements/Toggle';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@luminescent/ui-qwik",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "3.0.2",
|
|
4
4
|
"description": "Luminescent UI library",
|
|
5
5
|
"main": "./lib/index.qwik.mjs",
|
|
6
6
|
"qwik": "./lib/index.qwik.mjs",
|
|
@@ -52,7 +52,7 @@
|
|
|
52
52
|
"vite-tsconfig-paths": "^5.1.4"
|
|
53
53
|
},
|
|
54
54
|
"peerDependencies": {
|
|
55
|
-
"@luminescent/ui": "
|
|
55
|
+
"@luminescent/ui": "3.0.2"
|
|
56
56
|
},
|
|
57
57
|
"scripts": {
|
|
58
58
|
"build": "qwik build",
|