@luminescent/ui 0.12.1 → 0.12.3

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 +27 -13
  2. package/lib/index.qwik.mjs +27 -13
  3. package/lib-types/components/elements/Dropdown.d.ts +1 -0
  4. package/package.json +1 -1
package/lib/index.qwik.cjs CHANGED
@@ -867,7 +867,8 @@ const DropdownRaw = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlin
867
867
  "class",
868
868
  "display",
869
869
  "color",
870
- "size"
870
+ "size",
871
+ "hover"
871
872
  ]);
872
873
  const store = qwik.useStore({
873
874
  opened: false,
@@ -896,7 +897,12 @@ const DropdownRaw = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlin
896
897
  }
897
898
  `, "DropdownRaw_component_useStyles_UFDvrln9Bfk"));
898
899
  return /* @__PURE__ */ qwik._jsxQ("div", null, {
899
- class: "relative touch-manipulation"
900
+ class: qwik._fnSignal((p0) => ({
901
+ "relative touch-manipulation": true,
902
+ "group": p0.hover
903
+ }), [
904
+ props
905
+ ], '{"relative touch-manipulation":true,"group":p0.hover}')
900
906
  }, [
901
907
  props.values && /* @__PURE__ */ qwik._jsxS("select", {
902
908
  ...props1,
@@ -941,16 +947,19 @@ const DropdownRaw = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlin
941
947
  get class() {
942
948
  return {
943
949
  "motion-safe:transition-all duration-200": true,
944
- "transform rotate-180": store.opened
950
+ "transform rotate-180": store.opened,
951
+ "group-hover:transform group-hover:rotate-180": props.hover
945
952
  };
946
953
  },
947
954
  [qwik._IMMUTABLE]: {
948
- class: qwik._fnSignal((p0) => ({
955
+ class: qwik._fnSignal((p0, p1) => ({
949
956
  "motion-safe:transition-all duration-200": true,
950
- "transform rotate-180": p0.opened
957
+ "transform rotate-180": p1.opened,
958
+ "group-hover:transform group-hover:rotate-180": p0.hover
951
959
  }), [
960
+ props,
952
961
  store
953
- ], '{"motion-safe:transition-all duration-200":true,"transform rotate-180":p0.opened}'),
962
+ ], '{"motion-safe:transition-all duration-200":true,"transform rotate-180":p1.opened,"group-hover:transform group-hover:rotate-180":p0.hover}'),
954
963
  width: qwik._IMMUTABLE
955
964
  }
956
965
  }, 3, "Zz_5")
@@ -979,10 +988,14 @@ const DropdownRaw = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlin
979
988
  }, 1, "Zz_6"),
980
989
  /* @__PURE__ */ qwik._jsxQ("div", {
981
990
  class: {
982
- "motion-safe:transition-all absolute top-full left-0 p-1 mt-2 gap-1 bg-gray-800/50 backdrop-blur-xl flex flex-col rounded-lg border border-gray-700 z-[1000] max-h-72 lui-scroll overflow-auto select-none": true,
983
- "pointer-events-none opacity-0 scale-95": !store.opened
991
+ "absolute top-full pt-2 left-0 z-[1000] ": true,
992
+ "pointer-events-none opacity-0 scale-95": !store.opened,
993
+ "group-hover:pointer-events-auto group-hover:opacity-100 group-hover:scale-100": props.hover
984
994
  }
985
- }, {
995
+ }, null, /* @__PURE__ */ qwik._jsxQ("div", null, {
996
+ class: {
997
+ "motion-safe:transition-all p-1.5 gap-1 bg-gray-800/50 backdrop-blur-xl flex flex-col rounded-lg border border-gray-700 max-h-72 lui-scroll overflow-auto select-none": true
998
+ },
986
999
  id: qwik._fnSignal((p0) => `lui-${p0.id}-opts`, [
987
1000
  props
988
1001
  ], "`lui-${p0.id}-opts`")
@@ -1003,7 +1016,7 @@ const DropdownRaw = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlin
1003
1016
  select.dispatchEvent(new Event("change"));
1004
1017
  }
1005
1018
  store2.value = value2.toString();
1006
- }, "DropdownRaw_component_div_div_Button_onClick_FOKnkeI0cno", [
1019
+ }, "DropdownRaw_component_div_div_div_Button_onClick_hpDCLiNtewg", [
1007
1020
  props,
1008
1021
  store,
1009
1022
  value
@@ -1021,7 +1034,7 @@ const DropdownRaw = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlin
1021
1034
  name: qwik._IMMUTABLE
1022
1035
  }
1023
1036
  }, 3, "Zz_7")
1024
- ], 1, null)
1037
+ ], 1, null), 1, null)
1025
1038
  ], 1, "Zz_8");
1026
1039
  }, "DropdownRaw_component_Hj5Qd2ULo0U"));
1027
1040
  const LoadingIcon = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl((props) => {
@@ -1117,7 +1130,8 @@ const Nav = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl((p
1117
1130
  }
1118
1131
  }, null, /* @__PURE__ */ qwik._jsxQ("div", null, {
1119
1132
  class: {
1120
- "flex flex-col gap-2 motion-safe:transition-all max-w-7xl w-full p-2 bg-gray-800/50 border border-gray-700/50 backdrop-blur-lg drop-shadow-xl rounded-lg": true
1133
+ "flex flex-col gap-2 motion-safe:transition-all max-w-7xl w-full p-2 bg-gray-800/50 border border-gray-700/50 rounded-lg": true,
1134
+ 'before:absolute before:content-[""] before:w-full before:h-full before:backdrop-blur-lg before:drop-shadow-xl before:-z-10': true
1121
1135
  }
1122
1136
  }, /* @__PURE__ */ qwik._jsxC(qwik.Slot, {
1123
1137
  name: "mobile",
@@ -1135,7 +1149,7 @@ const Nav = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl((p
1135
1149
  class: {
1136
1150
  "flex justify-evenly w-full mx-auto px-2 max-w-7xl": true,
1137
1151
  "bg-gray-800/50 border border-gray-700/50 rounded-lg": props.floating,
1138
- 'before:absolute before:content-[""] before:w-full before:h-full before:backdrop-blur-lg before:drop-shadow-xl before:-z-10': props.floating
1152
+ 'before:absolute before:content-[""] before:w-full before:max-w-7xl before:h-full before:rounded-lg before:backdrop-blur-lg before:drop-shadow-xl before:-z-10': props.floating
1139
1153
  }
1140
1154
  }, null, [
1141
1155
  /* @__PURE__ */ qwik._jsxQ("div", null, {
package/lib/index.qwik.mjs CHANGED
@@ -865,7 +865,8 @@ const DropdownRaw = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pro
865
865
  "class",
866
866
  "display",
867
867
  "color",
868
- "size"
868
+ "size",
869
+ "hover"
869
870
  ]);
870
871
  const store = useStore({
871
872
  opened: false,
@@ -894,7 +895,12 @@ const DropdownRaw = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pro
894
895
  }
895
896
  `, "DropdownRaw_component_useStyles_UFDvrln9Bfk"));
