@teach-in/react 1.4.0 → 1.6.0

package/dist/ui/inputs/select/index.js

@@ -31,7 +31,8 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/ui/inputs/select/index.ts
 var select_exports = {};
 __export(select_exports, {
-  Select: () => Select
+  Select: () => Select,
+  SelectItem: () => SelectItem
 });
 module.exports = __toCommonJS(select_exports);
 
@@ -68,6 +69,13 @@ var ClearButton = import_react.default.forwardRef(
 );
 ClearButton.displayName = "TeachInUI.ClearButton";
 
+// src/ui/style/css.ts
+var import_clsx = require("clsx");
+var import_tailwind_merge = require("tailwind-merge");
+function cn(...inputs) {
+  return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
+}
+
 // src/ui/inputs/select/use-select.ts
 var import_react2 = require("react");
 function useSelect({
@@ -78,24 +86,17 @@ function useSelect({
   isClearable = true
 }) {
   const isMultiple = selectionMode === "multiple";
-  const [internalValue, setInternalValue] = (0, import_react2.useState)(
-    isMultiple ? [] : null
-  );
-  const isControlled = value !== void 0;
-  const currentValue = isControlled ? value : internalValue;
+  const currentValue = value != null ? value : isMultiple ? [] : null;
   const hasValue = currentValue != null && (Array.isArray(currentValue) ? currentValue.length > 0 : currentValue !== "");
   const handleChange = (0, import_react2.useCallback)(
     (newValue) => {
-      if (!isControlled) {
-        setInternalValue(newValue);
-      }
       if (isMultiple) {
         onChange == null ? void 0 : onChange(newValue);
       } else {
         onChange == null ? void 0 : onChange(newValue);
       }
     },
-    [isControlled, onChange, isMultiple]
+    [onChange, isMultiple]
   );
   const handleClear = (0, import_react2.useCallback)(() => {
     onClear == null ? void 0 : onClear();
@@ -140,9 +141,11 @@ var selectWrapperVariants = (0, import_tailwind_variants.tv)({
 var Select = import_react3.default.forwardRef(
   ({
     value,
-    defaultSelectedKeys,
     items,
+    children,
+    selectedKeys: selectedKeysProp,
     onChange,
+    onSelectionChange,
     selectionMode,
     onClear,
     variant,
@@ -151,6 +154,8 @@ var Select = import_react3.default.forwardRef(
     isClearable,
     ...props
   }, ref) => {
+    const usesExternalSelectionControl = selectedKeysProp !== void 0 || onSelectionChange !== void 0;
+    const selectChildren = children != null ? children : (item) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_select.SelectItem, { children: item.label }, item.key);
     const { selectedKeys, handleSelectionChange, handleClear, showClearButton } = useSelect({
       value,
       onChange,
@@ -164,27 +169,28 @@ var Select = import_react3.default.forwardRef(
         ref,
         classNames: {
           ...classNames,
-          trigger: selectWrapperVariants({ variant }),
+          trigger: cn(selectWrapperVariants({ variant }), classNames == null ? void 0 : classNames.trigger),
           innerWrapper: "group"
         },
-        defaultSelectedKeys,
         endContent: (endContent || showClearButton) && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex items-center gap-1", children: [
           endContent,
           showClearButton && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(ClearButton, { onClear: handleClear })
         ] }),
         items,
-        selectedKeys,
+        selectedKeys: usesExternalSelectionControl ? selectedKeysProp : selectedKeys,
         selectionMode,
         variant,
-        onSelectionChange: handleSelectionChange,
+        onSelectionChange: usesExternalSelectionControl ? onSelectionChange : handleSelectionChange,
         ...props,
-        children: (item) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_select.SelectItem, { children: item.label }, item.key)
+        children: selectChildren
       }
     );
   }
 );
 Select.displayName = "TeachInUI.Select";
+var SelectItem = import_select.SelectItem;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  Select
+  Select,
+  SelectItem
 });

package/dist/ui/inputs/select/index.mjs

@@ -1,10 +1,14 @@
 "use client";
 import "../../../chunk-AQ3ISJKU.mjs";
 import {
-  Select
-} from "../../../chunk-VXYV37IM.mjs";
-import "../../../chunk-2UHA3DYG.mjs";
+  Select,
+  SelectItem
+} from "../../../chunk-C5FQB2UN.mjs";
+import "../../../chunk-6BWSC6ZH.mjs";
 import "../../../chunk-TUIN5YJW.mjs";
+import "../../../chunk-Q6XJI7Q2.mjs";
+import "../../../chunk-LOMRTWX5.mjs";
 export {
-  Select
+  Select,
+  SelectItem
 };

package/dist/ui/inputs/select/select.d.ts

@@ -4,27 +4,16 @@ interface Item {
     key: string;
     label: string;
 }
-type BaseSelectProps = Omit<HeroUISelectProps<Item>, "selectedKeys" | "onSelectionChange" | "children" | "onChange">;
-export type SelectProps = (BaseSelectProps & {
-    selectionMode?: "single";
-    value?: string;
-    onChange?: (value: string | null) => void;
+type SelectChildren = NonNullable<HeroUISelectProps<Item>["children"]>;
+type BaseSelectProps = Omit<HeroUISelectProps<Item>, "children" | "defaultSelectedKeys" | "onChange">;
+export interface SelectProps extends Omit<BaseSelectProps, "selectionMode"> {
+    selectionMode?: "single" | "multiple";
+    value?: string | string[];
+    onChange?: ((value: string | null) => void) | ((value: string[]) => void);
     onClear?: () => void;
-}) | (BaseSelectProps & {
-    selectionMode: "multiple";
-    value?: string[];
-    onChange?: (value: string[]) => void;
-    onClear?: () => void;
-});
-export declare const Select: React.ForwardRefExoticComponent<(Omit<BaseSelectProps & {
-    selectionMode?: "single";
-    value?: string;
-    onChange?: (value: string | null) => void;
-    onClear?: () => void;
-}, "ref"> | Omit<BaseSelectProps & {
-    selectionMode: "multiple";
-    value?: string[];
-    onChange?: (value: string[]) => void;
-    onClear?: () => void;
-}, "ref">) & React.RefAttributes<HTMLSelectElement>>;
+    items?: Item[];
+    children?: SelectChildren;
+}
+export declare const Select: React.ForwardRefExoticComponent<Omit<SelectProps, "ref"> & React.RefAttributes<HTMLSelectElement>>;
+export declare const SelectItem: <T extends object>(props: Omit<import("@heroui/autocomplete").AutocompleteItemProps<T>, "value">) => JSX.Element;
 export {};

package/dist/ui/inputs/select/select.js

@@ -31,7 +31,8 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/ui/inputs/select/select.tsx
 var select_exports = {};
 __export(select_exports, {
-  Select: () => Select
+  Select: () => Select,
+  SelectItem: () => SelectItem
 });
 module.exports = __toCommonJS(select_exports);
 var import_react3 = __toESM(require("react"));
@@ -66,6 +67,13 @@ var ClearButton = import_react.default.forwardRef(
 );
 ClearButton.displayName = "TeachInUI.ClearButton";
 
+// src/ui/style/css.ts
+var import_clsx = require("clsx");
+var import_tailwind_merge = require("tailwind-merge");
+function cn(...inputs) {
+  return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
+}
+
 // src/ui/inputs/select/use-select.ts
 var import_react2 = require("react");
 function useSelect({
@@ -76,24 +84,17 @@ function useSelect({
   isClearable = true
 }) {
   const isMultiple = selectionMode === "multiple";
-  const [internalValue, setInternalValue] = (0, import_react2.useState)(
-    isMultiple ? [] : null
-  );
-  const isControlled = value !== void 0;
-  const currentValue = isControlled ? value : internalValue;
+  const currentValue = value != null ? value : isMultiple ? [] : null;
   const hasValue = currentValue != null && (Array.isArray(currentValue) ? currentValue.length > 0 : currentValue !== "");
   const handleChange = (0, import_react2.useCallback)(
     (newValue) => {
-      if (!isControlled) {
-        setInternalValue(newValue);
-      }
       if (isMultiple) {
         onChange == null ? void 0 : onChange(newValue);
       } else {
         onChange == null ? void 0 : onChange(newValue);
       }
     },
-    [isControlled, onChange, isMultiple]
+    [onChange, isMultiple]
   );
   const handleClear = (0, import_react2.useCallback)(() => {
     onClear == null ? void 0 : onClear();
@@ -138,9 +139,11 @@ var selectWrapperVariants = (0, import_tailwind_variants.tv)({
 var Select = import_react3.default.forwardRef(
   ({
     value,
-    defaultSelectedKeys,
     items,
+    children,
+    selectedKeys: selectedKeysProp,
     onChange,
+    onSelectionChange,
     selectionMode,
     onClear,
     variant,
@@ -149,6 +152,8 @@ var Select = import_react3.default.forwardRef(
     isClearable,
     ...props
   }, ref) => {
+    const usesExternalSelectionControl = selectedKeysProp !== void 0 || onSelectionChange !== void 0;
+    const selectChildren = children != null ? children : (item) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_select.SelectItem, { children: item.label }, item.key);
     const { selectedKeys, handleSelectionChange, handleClear, showClearButton } = useSelect({
       value,
       onChange,
@@ -162,27 +167,28 @@ var Select = import_react3.default.forwardRef(
         ref,
         classNames: {
           ...classNames,
-          trigger: selectWrapperVariants({ variant }),
+          trigger: cn(selectWrapperVariants({ variant }), classNames == null ? void 0 : classNames.trigger),
           innerWrapper: "group"
         },
-        defaultSelectedKeys,
         endContent: (endContent || showClearButton) && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex items-center gap-1", children: [
           endContent,
           showClearButton && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(ClearButton, { onClear: handleClear })
         ] }),
         items,
-        selectedKeys,
+        selectedKeys: usesExternalSelectionControl ? selectedKeysProp : selectedKeys,
         selectionMode,
         variant,
-        onSelectionChange: handleSelectionChange,
+        onSelectionChange: usesExternalSelectionControl ? onSelectionChange : handleSelectionChange,
         ...props,
-        children: (item) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_select.SelectItem, { children: item.label }, item.key)
+        children: selectChildren
       }
     );
   }
 );
 Select.displayName = "TeachInUI.Select";
+var SelectItem = import_select.SelectItem;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  Select
+  Select,
+  SelectItem
 });

package/dist/ui/inputs/select/select.mjs

@@ -1,9 +1,13 @@
 "use client";
 import {
-  Select
-} from "../../../chunk-VXYV37IM.mjs";
-import "../../../chunk-2UHA3DYG.mjs";
+  Select,
+  SelectItem
+} from "../../../chunk-C5FQB2UN.mjs";
+import "../../../chunk-6BWSC6ZH.mjs";
 import "../../../chunk-TUIN5YJW.mjs";
+import "../../../chunk-Q6XJI7Q2.mjs";
+import "../../../chunk-LOMRTWX5.mjs";
 export {
-  Select
+  Select,
+  SelectItem
 };

package/dist/ui/inputs/select/use-select.d.ts

@@ -1,6 +1,5 @@
 interface UseSelectProps {
     value?: string | string[];
-    defaultSelectedKeys?: "all" | Iterable<React.Key>;
     onChange?: ((value: string | null) => void) | ((value: string[]) => void);
     onClear?: () => void;
     selectionMode?: "single" | "multiple";

package/dist/ui/inputs/select/use-select.js

@@ -33,24 +33,17 @@ function useSelect({
   isClearable = true
 }) {
   const isMultiple = selectionMode === "multiple";
-  const [internalValue, setInternalValue] = (0, import_react.useState)(
-    isMultiple ? [] : null
-  );
-  const isControlled = value !== void 0;
-  const currentValue = isControlled ? value : internalValue;
+  const currentValue = value != null ? value : isMultiple ? [] : null;
   const hasValue = currentValue != null && (Array.isArray(currentValue) ? currentValue.length > 0 : currentValue !== "");
   const handleChange = (0, import_react.useCallback)(
     (newValue) => {
-      if (!isControlled) {
-        setInternalValue(newValue);
-      }
       if (isMultiple) {
         onChange == null ? void 0 : onChange(newValue);
       } else {
         onChange == null ? void 0 : onChange(newValue);
       }
     },
-    [isControlled, onChange, isMultiple]
+    [onChange, isMultiple]
   );
   const handleClear = (0, import_react.useCallback)(() => {
     onClear == null ? void 0 : onClear();

package/dist/ui/inputs/select/use-select.mjs

@@ -1,7 +1,7 @@
 "use client";
 import {
   useSelect
-} from "../../../chunk-2UHA3DYG.mjs";
+} from "../../../chunk-6BWSC6ZH.mjs";
 export {
   useSelect
 };

package/dist/ui/inputs/switch/favorite-switch.d.ts

@@ -1,6 +1,27 @@
+import type { VariantProps } from "tailwind-variants";
 import React from "react";
-export interface Props {
+declare const wrapperVariants: import("tailwind-variants").TVReturnType<{
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+}, undefined, "flex cursor-pointer items-center justify-center rounded-sm bg-transparent!", {
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+}, undefined, "flex cursor-pointer items-center justify-center rounded-sm bg-transparent!", unknown, unknown, undefined>>;
+export interface Props extends VariantProps<typeof wrapperVariants> {
     isSelected: boolean;
     onValueChange?: (isSelected: boolean) => void;
 }
-export declare function FavoriteSwitch({ isSelected, onValueChange }: Props): React.JSX.Element;
+export declare function FavoriteSwitch({ isSelected, onValueChange, size }: Props): React.JSX.Element;
+export {};

package/dist/ui/inputs/switch/favorite-switch.js

@@ -30,14 +30,35 @@ var import_lucide_react = require("lucide-react");
 var import_tailwind_variants = require("tailwind-variants");
 var import_jsx_runtime = require("react/jsx-runtime");
 var bookmarkVariants = (0, import_tailwind_variants.tv)({
-  base: "size-6 stroke-default-400 group-hover:fill-primary-100 group-hover:stroke-default-400",
+  base: "stroke-default-400 group-hover:fill-primary-100 group-hover:stroke-default-400",
   variants: {
+    size: {
+      sm: "size-6",
+      md: "size-8",
+      lg: "size-10"
+    },
     isSelected: {
       true: "stroke-primary fill-primary-100"
     }
+  },
+  defaultVariants: {
+    size: "md"
   }
 });
-function FavoriteSwitch({ isSelected, onValueChange }) {
+var wrapperVariants = (0, import_tailwind_variants.tv)({
+  base: "flex cursor-pointer items-center justify-center rounded-sm bg-transparent!",
+  variants: {
+    size: {
+      sm: "h-8 w-8",
+      md: "h-10 w-10",
+      lg: "h-12 w-12"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+function FavoriteSwitch({ isSelected, onValueChange, size }) {
   const { Component, slots, getBaseProps, getInputProps, getWrapperProps } = (0, import_switch.useSwitch)({
     isSelected,
     onValueChange
@@ -49,9 +70,18 @@ function FavoriteSwitch({ isSelected, onValueChange }) {
       {
         ...getWrapperProps(),
         className: slots.wrapper({
-          class: "flex h-8 w-8 cursor-pointer items-center justify-center rounded-sm !bg-transparent"
+          class: wrapperVariants({ size })
         }),
-        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Bookmark, { className: bookmarkVariants({ isSelected }) })
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_lucide_react.BookmarkIcon,
+          {
+            absoluteStrokeWidth: true,
+            className: bookmarkVariants({ isSelected, size }),
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: 1.5
+          }
+        )
       }
     )
   ] });

package/dist/ui/inputs/switch/favorite-switch.mjs

@@ -2,7 +2,7 @@
 "use client";
 import {
   FavoriteSwitch
-} from "../../../chunk-E5QSNLSR.mjs";
+} from "../../../chunk-GTE5VEBV.mjs";
 export {
   FavoriteSwitch
 };

package/dist/ui/inputs/switch/index.js

@@ -51,14 +51,35 @@ var import_lucide_react = require("lucide-react");
 var import_tailwind_variants = require("tailwind-variants");
 var import_jsx_runtime2 = require("react/jsx-runtime");
 var bookmarkVariants = (0, import_tailwind_variants.tv)({
-  base: "size-6 stroke-default-400 group-hover:fill-primary-100 group-hover:stroke-default-400",
+  base: "stroke-default-400 group-hover:fill-primary-100 group-hover:stroke-default-400",
   variants: {
+    size: {
+      sm: "size-6",
+      md: "size-8",
+      lg: "size-10"
+    },
     isSelected: {
       true: "stroke-primary fill-primary-100"
     }
+  },
+  defaultVariants: {
+    size: "md"
   }
 });
-function FavoriteSwitch({ isSelected, onValueChange }) {
+var wrapperVariants = (0, import_tailwind_variants.tv)({
+  base: "flex cursor-pointer items-center justify-center rounded-sm bg-transparent!",
+  variants: {
+    size: {
+      sm: "h-8 w-8",
+      md: "h-10 w-10",
+      lg: "h-12 w-12"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+function FavoriteSwitch({ isSelected, onValueChange, size }) {
   const { Component, slots, getBaseProps, getInputProps, getWrapperProps } = (0, import_switch2.useSwitch)({
     isSelected,
     onValueChange
@@ -70,9 +91,18 @@ function FavoriteSwitch({ isSelected, onValueChange }) {
       {
         ...getWrapperProps(),
         className: slots.wrapper({
-          class: "flex h-8 w-8 cursor-pointer items-center justify-center rounded-sm !bg-transparent"
+          class: wrapperVariants({ size })
         }),
-        children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_lucide_react.Bookmark, { className: bookmarkVariants({ isSelected }) })
+        children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          import_lucide_react.BookmarkIcon,
+          {
+            absoluteStrokeWidth: true,
+            className: bookmarkVariants({ isSelected, size }),
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: 1.5
+          }
+        )
       }
     )
   ] });

package/dist/ui/inputs/switch/index.mjs

@@ -2,7 +2,7 @@
 import "../../../chunk-LLP2PTPK.mjs";
 import {
   FavoriteSwitch
-} from "../../../chunk-E5QSNLSR.mjs";
+} from "../../../chunk-GTE5VEBV.mjs";
 import {
   Switch
 } from "../../../chunk-N3EAW6UO.mjs";