@luminescent/ui-qwik 4.1.0 → 4.2.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.
Files changed (4) hide show
  1. package/lib/index.qwik.cjs +15 -8
  2. package/lib/index.qwik.mjs +15 -8
  3. package/lib-types/components/elements/SelectMenu.d.ts +1 -0
  4. package/package.json +16 -16
package/lib/index.qwik.cjs CHANGED
@@ -606,7 +606,7 @@ const ColorPicker = qwik.component$(({ id, value = "#000000", colors = [
606
606
  await setColor(color);
607
607
  },
608
608
  children: /* @__PURE__ */ jsxRuntime.jsx(Shuffle, {
609
- class: "p-0.5 pl-0.5 text-gray-300"
609
+ class: "p-0.5 pl-0.5 text-lum-text"
610
610
  })
611
611
  })
612
612
  ]
@@ -663,7 +663,7 @@ const SelectMenu = qwik.component$((props) => {
663
663
  children: [
664
664
  /* @__PURE__ */ jsxRuntime.jsx("label", {
665
665
  for: props.id,
666
- class: "pb-1 text-gray-300 select-none",
666
+ class: "pb-1 text-lum-text select-none",
667
667
  children: /* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, {})
668
668
  }),
669
669
  /* @__PURE__ */ jsxRuntime.jsxs(SelectMenuRaw, {
@@ -686,7 +686,7 @@ const SelectMenu = qwik.component$((props) => {
686
686
  ]
687
687
  });
688
688
  });
689
- const SelectMenuRaw = qwik.component$(({ id, values, class: Class, customDropdown, hover, ...props }) => {
689
+ const SelectMenuRaw = qwik.component$(({ id, values, class: Class, customDropdown, hover, align, ...props }) => {
690
690
  const store = qwik.useStore({
691
691
  opened: false,
692
692
  value: props.value
@@ -712,7 +712,10 @@ const SelectMenuRaw = qwik.component$(({ id, values, class: Class, customDropdow
712
712
  }),
713
713
  /* @__PURE__ */ jsxRuntime.jsxs(Dropdown, {
714
714
  opened: store.opened,
715
- class: Class,
715
+ class: {
716
+ "w-full": true,
717
+ ...Class
718
+ },
716
719
  onClick$: () => {
717
720
  if (!hover) store.opened = !store.opened;
718
721
  },
@@ -732,8 +735,12 @@ const SelectMenuRaw = qwik.component$(({ id, values, class: Class, customDropdow
732
735
  ]
733
736
  }),
734
737
  /* @__PURE__ */ jsxRuntime.jsx("div", {
738
+ id: `lui-${id}-opts-container`,
735
739
  class: {
736
- "absolute top-full left-0 z-[1000] pt-2 transition-all ease-out": true,
740
+ "absolute z-[1000] pt-2 transition-all ease-out": true,
741
+ "left-0": align === "left",
742
+ "right-0": align === "right",
743
+ "left-1/2 -translate-x-1/2": align === "center",
737
744
  "pointer-events-none scale-95 opacity-0": !store.opened,
738
745
  "duration-300 group-hover:pointer-events-auto group-hover:scale-100 group-hover:opacity-100 group-hover:duration-75": hover,
739
746
  "focus-within:pointer-events-auto focus-within:scale-100 focus-within:opacity-100 focus-within:duration-75": true
@@ -923,7 +930,7 @@ const NumberInput = qwik.component$((props) => {
923
930
  children: [
924
931
  /* @__PURE__ */ jsxRuntime.jsx("label", {
925
932
  for: props.id,
926
- class: "pb-1 text-gray-300 select-none",
933
+ class: "pb-1 text-lum-text select-none",
927
934
  children: /* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, {})
928
935
  }),
929
936
  /* @__PURE__ */ jsxRuntime.jsx(NumberInputRaw, {
@@ -946,7 +953,7 @@ const NumberInputRaw = qwik.component$(({ input, onDecrement$, onIncrement$, val
946
953
  `);
947
954
  return /* @__PURE__ */ jsxRuntime.jsxs("div", {
948
955
  class: {
949
- "flex touch-manipulation gap-1 text-gray-50": true
956
+ "flex touch-manipulation gap-1 text-lum-text": true
950
957
  },
951
958
  children: [
952
959
  /* @__PURE__ */ jsxRuntime.jsx("button", {
@@ -1028,7 +1035,7 @@ const Toggle = qwik.component$(({ checkbox, round, label, ...props }) => {
1028
1035
  }),
1029
1036
  label && /* @__PURE__ */ jsxRuntime.jsx("label", {
1030
1037
  for: props.id,
1031
- class: "flex gap-2 text-gray-300 select-none",
1038
+ class: "flex gap-2 text-lum-text select-none",
1032
1039
  children: label
1033
1040
  })
1034
1041
  ]
package/lib/index.qwik.mjs CHANGED
@@ -604,7 +604,7 @@ const ColorPicker = component$(({ id, value = "#000000", colors = [
604
604
  await setColor(color);
605
605
  },
606
606
  children: /* @__PURE__ */ jsx(Shuffle, {
607
- class: "p-0.5 pl-0.5 text-gray-300"
607
+ class: "p-0.5 pl-0.5 text-lum-text"
608
608
  })
609
609
  })
610
610
  ]
@@ -661,7 +661,7 @@ const SelectMenu = component$((props) => {
661
661
  children: [
662
662
  /* @__PURE__ */ jsx("label", {
663
663
  for: props.id,
664
- class: "pb-1 text-gray-300 select-none",
664
+ class: "pb-1 text-lum-text select-none",
665
665
  children: /* @__PURE__ */ jsx(Slot, {})
666
666
  }),
667
667
  /* @__PURE__ */ jsxs(SelectMenuRaw, {
@@ -684,7 +684,7 @@ const SelectMenu = component$((props) => {
684
684
  ]
685
685
  });
686
686
  });
687
- const SelectMenuRaw = component$(({ id, values, class: Class, customDropdown, hover, ...props }) => {
687
+ const SelectMenuRaw = component$(({ id, values, class: Class, customDropdown, hover, align, ...props }) => {
688
688
  const store = useStore({
689
689
  opened: false,
690
690
  value: props.value
@@ -710,7 +710,10 @@ const SelectMenuRaw = component$(({ id, values, class: Class, customDropdown, ho
710
710
  }),
711
711
  /* @__PURE__ */ jsxs(Dropdown, {
712
712
  opened: store.opened,
713
- class: Class,
713
+ class: {
714
+ "w-full": true,
715
+ ...Class
716
+ },
714
717
  onClick$: () => {
715
718
  if (!hover) store.opened = !store.opened;
716
719
  },
@@ -730,8 +733,12 @@ const SelectMenuRaw = component$(({ id, values, class: Class, customDropdown, ho
730
733
  ]
731
734
  }),
732
735
  /* @__PURE__ */ jsx("div", {
736
+ id: `lui-${id}-opts-container`,
733
737
  class: {
734
- "absolute top-full left-0 z-[1000] pt-2 transition-all ease-out": true,
738
+ "absolute z-[1000] pt-2 transition-all ease-out": true,
739
+ "left-0": align === "left",
740
+ "right-0": align === "right",
741
+ "left-1/2 -translate-x-1/2": align === "center",
735
742
  "pointer-events-none scale-95 opacity-0": !store.opened,
736
743
  "duration-300 group-hover:pointer-events-auto group-hover:scale-100 group-hover:opacity-100 group-hover:duration-75": hover,
737
744
  "focus-within:pointer-events-auto focus-within:scale-100 focus-within:opacity-100 focus-within:duration-75": true
@@ -921,7 +928,7 @@ const NumberInput = component$((props) => {
921
928
  children: [
922
929
  /* @__PURE__ */ jsx("label", {
923
930
  for: props.id,
924
- class: "pb-1 text-gray-300 select-none",
931
+ class: "pb-1 text-lum-text select-none",
925
932
  children: /* @__PURE__ */ jsx(Slot, {})
926
933
  }),
927
934
  /* @__PURE__ */ jsx(NumberInputRaw, {
@@ -944,7 +951,7 @@ const NumberInputRaw = component$(({ input, onDecrement$, onIncrement$, value =
944
951
  `);
945
952
  return /* @__PURE__ */ jsxs("div", {
946
953
  class: {
947
- "flex touch-manipulation gap-1 text-gray-50": true
954
+ "flex touch-manipulation gap-1 text-lum-text": true
948
955
  },
949
956
  children: [
950
957
  /* @__PURE__ */ jsx("button", {
@@ -1026,7 +1033,7 @@ const Toggle = component$(({ checkbox, round, label, ...props }) => {
1026
1033
  }),
1027
1034
  label && /* @__PURE__ */ jsx("label", {
1028
1035
  for: props.id,
1029
- class: "flex gap-2 text-gray-300 select-none",
1036
+ class: "flex gap-2 text-lum-text select-none",
1030
1037
  children: label
1031
1038
  })
1032
1039
  ]
package/lib-types/components/elements/SelectMenu.d.ts CHANGED
@@ -5,6 +5,7 @@ interface SelectMenuProps extends Omit<PropsOf<'select'>, 'class' | 'size'> {
5
5
  };
6
6
  customDropdown?: boolean;
7
7
  hover?: boolean;
8
+ align?: 'left' | 'right' | 'center';
8
9
  values?: {
9
10
  name: JSXChildren;
10
11
  value: string | number;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@luminescent/ui-qwik",
3
- "version": "4.1.0",
3
+ "version": "4.2.1",
4
4
  "description": "Luminescent UI library",
5
5
  "main": "./lib/index.qwik.mjs",
6
6
  "qwik": "./lib/index.qwik.mjs",
@@ -32,27 +32,27 @@
32
32
  },
33
33
  "devDependencies": {
34
34
  "@anuragroy/tailwindcss-animate": "^1.0.6",
35
- "@builder.io/qwik": "1.13.0",
36
- "@builder.io/qwik-city": "^1.13.0",
37
- "@eslint/js": "^9.26.0",
38
- "@tailwindcss/vite": "^4.1.5",
35
+ "@builder.io/qwik": "1.14.1",
36
+ "@builder.io/qwik-city": "^1.14.1",
37
+ "@eslint/js": "^9.30.1",
38
+ "@tailwindcss/vite": "^4.1.11",
39
39
  "@types/eslint": "^9.6.1",
40
- "@types/node": "^22.15.3",
41
- "@typescript-eslint/eslint-plugin": "^8.31.1",
42
- "@typescript-eslint/parser": "^8.31.1",
43
- "eslint": "^9.26.0",
44
- "eslint-plugin-qwik": "^1.13.0",
45
- "globals": "^16.0.0",
46
- "prettier": "^3.5.3",
47
- "prettier-plugin-tailwindcss": "^0.6.11",
48
- "tailwindcss": "4.1.5",
40
+ "@types/node": "^24.0.10",
41
+ "@typescript-eslint/eslint-plugin": "^8.35.1",
42
+ "@typescript-eslint/parser": "^8.35.1",
43
+ "eslint": "^9.30.1",
44
+ "eslint-plugin-qwik": "^1.14.1",
45
+ "globals": "^16.3.0",
46
+ "prettier": "^3.6.2",
47
+ "prettier-plugin-tailwindcss": "^0.6.13",
48
+ "tailwindcss": "4.1.11",
49
49
  "typescript": "5.8.3",
50
- "typescript-eslint": "^8.31.1",
50
+ "typescript-eslint": "^8.35.1",
51
51
  "vite": "5.4.14",
52
52
  "vite-tsconfig-paths": "^5.1.4"
53
53
  },
54
54
  "peerDependencies": {
55
- "@luminescent/ui": "4.1.0"
55
+ "@luminescent/ui": "4.2.1"
56
56
  },
57
57
  "scripts": {
58
58
  "build": "qwik build",