@luminescent/ui-qwik 6.0.1 → 6.1.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.
@@ -45,7 +45,7 @@ const Anchor = qwik.component$(({ id, ...props }) => /* @__PURE__ */ jsxRuntime.
45
45
  await navigator.clipboard.writeText(window.location.href);
46
46
  },
47
47
  children: /* @__PURE__ */ jsxRuntime.jsx(Link, {
48
- class: "opacity-10 transition-all duration-300 group-hover:opacity-100 group-hover:duration-75",
48
+ class: "opacity-10 transition-opacity duration-300 group-hover:opacity-100 group-hover:duration-75",
49
49
  size: 20
50
50
  })
51
51
  })
@@ -484,7 +484,7 @@ const ColorPicker = qwik.component$(({ id, value = "#000000", colors = [
484
484
  });
485
485
  return /* @__PURE__ */ jsxRuntime.jsxs("div", {
486
486
  class: {
487
- "lum-card touch-none p-4 motion-safe:transition-all": true,
487
+ "lum-card touch-none p-4": true,
488
488
  "flex-col": !horizontal,
489
489
  ...props.class
490
490
  },
@@ -508,7 +508,7 @@ const ColorPicker = qwik.component$(({ id, value = "#000000", colors = [
508
508
  "preventdefault:touchstart": true,
509
509
  children: [
510
510
  /* @__PURE__ */ jsxRuntime.jsx("div", {
511
- class: "h-[150px] w-[125px] rounded-md border border-gray-700 bg-gradient-to-b from-transparent to-black"
511
+ class: "h-[150px] w-[125px] rounded-md border border-gray-700 bg-linear-to-b from-transparent to-black"
512
512
  }),
513
513
  /* @__PURE__ */ jsxRuntime.jsx("div", {
514
514
  class: {
@@ -650,7 +650,7 @@ const Dropdown = qwik.component$(({ class: Class, hover, opened, ...props }) =>
650
650
  /* @__PURE__ */ jsxRuntime.jsx(ChevronDown, {
651
651
  size: 16,
652
652
  class: {
653
- "ease-out motion-safe:transition-all": true,
653
+ "ease-out motion-safe:transition-transform": true,
654
654
  "rotate-180 transform": opened,
655
655
  "duration-300 group-hover:rotate-180 group-hover:transform group-hover:duration-75": hover,
656
656
  "focus-within:rotate-180 focus-within:transform focus-within:duration-75": true
@@ -690,7 +690,7 @@ const Nav = qwik.component$(({ fixed, floating, noblur, nohamburger, colorClass
690
690
  return /* @__PURE__ */ jsxRuntime.jsxs("nav", {
691
691
  ...props,
692
692
  class: {
693
- "top-0 left-0 z-50 flex w-full flex-col duration-200 motion-safe:transition-all": true,
693
+ "top-0 left-0 z-50 flex w-full flex-col": true,
694
694
  fixed,
695
695
  absolute: !fixed,
696
696
  ...props.class
@@ -699,8 +699,8 @@ const Nav = qwik.component$(({ fixed, floating, noblur, nohamburger, colorClass
699
699
  !nohamburger && /* @__PURE__ */ jsxRuntime.jsx("div", {
700
700
  class: {
701
701
  "absolute top-full lum-card motion-safe:transition-all sm:hidden max-w-7xl gap-2 px-2 py-4": true,
702
- "w-[calc(100%-theme(spacing.8))] mx-4": floating,
703
- "w-[calc(100%-theme(spacing.4))] mx-2": !floating,
702
+ "w-[calc(100%-(--spacing(8)))] mx-4": floating,
703
+ "w-[calc(100%-(--spacing(4)))] mx-2": !floating,
704
704
  "mt-2": menu.value,
705
705
  "pointer-events-none opacity-0 -mt-2 scale-95": !menu.value,
706
706
  "backdrop-blur-lg": !noblur,
@@ -713,7 +713,7 @@ const Nav = qwik.component$(({ fixed, floating, noblur, nohamburger, colorClass
713
713
  /* @__PURE__ */ jsxRuntime.jsx("div", {
714
714
  class: {
715
715
  [colorClass]: !floating,
716
- "!border-x-0 !border-t-0": !floating,
716
+ "border-x-0! border-t-0!": !floating,
717
717
  "backdrop-blur-lg": !noblur && !floating,
718
718
  "relative mx-2 mt-2": floating
719
719
  },
@@ -745,7 +745,7 @@ const Nav = qwik.component$(({ fixed, floating, noblur, nohamburger, colorClass
745
745
  }),
746
746
  !nohamburger && /* @__PURE__ */ jsxRuntime.jsx("button", {
747
747
  name: "Navigation Menu",
748
- class: "lum-btn lum-bg-transparent p-2 sm:hidden",
748
+ class: "lum-btn lum-bg-transparent p-2 sm:hidden rounded-lum-2",
749
749
  onClick$: () => menu.value = !menu.value,
750
750
  children: /* @__PURE__ */ jsxRuntime.jsx(Menu, {
751
751
  size: 24
@@ -965,9 +965,9 @@ const SelectMenuRaw = qwik.component$(({ values, class: Class, panelClass = "lum
965
965
  }),
966
966
  /* @__PURE__ */ jsxRuntime.jsxs("div", {
967
967
  class: {
968
- "absolute z-[1000] mt-2 transition-all ease-out": true,
968
+ "absolute z-1000 mt-2": true,
969
969
  "backdrop-blur-lg": !noblur,
970
- "lum-scroll flex max-h-72 flex-col gap-1 overflow-auto rounded-lum border p-1 select-none motion-safe:transition-all": true,
970
+ "lum-scroll flex max-h-72 flex-col gap-1 overflow-auto rounded-lum border p-1 select-none motion-safe:transition-all ease-out": true,
971
971
  "left-0": align === "left",
972
972
  "right-0": align === "right",
973
973
  "left-1/2 -translate-x-1/2": align === "center",
@@ -1009,9 +1009,9 @@ const Sidebar = qwik.component$(({ position, ...props }) => {
1009
1009
  return /* @__PURE__ */ jsxRuntime.jsx("aside", {
1010
1010
  ...props,
1011
1011
  class: {
1012
- "hidden lg:flex sticky lum-card top-0 z-[40] px-6 pb-0 rounded-none pt-20 h-dvh": true,
1013
- "left-0 border-0 border-r-1": position === "left" || !position,
1014
- "right-0 border-0 border-l-1": position === "right",
1012
+ "hidden lg:flex sticky lum-card top-0 z-40 px-6 pb-0 rounded-none pt-20 h-dvh": true,
1013
+ "left-0 border-0 border-r": position === "left" || !position,
1014
+ "right-0 border-0 border-l": position === "right",
1015
1015
  ...props.class
1016
1016
  },
1017
1017
  children: /* @__PURE__ */ jsxRuntime.jsxs("nav", {
@@ -1051,8 +1051,8 @@ const Toggle = qwik.component$(({ checkbox, round, ...props }) => {
1051
1051
  }),
1052
1052
  /* @__PURE__ */ jsxRuntime.jsx("div", {
1053
1053
  class: {
1054
- "peer h-7 duration-300 ease-out hover:duration-75 motion-safe:transition": true,
1055
- "after:absolute after:top-[4px] after:left-[4px] after:h-5 after:w-5 after:border after:duration-300 after:ease-out after:content-[''] after:hover:duration-75 after:motion-safe:transition-all": true,
1054
+ "peer h-7 duration-300 ease-out hover:duration-75": true,
1055
+ "after:absolute after:top-1 after:left-1 after:h-5 after:w-5 after:border after:duration-300 after:ease-out after:content-[''] after:hover:duration-75 after:motion-safe:transition-transform": true,
1056
1056
  "rounded-lum after:rounded-lum-1": !round,
1057
1057
  "rounded-full after:rounded-full": round,
1058
1058
  "w-12 peer-checked:after:translate-x-full": !checkbox,
@@ -43,7 +43,7 @@ const Anchor = component$(({ id, ...props }) => /* @__PURE__ */ jsxs("div", {
43
43
  await navigator.clipboard.writeText(window.location.href);
44
44
  },
45
45
  children: /* @__PURE__ */ jsx(Link, {
46
- class: "opacity-10 transition-all duration-300 group-hover:opacity-100 group-hover:duration-75",
46
+ class: "opacity-10 transition-opacity duration-300 group-hover:opacity-100 group-hover:duration-75",
47
47
  size: 20
48
48
  })
49
49
  })
@@ -482,7 +482,7 @@ const ColorPicker = component$(({ id, value = "#000000", colors = [
482
482
  });
483
483
  return /* @__PURE__ */ jsxs("div", {
484
484
  class: {
485
- "lum-card touch-none p-4 motion-safe:transition-all": true,
485
+ "lum-card touch-none p-4": true,
486
486
  "flex-col": !horizontal,
487
487
  ...props.class
488
488
  },
@@ -506,7 +506,7 @@ const ColorPicker = component$(({ id, value = "#000000", colors = [
506
506
  "preventdefault:touchstart": true,
507
507
  children: [
508
508
  /* @__PURE__ */ jsx("div", {
509
- class: "h-[150px] w-[125px] rounded-md border border-gray-700 bg-gradient-to-b from-transparent to-black"
509
+ class: "h-[150px] w-[125px] rounded-md border border-gray-700 bg-linear-to-b from-transparent to-black"
510
510
  }),
511
511
  /* @__PURE__ */ jsx("div", {
512
512
  class: {
@@ -648,7 +648,7 @@ const Dropdown = component$(({ class: Class, hover, opened, ...props }) => {
648
648
  /* @__PURE__ */ jsx(ChevronDown, {
649
649
  size: 16,
650
650
  class: {
651
- "ease-out motion-safe:transition-all": true,
651
+ "ease-out motion-safe:transition-transform": true,
652
652
  "rotate-180 transform": opened,
653
653
  "duration-300 group-hover:rotate-180 group-hover:transform group-hover:duration-75": hover,
654
654
  "focus-within:rotate-180 focus-within:transform focus-within:duration-75": true
@@ -688,7 +688,7 @@ const Nav = component$(({ fixed, floating, noblur, nohamburger, colorClass = "lu
688
688
  return /* @__PURE__ */ jsxs("nav", {
689
689
  ...props,
690
690
  class: {
691
- "top-0 left-0 z-50 flex w-full flex-col duration-200 motion-safe:transition-all": true,
691
+ "top-0 left-0 z-50 flex w-full flex-col": true,
692
692
  fixed,
693
693
  absolute: !fixed,
694
694
  ...props.class
@@ -697,8 +697,8 @@ const Nav = component$(({ fixed, floating, noblur, nohamburger, colorClass = "lu
697
697
  !nohamburger && /* @__PURE__ */ jsx("div", {
698
698
  class: {
699
699
  "absolute top-full lum-card motion-safe:transition-all sm:hidden max-w-7xl gap-2 px-2 py-4": true,
700
- "w-[calc(100%-theme(spacing.8))] mx-4": floating,
701
- "w-[calc(100%-theme(spacing.4))] mx-2": !floating,
700
+ "w-[calc(100%-(--spacing(8)))] mx-4": floating,
701
+ "w-[calc(100%-(--spacing(4)))] mx-2": !floating,
702
702
  "mt-2": menu.value,
703
703
  "pointer-events-none opacity-0 -mt-2 scale-95": !menu.value,
704
704
  "backdrop-blur-lg": !noblur,
@@ -711,7 +711,7 @@ const Nav = component$(({ fixed, floating, noblur, nohamburger, colorClass = "lu
711
711
  /* @__PURE__ */ jsx("div", {
712
712
  class: {
713
713
  [colorClass]: !floating,
714
- "!border-x-0 !border-t-0": !floating,
714
+ "border-x-0! border-t-0!": !floating,
715
715
  "backdrop-blur-lg": !noblur && !floating,
716
716
  "relative mx-2 mt-2": floating
717
717
  },
@@ -743,7 +743,7 @@ const Nav = component$(({ fixed, floating, noblur, nohamburger, colorClass = "lu
743
743
  }),
744
744
  !nohamburger && /* @__PURE__ */ jsx("button", {
745
745
  name: "Navigation Menu",
746
- class: "lum-btn lum-bg-transparent p-2 sm:hidden",
746
+ class: "lum-btn lum-bg-transparent p-2 sm:hidden rounded-lum-2",
747
747
  onClick$: () => menu.value = !menu.value,
748
748
  children: /* @__PURE__ */ jsx(Menu, {
749
749
  size: 24
@@ -963,9 +963,9 @@ const SelectMenuRaw = component$(({ values, class: Class, panelClass = "lum-bg-l
963
963
  }),
964
964
  /* @__PURE__ */ jsxs("div", {
965
965
  class: {
966
- "absolute z-[1000] mt-2 transition-all ease-out": true,
966
+ "absolute z-1000 mt-2": true,
967
967
  "backdrop-blur-lg": !noblur,
968
- "lum-scroll flex max-h-72 flex-col gap-1 overflow-auto rounded-lum border p-1 select-none motion-safe:transition-all": true,
968
+ "lum-scroll flex max-h-72 flex-col gap-1 overflow-auto rounded-lum border p-1 select-none motion-safe:transition-all ease-out": true,
969
969
  "left-0": align === "left",
970
970
  "right-0": align === "right",
971
971
  "left-1/2 -translate-x-1/2": align === "center",
@@ -1007,9 +1007,9 @@ const Sidebar = component$(({ position, ...props }) => {
1007
1007
  return /* @__PURE__ */ jsx("aside", {
1008
1008
  ...props,
1009
1009
  class: {
1010
- "hidden lg:flex sticky lum-card top-0 z-[40] px-6 pb-0 rounded-none pt-20 h-dvh": true,
1011
- "left-0 border-0 border-r-1": position === "left" || !position,
1012
- "right-0 border-0 border-l-1": position === "right",
1010
+ "hidden lg:flex sticky lum-card top-0 z-40 px-6 pb-0 rounded-none pt-20 h-dvh": true,
1011
+ "left-0 border-0 border-r": position === "left" || !position,
1012
+ "right-0 border-0 border-l": position === "right",
1013
1013
  ...props.class
1014
1014
  },
1015
1015
  children: /* @__PURE__ */ jsxs("nav", {
@@ -1049,8 +1049,8 @@ const Toggle = component$(({ checkbox, round, ...props }) => {
1049
1049
  }),
1050
1050
  /* @__PURE__ */ jsx("div", {
1051
1051
  class: {
1052
- "peer h-7 duration-300 ease-out hover:duration-75 motion-safe:transition": true,
1053
- "after:absolute after:top-[4px] after:left-[4px] after:h-5 after:w-5 after:border after:duration-300 after:ease-out after:content-[''] after:hover:duration-75 after:motion-safe:transition-all": true,
1052
+ "peer h-7 duration-300 ease-out hover:duration-75": true,
1053
+ "after:absolute after:top-1 after:left-1 after:h-5 after:w-5 after:border after:duration-300 after:ease-out after:content-[''] after:hover:duration-75 after:motion-safe:transition-transform": true,
1054
1054
  "rounded-lum after:rounded-lum-1": !round,
1055
1055
  "rounded-full after:rounded-full": round,
1056
1056
  "w-12 peer-checked:after:translate-x-full": !checkbox,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@luminescent/ui-qwik",
3
- "version": "6.0.1",
3
+ "version": "6.1.1",
4
4
  "description": "Luminescent UI library - Qwik",
5
5
  "main": "./lib/index.qwik.mjs",
6
6
  "qwik": "./lib/index.qwik.mjs",
@@ -50,7 +50,7 @@
50
50
  "vite-tsconfig-paths": "^5.1.4"
51
51
  },
52
52
  "peerDependencies": {
53
- "@luminescent/ui": "6.0.1"
53
+ "@luminescent/ui": "6.1.1"
54
54
  },
55
55
  "scripts": {
56
56
  "build": "qwik build",