896
897
  return /* @__PURE__ */ _jsxQ("div", null, {
897
- class: "relative touch-manipulation"
898
+ class: _fnSignal((p0) => ({
899
+ "relative touch-manipulation": true,
900
+ "group": p0.hover
901
+ }), [
902
+ props
903
+ ], '{"relative touch-manipulation":true,"group":p0.hover}')
898
904
  }, [
899
905
  props.values && /* @__PURE__ */ _jsxS("select", {
900
906
  ...props1,
@@ -939,16 +945,19 @@ const DropdownRaw = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pro
939
945
  get class() {
940
946
  return {
941
947
  "motion-safe:transition-all duration-200": true,
942
- "transform rotate-180": store.opened
948
+ "transform rotate-180": store.opened,
949
+ "group-hover:transform group-hover:rotate-180": props.hover
943
950
  };
944
951
  },
945
952
  [_IMMUTABLE]: {
946
- class: _fnSignal((p0) => ({
953
+ class: _fnSignal((p0, p1) => ({
947
954
  "motion-safe:transition-all duration-200": true,
948
- "transform rotate-180": p0.opened
955
+ "transform rotate-180": p1.opened,
956
+ "group-hover:transform group-hover:rotate-180": p0.hover
949
957
  }), [
958
+ props,
950
959
  store
951
- ], '{"motion-safe:transition-all duration-200":true,"transform rotate-180":p0.opened}'),
960
+ ], '{"motion-safe:transition-all duration-200":true,"transform rotate-180":p1.opened,"group-hover:transform group-hover:rotate-180":p0.hover}'),
952
961
  width: _IMMUTABLE
953
962
  }
954
963
  }, 3, "Zz_5")
@@ -977,10 +986,14 @@ const DropdownRaw = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pro
977
986
  }, 1, "Zz_6"),
978
987
  /* @__PURE__ */ _jsxQ("div", {
979
988
  class: {
980
- "motion-safe:transition-all absolute top-full left-0 p-1 mt-2 gap-1 bg-gray-800/50 backdrop-blur-xl flex flex-col rounded-lg border border-gray-700 z-[1000] max-h-72 lui-scroll overflow-auto select-none": true,
981
- "pointer-events-none opacity-0 scale-95": !store.opened
989
+ "absolute top-full pt-2 left-0 z-[1000] ": true,
990
+ "pointer-events-none opacity-0 scale-95": !store.opened,
991
+ "group-hover:pointer-events-auto group-hover:opacity-100 group-hover:scale-100": props.hover
982
992
  }
983
- }, {
993
+ }, null, /* @__PURE__ */ _jsxQ("div", null, {
994
+ class: {
995
+ "motion-safe:transition-all p-1.5 gap-1 bg-gray-800/50 backdrop-blur-xl flex flex-col rounded-lg border border-gray-700 max-h-72 lui-scroll overflow-auto select-none": true
996
+ },
984
997
  id: _fnSignal((p0) => `lui-${p0.id}-opts`, [
985
998
  props
986
999
  ], "`lui-${p0.id}-opts`")
@@ -1001,7 +1014,7 @@ const DropdownRaw = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pro
1001
1014
  select.dispatchEvent(new Event("change"));
1002
1015
  }
1003
1016
  store2.value = value2.toString();
1004
- }, "DropdownRaw_component_div_div_Button_onClick_FOKnkeI0cno", [
1017
+ }, "DropdownRaw_component_div_div_div_Button_onClick_hpDCLiNtewg", [
1005
1018
  props,
1006
1019
  store,
1007
1020
  value
@@ -1019,7 +1032,7 @@ const DropdownRaw = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pro
1019
1032
  name: _IMMUTABLE
1020
1033
  }
1021
1034
  }, 3, "Zz_7")
