@luminescent/ui-qwik 2.1.0 → 3.0.1
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 +209 -124
- package/lib/index.qwik.mjs +210 -125
- 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,13 +1229,14 @@ 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 }) => {
|
|
1160
1233
|
return /* @__PURE__ */ jsxRuntime.jsxs("svg", {
|
|
1161
1234
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1162
1235
|
"xmlns:xlink": "http://www.w3.org/1999/xlink",
|
|
1163
1236
|
viewBox: "0 0 1080 1080",
|
|
1237
|
+
width: size,
|
|
1238
|
+
height: size,
|
|
1164
1239
|
...props,
|
|
1165
|
-
height: props.width,
|
|
1166
1240
|
children: [
|
|
1167
1241
|
/* @__PURE__ */ jsxRuntime.jsxs("defs", {
|
|
1168
1242
|
children: [
|
|
@@ -1222,19 +1296,20 @@ const LogoBirdflop = qwik.component$(({ confused, fillGradient, ...props }) => {
|
|
|
1222
1296
|
]
|
|
1223
1297
|
});
|
|
1224
1298
|
});
|
|
1225
|
-
const LogoDiscord = qwik.component$((props) => {
|
|
1299
|
+
const LogoDiscord = qwik.component$(({ size, ...props }) => {
|
|
1226
1300
|
return /* @__PURE__ */ jsxRuntime.jsx("svg", {
|
|
1227
1301
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1228
1302
|
viewBox: "0 0 127.14 96.36",
|
|
1229
1303
|
fill: "currentColor",
|
|
1304
|
+
width: size,
|
|
1305
|
+
height: size,
|
|
1230
1306
|
...props,
|
|
1231
|
-
height: props.width,
|
|
1232
1307
|
children: /* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
1233
1308
|
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
1309
|
})
|
|
1235
1310
|
});
|
|
1236
1311
|
});
|
|
1237
|
-
const LogoFabric = qwik.component$((props) => {
|
|
1312
|
+
const LogoFabric = qwik.component$(({ size, ...props }) => {
|
|
1238
1313
|
return /* @__PURE__ */ jsxRuntime.jsxs("svg", {
|
|
1239
1314
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1240
1315
|
"xml:space": "preserve",
|
|
@@ -1243,8 +1318,9 @@ const LogoFabric = qwik.component$((props) => {
|
|
|
1243
1318
|
"stroke-linejoin": "round",
|
|
1244
1319
|
"clip-rule": "evenodd",
|
|
1245
1320
|
viewBox: "0 0 24 24",
|
|
1321
|
+
width: size,
|
|
1322
|
+
height: size,
|
|
1246
1323
|
...props,
|
|
1247
|
-
height: props.width,
|
|
1248
1324
|
children: [
|
|
1249
1325
|
/* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
1250
1326
|
fill: "none",
|
|
@@ -1260,7 +1336,7 @@ const LogoFabric = qwik.component$((props) => {
|
|
|
1260
1336
|
]
|
|
1261
1337
|
});
|
|
1262
1338
|
});
|
|
1263
|
-
const LogoForge = qwik.component$((props) => {
|
|
1339
|
+
const LogoForge = qwik.component$(({ size, ...props }) => {
|
|
1264
1340
|
return /* @__PURE__ */ jsxRuntime.jsxs("svg", {
|
|
1265
1341
|
"xml:space": "preserve",
|
|
1266
1342
|
"fill-rule": "evenodd",
|
|
@@ -1269,8 +1345,9 @@ const LogoForge = qwik.component$((props) => {
|
|
|
1269
1345
|
"stroke-miterlimit": "1.5",
|
|
1270
1346
|
"clip-rule": "evenodd",
|
|
1271
1347
|
viewBox: "0 0 24 24",
|
|
1348
|
+
width: size,
|
|
1349
|
+
height: size,
|
|
1272
1350
|
...props,
|
|
1273
|
-
height: props.width,
|
|
1274
1351
|
children: [
|
|
1275
1352
|
/* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
1276
1353
|
fill: "none",
|
|
@@ -1285,7 +1362,7 @@ const LogoForge = qwik.component$((props) => {
|
|
|
1285
1362
|
]
|
|
1286
1363
|
});
|
|
1287
1364
|
});
|
|
1288
|
-
const LogoLuminescent = qwik.component$((props) => {
|
|
1365
|
+
const LogoLuminescent = qwik.component$(({ size, ...props }) => {
|
|
1289
1366
|
return /* @__PURE__ */ jsxRuntime.jsx("svg", {
|
|
1290
1367
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1291
1368
|
"xmlns:xlink": "http://www.w3.org/1999/xlink",
|
|
@@ -1294,8 +1371,9 @@ const LogoLuminescent = qwik.component$((props) => {
|
|
|
1294
1371
|
preserveAspectRatio: "xMidYMid meet",
|
|
1295
1372
|
version: "1.0",
|
|
1296
1373
|
fill: "currentColor",
|
|
1374
|
+
width: size,
|
|
1375
|
+
height: size,
|
|
1297
1376
|
...props,
|
|
1298
|
-
height: props.width,
|
|
1299
1377
|
children: /* @__PURE__ */ jsxRuntime.jsx("g", {
|
|
1300
1378
|
"fill-opacity": "1",
|
|
1301
1379
|
children: /* @__PURE__ */ jsxRuntime.jsx("g", {
|
|
@@ -1307,7 +1385,7 @@ const LogoLuminescent = qwik.component$((props) => {
|
|
|
1307
1385
|
})
|
|
1308
1386
|
});
|
|
1309
1387
|
});
|
|
1310
|
-
const LogoLuminescentFull = qwik.component$((props) => {
|
|
1388
|
+
const LogoLuminescentFull = qwik.component$(({ size, ...props }) => {
|
|
1311
1389
|
return /* @__PURE__ */ jsxRuntime.jsxs("svg", {
|
|
1312
1390
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1313
1391
|
"xmlns:xlink": "http://www.w3.org/1999/xlink",
|
|
@@ -1316,6 +1394,7 @@ const LogoLuminescentFull = qwik.component$((props) => {
|
|
|
1316
1394
|
preserveAspectRatio: "xMidYMid meet",
|
|
1317
1395
|
version: "1.0",
|
|
1318
1396
|
fill: "currentColor",
|
|
1397
|
+
height: size,
|
|
1319
1398
|
...props,
|
|
1320
1399
|
children: [
|
|
1321
1400
|
/* @__PURE__ */ jsxRuntime.jsx("g", {
|
|
@@ -1420,7 +1499,7 @@ const LogoLuminescentFull = qwik.component$((props) => {
|
|
|
1420
1499
|
]
|
|
1421
1500
|
});
|
|
1422
1501
|
});
|
|
1423
|
-
const LogoPaper = qwik.component$((props) => {
|
|
1502
|
+
const LogoPaper = qwik.component$(({ size, ...props }) => {
|
|
1424
1503
|
return /* @__PURE__ */ jsxRuntime.jsxs("svg", {
|
|
1425
1504
|
"xml:space": "preserve",
|
|
1426
1505
|
"fill-rule": "evenodd",
|
|
@@ -1429,8 +1508,9 @@ const LogoPaper = qwik.component$((props) => {
|
|
|
1429
1508
|
"stroke-miterlimit": "1.5",
|
|
1430
1509
|
"clip-rule": "evenodd",
|
|
1431
1510
|
viewBox: "0 0 24 24",
|
|
1511
|
+
width: size,
|
|
1512
|
+
height: size,
|
|
1432
1513
|
...props,
|
|
1433
|
-
height: props.width,
|
|
1434
1514
|
children: [
|
|
1435
1515
|
/* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
1436
1516
|
fill: "none",
|
|
@@ -1454,14 +1534,15 @@ const LogoPaper = qwik.component$((props) => {
|
|
|
1454
1534
|
]
|
|
1455
1535
|
});
|
|
1456
1536
|
});
|
|
1457
|
-
const LogoPterodactyl = qwik.component$((props) => {
|
|
1537
|
+
const LogoPterodactyl = qwik.component$(({ size, ...props }) => {
|
|
1458
1538
|
return /* @__PURE__ */ jsxRuntime.jsx("svg", {
|
|
1459
1539
|
version: "1.0",
|
|
1460
1540
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1461
1541
|
viewBox: "0 0 180 180",
|
|
1462
1542
|
preserveAspectRatio: "xMidYMid meet",
|
|
1543
|
+
width: size,
|
|
1544
|
+
height: size,
|
|
1463
1545
|
...props,
|
|
1464
|
-
height: props.width,
|
|
1465
1546
|
children: /* @__PURE__ */ jsxRuntime.jsxs("g", {
|
|
1466
1547
|
transform: "translate(0,180) scale(0.100000,-0.100000)",
|
|
1467
1548
|
fill: "currentColor",
|
|
@@ -1483,7 +1564,7 @@ const LogoPterodactyl = qwik.component$((props) => {
|
|
|
1483
1564
|
})
|
|
1484
1565
|
});
|
|
1485
1566
|
});
|
|
1486
|
-
const LogoPurpur = qwik.component$((props) => {
|
|
1567
|
+
const LogoPurpur = qwik.component$(({ size, ...props }) => {
|
|
1487
1568
|
return /* @__PURE__ */ jsxRuntime.jsxs("svg", {
|
|
1488
1569
|
"xml:space": "preserve",
|
|
1489
1570
|
"fill-rule": "evenodd",
|
|
@@ -1492,8 +1573,9 @@ const LogoPurpur = qwik.component$((props) => {
|
|
|
1492
1573
|
"stroke-miterlimit": "1.5",
|
|
1493
1574
|
"clip-rule": "evenodd",
|
|
1494
1575
|
viewBox: "0 0 24 24",
|
|
1576
|
+
width: size,
|
|
1577
|
+
height: size,
|
|
1495
1578
|
...props,
|
|
1496
|
-
height: props.width,
|
|
1497
1579
|
children: [
|
|
1498
1580
|
/* @__PURE__ */ jsxRuntime.jsx("defs", {
|
|
1499
1581
|
children: /* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
@@ -1553,12 +1635,13 @@ const LogoPurpur = qwik.component$((props) => {
|
|
|
1553
1635
|
]
|
|
1554
1636
|
});
|
|
1555
1637
|
});
|
|
1556
|
-
const LogoVelocity = qwik.component$((props) => {
|
|
1638
|
+
const LogoVelocity = qwik.component$(({ size, ...props }) => {
|
|
1557
1639
|
return /* @__PURE__ */ jsxRuntime.jsxs("svg", {
|
|
1558
1640
|
viewBox: "0 0 500 500",
|
|
1559
1641
|
fill: "currentColor",
|
|
1642
|
+
width: size,
|
|
1643
|
+
height: size,
|
|
1560
1644
|
...props,
|
|
1561
|
-
height: props.width,
|
|
1562
1645
|
children: [
|
|
1563
1646
|
/* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
1564
1647
|
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 +1657,7 @@ const LogoVelocity = qwik.component$((props) => {
|
|
|
1574
1657
|
]
|
|
1575
1658
|
});
|
|
1576
1659
|
});
|
|
1577
|
-
const LogoWaterfall = qwik.component$((props) => {
|
|
1660
|
+
const LogoWaterfall = qwik.component$(({ size, ...props }) => {
|
|
1578
1661
|
return /* @__PURE__ */ jsxRuntime.jsx("svg", {
|
|
1579
1662
|
viewBox: "0 0 24 24",
|
|
1580
1663
|
fill: "none",
|
|
@@ -1582,8 +1665,9 @@ const LogoWaterfall = qwik.component$((props) => {
|
|
|
1582
1665
|
"stroke-width": "2",
|
|
1583
1666
|
"stroke-linecap": "round",
|
|
1584
1667
|
"stroke-linejoin": "round",
|
|
1668
|
+
width: size,
|
|
1669
|
+
height: size,
|
|
1585
1670
|
...props,
|
|
1586
|
-
height: props.width,
|
|
1587
1671
|
children: /* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
1588
1672
|
d: "M12 2.69l5.66 5.66a8 8 0 1 1-11.31 0z"
|
|
1589
1673
|
})
|
|
@@ -1593,7 +1677,6 @@ exports.Anchor = Anchor;
|
|
|
1593
1677
|
exports.Blobs = Blobs;
|
|
1594
1678
|
exports.ColorPicker = ColorPicker;
|
|
1595
1679
|
exports.Dropdown = Dropdown;
|
|
1596
|
-
exports.DropdownRaw = DropdownRaw;
|
|
1597
1680
|
exports.LogoBirdflop = LogoBirdflop;
|
|
1598
1681
|
exports.LogoDiscord = LogoDiscord;
|
|
1599
1682
|
exports.LogoFabric = LogoFabric;
|
|
@@ -1608,6 +1691,8 @@ exports.LogoWaterfall = LogoWaterfall;
|
|
|
1608
1691
|
exports.Nav = Nav;
|
|
1609
1692
|
exports.NumberInput = NumberInput;
|
|
1610
1693
|
exports.NumberInputRaw = NumberInputRaw;
|
|
1694
|
+
exports.SelectMenu = SelectMenu;
|
|
1695
|
+
exports.SelectMenuRaw = SelectMenuRaw;
|
|
1611
1696
|
exports.Toggle = Toggle;
|
|
1612
1697
|
exports.blobColorClasses = blobColorClasses;
|
|
1613
1698
|
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,13 +1227,14 @@ 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 }) => {
|
|
1158
1231
|
return /* @__PURE__ */ jsxs("svg", {
|
|
1159
1232
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1160
1233
|
"xmlns:xlink": "http://www.w3.org/1999/xlink",
|
|
1161
1234
|
viewBox: "0 0 1080 1080",
|
|
1235
|
+
width: size,
|
|
1236
|
+
height: size,
|
|
1162
1237
|
...props,
|
|
1163
|
-
height: props.width,
|
|
1164
1238
|
children: [
|
|
1165
1239
|
/* @__PURE__ */ jsxs("defs", {
|
|
1166
1240
|
children: [
|
|
@@ -1220,19 +1294,20 @@ const LogoBirdflop = component$(({ confused, fillGradient, ...props }) => {
|
|
|
1220
1294
|
]
|
|
1221
1295
|
});
|
|
1222
1296
|
});
|
|
1223
|
-
const LogoDiscord = component$((props) => {
|
|
1297
|
+
const LogoDiscord = component$(({ size, ...props }) => {
|
|
1224
1298
|
return /* @__PURE__ */ jsx("svg", {
|
|
1225
1299
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1226
1300
|
viewBox: "0 0 127.14 96.36",
|
|
1227
1301
|
fill: "currentColor",
|
|
1302
|
+
width: size,
|
|
1303
|
+
height: size,
|
|
1228
1304
|
...props,
|
|
1229
|
-
height: props.width,
|
|
1230
1305
|
children: /* @__PURE__ */ jsx("path", {
|
|
1231
1306
|
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
1307
|
})
|
|
1233
1308
|
});
|
|
1234
1309
|
});
|
|
1235
|
-
const LogoFabric = component$((props) => {
|
|
1310
|
+
const LogoFabric = component$(({ size, ...props }) => {
|
|
1236
1311
|
return /* @__PURE__ */ jsxs("svg", {
|
|
1237
1312
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1238
1313
|
"xml:space": "preserve",
|
|
@@ -1241,8 +1316,9 @@ const LogoFabric = component$((props) => {
|
|
|
1241
1316
|
"stroke-linejoin": "round",
|
|
1242
1317
|
"clip-rule": "evenodd",
|
|
1243
1318
|
viewBox: "0 0 24 24",
|
|
1319
|
+
width: size,
|
|
1320
|
+
height: size,
|
|
1244
1321
|
...props,
|
|
1245
|
-
height: props.width,
|
|
1246
1322
|
children: [
|
|
1247
1323
|
/* @__PURE__ */ jsx("path", {
|
|
1248
1324
|
fill: "none",
|
|
@@ -1258,7 +1334,7 @@ const LogoFabric = component$((props) => {
|
|
|
1258
1334
|
]
|
|
1259
1335
|
});
|
|
1260
1336
|
});
|
|
1261
|
-
const LogoForge = component$((props) => {
|
|
1337
|
+
const LogoForge = component$(({ size, ...props }) => {
|
|
1262
1338
|
return /* @__PURE__ */ jsxs("svg", {
|
|
1263
1339
|
"xml:space": "preserve",
|
|
1264
1340
|
"fill-rule": "evenodd",
|
|
@@ -1267,8 +1343,9 @@ const LogoForge = component$((props) => {
|
|
|
1267
1343
|
"stroke-miterlimit": "1.5",
|
|
1268
1344
|
"clip-rule": "evenodd",
|
|
1269
1345
|
viewBox: "0 0 24 24",
|
|
1346
|
+
width: size,
|
|
1347
|
+
height: size,
|
|
1270
1348
|
...props,
|
|
1271
|
-
height: props.width,
|
|
1272
1349
|
children: [
|
|
1273
1350
|
/* @__PURE__ */ jsx("path", {
|
|
1274
1351
|
fill: "none",
|
|
@@ -1283,7 +1360,7 @@ const LogoForge = component$((props) => {
|
|
|
1283
1360
|
]
|
|
1284
1361
|
});
|
|
1285
1362
|
});
|
|
1286
|
-
const LogoLuminescent = component$((props) => {
|
|
1363
|
+
const LogoLuminescent = component$(({ size, ...props }) => {
|
|
1287
1364
|
return /* @__PURE__ */ jsx("svg", {
|
|
1288
1365
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1289
1366
|
"xmlns:xlink": "http://www.w3.org/1999/xlink",
|
|
@@ -1292,8 +1369,9 @@ const LogoLuminescent = component$((props) => {
|
|
|
1292
1369
|
preserveAspectRatio: "xMidYMid meet",
|
|
1293
1370
|
version: "1.0",
|
|
1294
1371
|
fill: "currentColor",
|
|
1372
|
+
width: size,
|
|
1373
|
+
height: size,
|
|
1295
1374
|
...props,
|
|
1296
|
-
height: props.width,
|
|
1297
1375
|
children: /* @__PURE__ */ jsx("g", {
|
|
1298
1376
|
"fill-opacity": "1",
|
|
1299
1377
|
children: /* @__PURE__ */ jsx("g", {
|
|
@@ -1305,7 +1383,7 @@ const LogoLuminescent = component$((props) => {
|
|
|
1305
1383
|
})
|
|
1306
1384
|
});
|
|
1307
1385
|
});
|
|
1308
|
-
const LogoLuminescentFull = component$((props) => {
|
|
1386
|
+
const LogoLuminescentFull = component$(({ size, ...props }) => {
|
|
1309
1387
|
return /* @__PURE__ */ jsxs("svg", {
|
|
1310
1388
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1311
1389
|
"xmlns:xlink": "http://www.w3.org/1999/xlink",
|
|
@@ -1314,6 +1392,7 @@ const LogoLuminescentFull = component$((props) => {
|
|
|
1314
1392
|
preserveAspectRatio: "xMidYMid meet",
|
|
1315
1393
|
version: "1.0",
|
|
1316
1394
|
fill: "currentColor",
|
|
1395
|
+
height: size,
|
|
1317
1396
|
...props,
|
|
1318
1397
|
children: [
|
|
1319
1398
|
/* @__PURE__ */ jsx("g", {
|
|
@@ -1418,7 +1497,7 @@ const LogoLuminescentFull = component$((props) => {
|
|
|
1418
1497
|
]
|
|
1419
1498
|
});
|
|
1420
1499
|
});
|
|
1421
|
-
const LogoPaper = component$((props) => {
|
|
1500
|
+
const LogoPaper = component$(({ size, ...props }) => {
|
|
1422
1501
|
return /* @__PURE__ */ jsxs("svg", {
|
|
1423
1502
|
"xml:space": "preserve",
|
|
1424
1503
|
"fill-rule": "evenodd",
|
|
@@ -1427,8 +1506,9 @@ const LogoPaper = component$((props) => {
|
|
|
1427
1506
|
"stroke-miterlimit": "1.5",
|
|
1428
1507
|
"clip-rule": "evenodd",
|
|
1429
1508
|
viewBox: "0 0 24 24",
|
|
1509
|
+
width: size,
|
|
1510
|
+
height: size,
|
|
1430
1511
|
...props,
|
|
1431
|
-
height: props.width,
|
|
1432
1512
|
children: [
|
|
1433
1513
|
/* @__PURE__ */ jsx("path", {
|
|
1434
1514
|
fill: "none",
|
|
@@ -1452,14 +1532,15 @@ const LogoPaper = component$((props) => {
|
|
|
1452
1532
|
]
|
|
1453
1533
|
});
|
|
1454
1534
|
});
|
|
1455
|
-
const LogoPterodactyl = component$((props) => {
|
|
1535
|
+
const LogoPterodactyl = component$(({ size, ...props }) => {
|
|
1456
1536
|
return /* @__PURE__ */ jsx("svg", {
|
|
1457
1537
|
version: "1.0",
|
|
1458
1538
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1459
1539
|
viewBox: "0 0 180 180",
|
|
1460
1540
|
preserveAspectRatio: "xMidYMid meet",
|
|
1541
|
+
width: size,
|
|
1542
|
+
height: size,
|
|
1461
1543
|
...props,
|
|
1462
|
-
height: props.width,
|
|
1463
1544
|
children: /* @__PURE__ */ jsxs("g", {
|
|
1464
1545
|
transform: "translate(0,180) scale(0.100000,-0.100000)",
|
|
1465
1546
|
fill: "currentColor",
|
|
@@ -1481,7 +1562,7 @@ const LogoPterodactyl = component$((props) => {
|
|
|
1481
1562
|
})
|
|
1482
1563
|
});
|
|
1483
1564
|
});
|
|
1484
|
-
const LogoPurpur = component$((props) => {
|
|
1565
|
+
const LogoPurpur = component$(({ size, ...props }) => {
|
|
1485
1566
|
return /* @__PURE__ */ jsxs("svg", {
|
|
1486
1567
|
"xml:space": "preserve",
|
|
1487
1568
|
"fill-rule": "evenodd",
|
|
@@ -1490,8 +1571,9 @@ const LogoPurpur = component$((props) => {
|
|
|
1490
1571
|
"stroke-miterlimit": "1.5",
|
|
1491
1572
|
"clip-rule": "evenodd",
|
|
1492
1573
|
viewBox: "0 0 24 24",
|
|
1574
|
+
width: size,
|
|
1575
|
+
height: size,
|
|
1493
1576
|
...props,
|
|
1494
|
-
height: props.width,
|
|
1495
1577
|
children: [
|
|
1496
1578
|
/* @__PURE__ */ jsx("defs", {
|
|
1497
1579
|
children: /* @__PURE__ */ jsx("path", {
|
|
@@ -1551,12 +1633,13 @@ const LogoPurpur = component$((props) => {
|
|
|
1551
1633
|
]
|
|
1552
1634
|
});
|
|
1553
1635
|
});
|
|
1554
|
-
const LogoVelocity = component$((props) => {
|
|
1636
|
+
const LogoVelocity = component$(({ size, ...props }) => {
|
|
1555
1637
|
return /* @__PURE__ */ jsxs("svg", {
|
|
1556
1638
|
viewBox: "0 0 500 500",
|
|
1557
1639
|
fill: "currentColor",
|
|
1640
|
+
width: size,
|
|
1641
|
+
height: size,
|
|
1558
1642
|
...props,
|
|
1559
|
-
height: props.width,
|
|
1560
1643
|
children: [
|
|
1561
1644
|
/* @__PURE__ */ jsx("path", {
|
|
1562
1645
|
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 +1655,7 @@ const LogoVelocity = component$((props) => {
|
|
|
1572
1655
|
]
|
|
1573
1656
|
});
|
|
1574
1657
|
});
|
|
1575
|
-
const LogoWaterfall = component$((props) => {
|
|
1658
|
+
const LogoWaterfall = component$(({ size, ...props }) => {
|
|
1576
1659
|
return /* @__PURE__ */ jsx("svg", {
|
|
1577
1660
|
viewBox: "0 0 24 24",
|
|
1578
1661
|
fill: "none",
|
|
@@ -1580,8 +1663,9 @@ const LogoWaterfall = component$((props) => {
|
|
|
1580
1663
|
"stroke-width": "2",
|
|
1581
1664
|
"stroke-linecap": "round",
|
|
1582
1665
|
"stroke-linejoin": "round",
|
|
1666
|
+
width: size,
|
|
1667
|
+
height: size,
|
|
1583
1668
|
...props,
|
|
1584
|
-
height: props.width,
|
|
1585
1669
|
children: /* @__PURE__ */ jsx("path", {
|
|
1586
1670
|
d: "M12 2.69l5.66 5.66a8 8 0 1 1-11.31 0z"
|
|
1587
1671
|
})
|
|
@@ -1592,7 +1676,6 @@ export {
|
|
|
1592
1676
|
Blobs,
|
|
1593
1677
|
ColorPicker,
|
|
1594
1678
|
Dropdown,
|
|
1595
|
-
DropdownRaw,
|
|
1596
1679
|
LogoBirdflop,
|
|
1597
1680
|
LogoDiscord,
|
|
1598
1681
|
LogoFabric,
|
|
@@ -1607,6 +1690,8 @@ export {
|
|
|
1607
1690
|
Nav,
|
|
1608
1691
|
NumberInput,
|
|
1609
1692
|
NumberInputRaw,
|
|
1693
|
+
SelectMenu,
|
|
1694
|
+
SelectMenuRaw,
|
|
1610
1695
|
Toggle,
|
|
1611
1696
|
blobColorClasses,
|
|
1612
1697
|
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.1",
|
|
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.1"
|
|
56
56
|
},
|
|
57
57
|
"scripts": {
|
|
58
58
|
"build": "qwik build",
|