1022
- ], 1, null)
1035
+ ], 1, null), 1, null)
1023
1036
  ], 1, "Zz_8");
1024
1037
  }, "DropdownRaw_component_Hj5Qd2ULo0U"));
1025
1038
  const LoadingIcon = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
@@ -1115,7 +1128,8 @@ const Nav = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
1115
1128
  }
1116
1129
  }, null, /* @__PURE__ */ _jsxQ("div", null, {
1117
1130
  class: {
1118
- "flex flex-col gap-2 motion-safe:transition-all max-w-7xl w-full p-2 bg-gray-800/50 border border-gray-700/50 backdrop-blur-lg drop-shadow-xl rounded-lg": true
1131
+ "flex flex-col gap-2 motion-safe:transition-all max-w-7xl w-full p-2 bg-gray-800/50 border border-gray-700/50 rounded-lg": true,
1132
+ 'before:absolute before:content-[""] before:w-full before:h-full before:backdrop-blur-lg before:drop-shadow-xl before:-z-10': true
1119
1133
  }
1120
1134
  }, /* @__PURE__ */ _jsxC(Slot, {
1121
1135
  name: "mobile",
@@ -1133,7 +1147,7 @@ const Nav = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
1133
1147
  class: {
1134
1148
  "flex justify-evenly w-full mx-auto px-2 max-w-7xl": true,
1135
1149
  "bg-gray-800/50 border border-gray-700/50 rounded-lg": props.floating,
1136
- 'before:absolute before:content-[""] before:w-full before:h-full before:backdrop-blur-lg before:drop-shadow-xl before:-z-10': props.floating
1150
+ 'before:absolute before:content-[""] before:w-full before:max-w-7xl before:h-full before:rounded-lg before:backdrop-blur-lg before:drop-shadow-xl before:-z-10': props.floating
1137
1151
  }
1138
1152
  }, null, [
1139
1153
  /* @__PURE__ */ _jsxQ("div", null, {
package/lib-types/components/elements/Dropdown.d.ts CHANGED
@@ -7,6 +7,7 @@ interface DropdownProps extends Omit<PropsOf<'select'>, 'class' | 'size'> {
7
7
  display?: JSXChildren;
8
8
  color?: keyof typeof buttonColorClasses;
9
9
  size?: keyof typeof sizeClasses;
10
+ hover?: boolean;
10
11
  values?: {
11
12
  name: JSXChildren;
12
13
  value: string | number;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@luminescent/ui",
3
- "version": "0.12.1",
3
+ "version": "0.12.3",
4
4
  "description": "Luminescent UI library",
5
5
  "main": "./lib/index.qwik.mjs",
6
6
  "qwik": "./lib/index.qwik.mjs",