@teach-in/react 1.4.0 → 1.6.0

package/dist/ui/index.js

@@ -64,19 +64,19 @@ __export(ui_exports, {
   FavoriteSwitch: () => FavoriteSwitch,
   Flex: () => Flex,
   Form: () => Form,
-  FormatBoolean: () => Boolean,
+  FormatBoolean: () => Boolean2,
   FormatCurrency: () => Currency,
   FormatDate: () => DateFormat,
   FormatDatetime: () => Datetime,
   FormatDuration: () => Duration,
-  FormatNumber: () => Number2,
+  FormatNumber: () => Number3,
   FormatPercent: () => Percent,
   FormatPlural: () => Plural,
   FormatTime: () => Time,
   FormatUUID: () => Uuid,
   Grid: () => Grid,
   Header: () => Header2,
-  Image: () => Image,
+  Image: () => Image2,
   Input: () => Input,
   InputField: () => InputField,
   Link: () => Link,
@@ -88,6 +88,7 @@ __export(ui_exports, {
   NavbarMenu: () => NavbarMenu,
   NavbarMenuItem: () => NavbarMenuItem,
   NavbarMenuToggle: () => NavbarMenuToggle,
+  Number: () => Number2,
   PageContent: () => PageContent,
   PageLoading: () => PageLoading,
   Pagination: () => Pagination,
@@ -107,6 +108,7 @@ __export(ui_exports, {
   SectionTitle: () => SectionTitle,
   Select: () => Select,
   SelectField: () => SelectField,
+  SelectItem: () => SelectItem,
   Spinner: () => Spinner,
   Switch: () => Switch,
   SwitchField: () => SwitchField,
@@ -201,20 +203,69 @@ var getKeyValue = import_table.getKeyValue;
 // src/ui/data/user/user.tsx
 var import_react4 = __toESM(require("react"));
 var import_user = require("@heroui/user");
+var import_image = require("@heroui/image");
+var import_tailwind_variants = require("tailwind-variants");
+
+// 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/data/user/user.tsx
 var import_jsx_runtime4 = require("react/jsx-runtime");
-var User = import_react4.default.forwardRef((props, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_user.User, { ref, ...props });
+function getNameInitials(fullName) {
+  const normalizedFullName = fullName.trim();
+  const parts = normalizedFullName.split(" ").filter((part) => part.length > 0);
+  if (parts.length >= 2) {
+    return parts[0][0].toUpperCase() + parts[1][0].toUpperCase();
+  }
+  return normalizedFullName.slice(0, 2).toUpperCase();
+}
+var userVariants = (0, import_tailwind_variants.tv)({
+  base: "flex items-start gap-2 hyphens-auto",
+  variants: {
+    direction: {
+      row: "flex-row",
+      column: "flex-col items-center"
+    }
+  },
+  defaultVariants: {
+    direction: "row"
+  }
 });
+var User = import_react4.default.forwardRef(
+  ({ name, avatarProps, className, direction = "row", ...props }, ref) => {
+    var _a, _b;
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      import_user.User,
+      {
+        ref,
+        avatarProps: {
+          ...avatarProps,
+          className: cn("shrink-0", avatarProps == null ? void 0 : avatarProps.className),
+          name: (_a = avatarProps == null ? void 0 : avatarProps.name) != null ? _a : getNameInitials(name),
+          ImgComponent: import_image.Image,
+          showFallback: (_b = avatarProps == null ? void 0 : avatarProps.showFallback) != null ? _b : true
+        },
+        className: userVariants({ direction, className }),
+        name,
+        ...props
+      }
+    );
+  }
+);
 User.displayName = "TeachInUI.User";
 
 // src/ui/data/image/image.tsx
 var import_react5 = __toESM(require("react"));
-var import_image = require("@heroui/image");
+var import_image2 = require("@heroui/image");
 var import_jsx_runtime5 = require("react/jsx-runtime");
-var Image = import_react5.default.forwardRef(({ ...props }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_image.Image, { ref, ...props });
+var Image2 = import_react5.default.forwardRef(({ ...props }, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_image2.Image, { ref, ...props });
 });
-Image.displayName = "TeachInUI.Image";
+Image2.displayName = "TeachInUI.Image";
 
 // src/ui/feedback/alert/alert.tsx
 var import_react6 = __toESM(require("react"));
@@ -358,7 +409,7 @@ var import_react20 = __toESM(require("react"));
 // src/ui/inputs/input/input.tsx
 var import_react19 = __toESM(require("react"));
 var import_input = require("@heroui/input");
-var import_tailwind_variants = require("tailwind-variants");
+var import_tailwind_variants2 = require("tailwind-variants");
 
 // src/ui/inputs/clear-button.tsx
 var import_react17 = __toESM(require("react"));
@@ -444,7 +495,7 @@ function useInput({
 
 // src/ui/inputs/input/input.tsx
 var import_jsx_runtime18 = require("react/jsx-runtime");
-var inputWrapperVariants = (0, import_tailwind_variants.tv)({
+var inputWrapperVariants = (0, import_tailwind_variants2.tv)({
   variants: {
     variant: {
       flat: "",
@@ -503,21 +554,219 @@ Input.displayName = "TeachInUI.Input";
 
 // src/ui/inputs/email/email.tsx
 var import_jsx_runtime19 = require("react/jsx-runtime");
-var Email = import_react20.default.forwardRef(({ ...props }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Input, { ref, autoComplete: "email", type: "email", ...props });
-});
+var EMAIL_REGEX = /^(?!\.)(?!.*\.\.)[A-Za-zА-Яа-яЁё0-9._+%-]+(?<!\.)@(?:(?:[A-Za-zА-Яа-яЁё0-9](?:[A-Za-zА-Яа-яЁё0-9-]*[A-Za-zА-Яа-яЁё0-9])?)\.)+[A-Za-zА-Яа-яЁё]{2,}$/u;
+var DEFAULT_ERROR_MESSAGE = "\u041D\u0435\u0432\u0435\u0440\u043D\u044B\u0439 \u0444\u043E\u0440\u043C\u0430\u0442 email";
+var defaultValidateEmail = (value) => {
+  if (!value) {
+    return;
+  }
+  return EMAIL_REGEX.test(value) ? true : DEFAULT_ERROR_MESSAGE;
+};
+function getValidationMessage(result) {
+  if (typeof result === "string") {
+    return result;
+  }
+  if (Array.isArray(result)) {
+    return result.join(" ");
+  }
+  return;
+}
+var Email = import_react20.default.forwardRef(
+  ({
+    defaultValue,
+    errorMessage,
+    isInvalid,
+    onValueChange,
+    validate = defaultValidateEmail,
+    value,
+    ...props
+  }, ref) => {
+    const [internalValue, setInternalValue] = import_react20.default.useState(defaultValue != null ? defaultValue : "");
+    const isControlled = value !== void 0;
+    const currentValue = isControlled ? value : internalValue;
+    const handleValueChange = import_react20.default.useCallback(
+      (nextValue) => {
+        if (!isControlled) {
+          setInternalValue(nextValue);
+        }
+        onValueChange == null ? void 0 : onValueChange(nextValue);
+      },
+      [isControlled, onValueChange]
+    );
+    const validationMessage = getValidationMessage(validate(currentValue != null ? currentValue : ""));
+    const resolvedErrorMessage = errorMessage != null ? errorMessage : validationMessage;
+    const resolvedIsInvalid = isInvalid != null ? isInvalid : Boolean(validationMessage);
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+      Input,
+      {
+        ref,
+        autoComplete: "email",
+        errorMessage: resolvedErrorMessage,
+        isInvalid: resolvedIsInvalid,
+        type: "email",
+        validate,
+        value: currentValue,
+        onValueChange: handleValueChange,
+        ...props
+      }
+    );
+  }
+);
 Email.displayName = "TeachInUI.Email";
 
-// src/ui/inputs/search/search.tsx
+// src/ui/inputs/number/number.tsx
 var import_react22 = __toESM(require("react"));
+var import_number_input = require("@heroui/number-input");
+var import_tailwind_variants3 = require("tailwind-variants");
+
+// src/ui/inputs/number/use-number.ts
+var import_number = require("@internationalized/number");
+var import_react21 = require("react");
+function normalizeNumberValue(value) {
+  if (value == null || Number.isNaN(value)) {
+    return null;
+  }
+  return value;
+}
+function useNumber({
+  locale,
+  value,
+  onChange,
+  onValueChange,
+  onClear,
+  isReadOnly,
+  isClearable = true,
+  ref
+}) {
+  const inputRef = (0, import_react21.useRef)(null);
+  const currentValue = normalizeNumberValue(value);
+  const hasValue = currentValue !== null;
+  const currentLocale = locale != null ? locale : Intl.NumberFormat().resolvedOptions().locale;
+  const numberParser = (0, import_react21.useMemo)(() => new import_number.NumberParser(currentLocale), [currentLocale]);
+  const emitValueChange = (0, import_react21.useCallback)(
+    (newValue) => {
+      onValueChange == null ? void 0 : onValueChange(newValue);
+      onChange == null ? void 0 : onChange(newValue);
+    },
+    [onChange, onValueChange]
+  );
+  const handleValueChange = (0, import_react21.useCallback)(
+    (incomingValue) => {
+      let newValue = null;
+      if (incomingValue === null) {
+        newValue = null;
+      } else if (typeof incomingValue === "number") {
+        newValue = Number.isNaN(incomingValue) ? null : incomingValue;
+      } else {
+        const rawValue = incomingValue.target.value;
+        newValue = rawValue === "" ? null : numberParser.parse(rawValue);
+        newValue = Number.isNaN(newValue) ? null : newValue;
+      }
+      emitValueChange(newValue);
+    },
+    [emitValueChange, numberParser]
+  );
+  const handleClear = (0, import_react21.useCallback)(() => {
+    var _a;
+    onClear == null ? void 0 : onClear();
+    emitValueChange(null);
+    (_a = inputRef.current) == null ? void 0 : _a.focus();
+  }, [emitValueChange, onClear]);
+  const mergedRef = (0, import_react21.useCallback)(
+    (node) => {
+      inputRef.current = node;
+      if (typeof ref === "function") {
+        ref(node);
+      } else if (ref) {
+        ref.current = node;
+      }
+    },
+    [ref]
+  );
+  const showClearButton = hasValue && !isReadOnly && isClearable;
+  return {
+    inputRef,
+    currentValue,
+    hasValue,
+    handleValueChange,
+    handleClear,
+    mergedRef,
+    showClearButton
+  };
+}
+
+// src/ui/inputs/number/number.tsx
+var import_jsx_runtime20 = require("react/jsx-runtime");
+var inputWrapperVariants2 = (0, import_tailwind_variants3.tv)({
+  variants: {
+    variant: {
+      flat: "",
+      underlined: "",
+      bordered: "border-1",
+      faded: "border-1"
+    }
+  }
+});
+var Number2 = import_react22.default.forwardRef(
+  ({
+    locale,
+    value,
+    onChange,
+    onValueChange,
+    onClear,
+    variant,
+    classNames,
+    endContent,
+    isReadOnly,
+    isClearable,
+    ...props
+  }, ref) => {
+    const { currentValue, handleValueChange, handleClear, mergedRef, showClearButton } = useNumber({
+      locale,
+      value,
+      onChange,
+      onValueChange,
+      onClear,
+      isReadOnly,
+      isClearable,
+      ref
+    });
+    const normalizedValue = currentValue === null ? globalThis.Number.NaN : currentValue;
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+      import_number_input.NumberInput,
+      {
+        ref: mergedRef,
+        classNames: {
+          ...classNames,
+          inputWrapper: cn(inputWrapperVariants2({ variant }), classNames == null ? void 0 : classNames.inputWrapper),
+          innerWrapper: cn("group", classNames == null ? void 0 : classNames.innerWrapper)
+        },
+        endContent: (endContent || showClearButton) && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex items-center gap-1", children: [
+          endContent,
+          showClearButton && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ClearButton, { onClear: handleClear })
+        ] }),
+        inputMode: "decimal",
+        isReadOnly,
+        value: normalizedValue,
+        variant,
+        onChange: handleValueChange,
+        ...props
+      }
+    );
+  }
+);
+Number2.displayName = "TeachInUI.Number";
+
+// src/ui/inputs/search/search.tsx
+var import_react24 = __toESM(require("react"));
 var import_lucide_react2 = require("lucide-react");
 var import_button4 = require("@heroui/button");
-var import_tailwind_variants2 = require("tailwind-variants");
+var import_tailwind_variants4 = require("tailwind-variants");
 
 // src/ui/inputs/search/use-search.ts
-var import_react21 = require("react");
+var import_react23 = require("react");
 function useSearch({ value, onSearch, onCancel, onKeyDown }) {
-  const handleKeyDown = (0, import_react21.useCallback)(
+  const handleKeyDown = (0, import_react23.useCallback)(
     (event) => {
       if (event.key === "Enter") {
         event.preventDefault();
@@ -531,7 +780,7 @@ function useSearch({ value, onSearch, onCancel, onKeyDown }) {
     [onSearch, onCancel, onKeyDown]
   );
   const hasValue = value !== void 0 && String(value).length > 0;
-  const handleSearchClick = (0, import_react21.useCallback)(() => {
+  const handleSearchClick = (0, import_react23.useCallback)(() => {
     if (hasValue) {
       onSearch == null ? void 0 : onSearch(value);
     }
@@ -544,8 +793,8 @@ function useSearch({ value, onSearch, onCancel, onKeyDown }) {
 }
 
 // src/ui/inputs/search/search.tsx
-var import_jsx_runtime20 = require("react/jsx-runtime");
-var searchIconVariants = (0, import_tailwind_variants2.tv)({
+var import_jsx_runtime21 = require("react/jsx-runtime");
+var searchIconVariants = (0, import_tailwind_variants4.tv)({
   base: "size-5 shrink-0",
   variants: {
     variant: {
@@ -556,7 +805,7 @@ var searchIconVariants = (0, import_tailwind_variants2.tv)({
     }
   }
 });
-var Search = import_react22.default.forwardRef(
+var Search = import_react24.default.forwardRef(
   ({ variant = "bordered", radius = "full", value, onSearch, onCancel, onKeyDown, ...props }, ref) => {
     const { handleKeyDown, handleSearchClick, hasValue } = useSearch({
       value,
@@ -564,12 +813,12 @@ var Search = import_react22.default.forwardRef(
       onCancel,
       onKeyDown
     });
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
       Input,
       {
         ref,
         radius,
-        startContent: onSearch ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+        startContent: onSearch ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
           import_button4.Button,
           {
             isIconOnly: true,
@@ -579,9 +828,9 @@ var Search = import_react22.default.forwardRef(
             size: "sm",
             variant: "light",
             onPress: handleSearchClick,
-            children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react2.SearchIcon, { className: searchIconVariants({ variant }) })
+            children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react2.SearchIcon, { className: searchIconVariants({ variant }) })
           }
-        ) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react2.SearchIcon, { className: searchIconVariants({ variant }) }),
+        ) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react2.SearchIcon, { className: searchIconVariants({ variant }) }),
         value,
         variant,
         onKeyDown: handleKeyDown,
@@ -593,12 +842,12 @@ var Search = import_react22.default.forwardRef(
 Search.displayName = "TeachInUI.Search";
 
 // src/ui/inputs/select/select.tsx
-var import_react24 = __toESM(require("react"));
+var import_react26 = __toESM(require("react"));
 var import_select = require("@heroui/select");
-var import_tailwind_variants3 = require("tailwind-variants");
+var import_tailwind_variants5 = require("tailwind-variants");
 
 // src/ui/inputs/select/use-select.ts
-var import_react23 = require("react");
+var import_react25 = require("react");
 function useSelect({
   value,
   onChange,
@@ -607,34 +856,27 @@ function useSelect({
   isClearable = true
 }) {
   const isMultiple = selectionMode === "multiple";
-  const [internalValue, setInternalValue] = (0, import_react23.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_react23.useCallback)(
+  const handleChange = (0, import_react25.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_react23.useCallback)(() => {
+  const handleClear = (0, import_react25.useCallback)(() => {
     onClear == null ? void 0 : onClear();
     handleChange(isMultiple ? [] : null);
   }, [onClear, handleChange, isMultiple]);
-  const selectedKeys = (0, import_react23.useMemo)(() => {
+  const selectedKeys = (0, import_react25.useMemo)(() => {
     if (currentValue == null) return /* @__PURE__ */ new Set();
     return new Set(Array.isArray(currentValue) ? currentValue : [currentValue]);
   }, [currentValue]);
-  const handleSelectionChange = (0, import_react23.useCallback)(
+  const handleSelectionChange = (0, import_react25.useCallback)(
     (keys) => {
       var _a;
       if (keys === "all") return;
@@ -655,8 +897,8 @@ function useSelect({
 }
 
 // src/ui/inputs/select/select.tsx
-var import_jsx_runtime21 = require("react/jsx-runtime");
-var selectWrapperVariants = (0, import_tailwind_variants3.tv)({
+var import_jsx_runtime22 = require("react/jsx-runtime");
+var selectWrapperVariants = (0, import_tailwind_variants5.tv)({
   variants: {
     variant: {
       flat: "",
@@ -666,12 +908,14 @@ var selectWrapperVariants = (0, import_tailwind_variants3.tv)({
     }
   }
 });
-var Select = import_react24.default.forwardRef(
+var Select = import_react26.default.forwardRef(
   ({
     value,
-    defaultSelectedKeys,
     items,
+    children,
+    selectedKeys: selectedKeysProp,
     onChange,
+    onSelectionChange,
     selectionMode,
     onClear,
     variant,
@@ -680,6 +924,8 @@ var Select = import_react24.default.forwardRef(
     isClearable,
     ...props
   }, ref) => {
+    const usesExternalSelectionControl = selectedKeysProp !== void 0 || onSelectionChange !== void 0;
+    const selectChildren = children != null ? children : (item) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_select.SelectItem, { children: item.label }, item.key);
     const { selectedKeys, handleSelectionChange, handleClear, showClearButton } = useSelect({
       value,
       onChange,
@@ -687,70 +933,100 @@ var Select = import_react24.default.forwardRef(
       selectionMode,
       isClearable
     });
-    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
       import_select.Select,
       {
         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_runtime21.jsxs)("div", { className: "flex items-center gap-1", children: [
+        endContent: (endContent || showClearButton) && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex items-center gap-1", children: [
           endContent,
-          showClearButton && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ClearButton, { onClear: handleClear })
+          showClearButton && /* @__PURE__ */ (0, import_jsx_runtime22.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_runtime21.jsx)(import_select.SelectItem, { children: item.label }, item.key)
+        children: selectChildren
       }
     );
   }
 );
 Select.displayName = "TeachInUI.Select";
+var SelectItem = import_select.SelectItem;
 
 // src/ui/inputs/switch/switch.tsx
-var import_react25 = __toESM(require("react"));
+var import_react27 = __toESM(require("react"));
 var import_switch = require("@heroui/switch");
-var import_jsx_runtime22 = require("react/jsx-runtime");
-var Switch = import_react25.default.forwardRef(({ ...props }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_switch.Switch, { ref, ...props });
+var import_jsx_runtime23 = require("react/jsx-runtime");
+var Switch = import_react27.default.forwardRef(({ ...props }, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_switch.Switch, { ref, ...props });
 });
 Switch.displayName = "TeachInUI.Switch";
 
 // src/ui/inputs/switch/favorite-switch.tsx
 var import_switch2 = require("@heroui/switch");
 var import_lucide_react3 = require("lucide-react");
-var import_tailwind_variants4 = require("tailwind-variants");
-var import_jsx_runtime23 = require("react/jsx-runtime");
-var bookmarkVariants = (0, import_tailwind_variants4.tv)({
-  base: "size-6 stroke-default-400 group-hover:fill-primary-100 group-hover:stroke-default-400",
+var import_tailwind_variants6 = require("tailwind-variants");
+var import_jsx_runtime24 = require("react/jsx-runtime");
+var bookmarkVariants = (0, import_tailwind_variants6.tv)({
+  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_variants6.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
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(Component, { ...getBaseProps(), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "sr-only", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("input", { ...getInputProps() }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(Component, { ...getBaseProps(), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "sr-only", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("input", { ...getInputProps() }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
       "div",
       {
         ...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_runtime23.jsx)(import_lucide_react3.Bookmark, { className: bookmarkVariants({ isSelected }) })
+        children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+          import_lucide_react3.BookmarkIcon,
+          {
+            absoluteStrokeWidth: true,
+            className: bookmarkVariants({ isSelected, size }),
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: 1.5
+          }
+        )
       }
     )
   ] });
@@ -761,45 +1037,45 @@ var import_radio = require("@heroui/radio");
 var Radio = Object.assign(import_radio.Radio, { displayName: "TeachInUI.Radio" });
 
 // src/ui/inputs/radio/radio-group.tsx
-var import_react26 = __toESM(require("react"));
+var import_react28 = __toESM(require("react"));
 var import_radio2 = require("@heroui/radio");
-var import_jsx_runtime24 = require("react/jsx-runtime");
-var RadioGroup = import_react26.default.forwardRef(
+var import_jsx_runtime25 = require("react/jsx-runtime");
+var RadioGroup = import_react28.default.forwardRef(
   (props, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_radio2.RadioGroup, { ref, ...props });
+    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_radio2.RadioGroup, { ref, ...props });
   }
 );
 RadioGroup.displayName = "TeachInUI.RadioGroup";
 
 // src/ui/inputs/text/text.tsx
-var import_react27 = __toESM(require("react"));
-var import_jsx_runtime25 = require("react/jsx-runtime");
-var Text = import_react27.default.forwardRef(({ ...props }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Input, { ref, type: "text", ...props });
+var import_react29 = __toESM(require("react"));
+var import_jsx_runtime26 = require("react/jsx-runtime");
+var Text = import_react29.default.forwardRef(({ ...props }, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Input, { ref, type: "text", ...props });
 });
 Text.displayName = "TeachInUI.Text";
 
 // src/ui/inputs/textarea/textarea.tsx
 var import_input6 = require("@heroui/input");
-var import_react28 = __toESM(require("react"));
-var import_jsx_runtime26 = require("react/jsx-runtime");
-var Textarea = import_react28.default.forwardRef(
+var import_react30 = __toESM(require("react"));
+var import_jsx_runtime27 = require("react/jsx-runtime");
+var Textarea = import_react30.default.forwardRef(
   ({ minRows = 4, ...props }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_input6.Textarea, { ref, minRows, ...props });
+    return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_input6.Textarea, { ref, minRows, ...props });
   }
 );
 Textarea.displayName = "TeachInUI.Textarea";
 
 // src/ui/form/rhf/fields/input-field.tsx
-var import_jsx_runtime27 = require("react/jsx-runtime");
+var import_jsx_runtime28 = require("react/jsx-runtime");
 function InputField({ name, ...props }) {
   const { control } = (0, import_react_hook_form.useFormContext)();
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
     import_react_hook_form.Controller,
     {
       control,
       name,
-      render: ({ field: { ref, ...field }, fieldState: { error } }) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+      render: ({ field: { ref, ...field }, fieldState: { error } }) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
         Input,
         {
           ...props,
@@ -817,15 +1093,15 @@ InputField.displayName = "TeachInUI.InputField";
 
 // src/ui/form/rhf/fields/text-field.tsx
 var import_react_hook_form2 = require("react-hook-form");
-var import_jsx_runtime28 = require("react/jsx-runtime");
+var import_jsx_runtime29 = require("react/jsx-runtime");
 function TextField({ name, ...props }) {
   const { control } = (0, import_react_hook_form2.useFormContext)();
-  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
     import_react_hook_form2.Controller,
     {
       control,
       name,
-      render: ({ field: { ref, ...field }, fieldState: { error } }) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Text, { ...props, ...field, ref, errorMessage: error == null ? void 0 : error.message, isInvalid: !!error })
+      render: ({ field: { ref, ...field }, fieldState: { error } }) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Text, { ...props, ...field, ref, errorMessage: error == null ? void 0 : error.message, isInvalid: !!error })
     }
   );
 }
@@ -833,15 +1109,15 @@ TextField.displayName = "TeachInUI.TextField";
 
 // src/ui/form/rhf/fields/email-field.tsx
 var import_react_hook_form3 = require("react-hook-form");
-var import_jsx_runtime29 = require("react/jsx-runtime");
+var import_jsx_runtime30 = require("react/jsx-runtime");
 function EmailField({ name, ...props }) {
   const { control } = (0, import_react_hook_form3.useFormContext)();
-  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
     import_react_hook_form3.Controller,
     {
       control,
       name,
-      render: ({ field: { ref, ...field }, fieldState: { error } }) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Email, { ...props, ...field, ref, errorMessage: error == null ? void 0 : error.message, isInvalid: !!error })
+      render: ({ field: { ref, ...field }, fieldState: { error } }) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Email, { ...props, ...field, ref, errorMessage: error == null ? void 0 : error.message, isInvalid: !!error })
     }
   );
 }
@@ -849,15 +1125,15 @@ EmailField.displayName = "TeachInUI.EmailField";
 
 // src/ui/form/rhf/fields/search-field.tsx
 var import_react_hook_form4 = require("react-hook-form");
-var import_jsx_runtime30 = require("react/jsx-runtime");
+var import_jsx_runtime31 = require("react/jsx-runtime");
 function SearchField({ name, ...props }) {
   const { control } = (0, import_react_hook_form4.useFormContext)();
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
     import_react_hook_form4.Controller,
     {
       control,
       name,
-      render: ({ field: { ref, ...field }, fieldState: { error } }) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+      render: ({ field: { ref, ...field }, fieldState: { error } }) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
         Search,
         {
           ...props,
@@ -875,15 +1151,15 @@ SearchField.displayName = "TeachInUI.SearchField";
 
 // src/ui/form/rhf/fields/textarea-field.tsx
 var import_react_hook_form5 = require("react-hook-form");
-var import_jsx_runtime31 = require("react/jsx-runtime");
+var import_jsx_runtime32 = require("react/jsx-runtime");
 function TextareaField({ name, ...props }) {
   const { control } = (0, import_react_hook_form5.useFormContext)();
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
     import_react_hook_form5.Controller,
     {
       control,
       name,
-      render: ({ field: { ref, ...field }, fieldState: { error } }) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+      render: ({ field: { ref, ...field }, fieldState: { error } }) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
         Textarea,
         {
           ...props,
@@ -900,15 +1176,15 @@ TextareaField.displayName = "TeachInUI.TextareaField";
 
 // src/ui/form/rhf/fields/select-field.tsx
 var import_react_hook_form6 = require("react-hook-form");
-var import_jsx_runtime32 = require("react/jsx-runtime");
+var import_jsx_runtime33 = require("react/jsx-runtime");
 function SelectField({ name, selectionMode, ...props }) {
   const { control } = (0, import_react_hook_form6.useFormContext)();
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
     import_react_hook_form6.Controller,
     {
       control,
       name,
-      render: ({ field, fieldState: { error } }) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+      render: ({ field, fieldState: { error } }) => /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
         Select,
         {
           selectionMode,
@@ -926,15 +1202,15 @@ SelectField.displayName = "TeachInUI.SelectField";
 
 // src/ui/form/rhf/fields/autocomplete-field.tsx
 var import_react_hook_form7 = require("react-hook-form");
-var import_jsx_runtime33 = require("react/jsx-runtime");
+var import_jsx_runtime34 = require("react/jsx-runtime");
 function AutocompleteField({ name, ...props }) {
   const { control } = (0, import_react_hook_form7.useFormContext)();
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
     import_react_hook_form7.Controller,
     {
       control,
       name,
-      render: ({ field, fieldState: { error } }) => /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+      render: ({ field, fieldState: { error } }) => /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
         Autocomplete,
         {
           ...props,
@@ -951,15 +1227,15 @@ AutocompleteField.displayName = "TeachInUI.AutocompleteField";
 
 // src/ui/form/rhf/fields/date-picker-field.tsx
 var import_react_hook_form8 = require("react-hook-form");
-var import_jsx_runtime34 = require("react/jsx-runtime");
+var import_jsx_runtime35 = require("react/jsx-runtime");
 function DatePickerField({ name, ...props }) {
   const { control } = (0, import_react_hook_form8.useFormContext)();
-  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
     import_react_hook_form8.Controller,
     {
       control,
       name,
-      render: ({ field: { ref, ...field }, fieldState: { error } }) => /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+      render: ({ field: { ref, ...field }, fieldState: { error } }) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
         DatePicker,
         {
           ...props,
@@ -976,17 +1252,17 @@ DatePickerField.displayName = "TeachInUI.DatePickerField";
 
 // src/ui/form/rhf/fields/checkbox-field.tsx
 var import_react_hook_form9 = require("react-hook-form");
-var import_jsx_runtime35 = require("react/jsx-runtime");
+var import_jsx_runtime36 = require("react/jsx-runtime");
 function CheckboxField({ name, ...props }) {
   const { control } = (0, import_react_hook_form9.useFormContext)();
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
     import_react_hook_form9.Controller,
     {
       control,
       name,
-      render: ({ field, fieldState: { error } }) => /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(Checkbox, { ...props, isSelected: field.value, onValueChange: field.onChange }),
-        error && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: "text-tiny text-danger", children: error.message })
+      render: ({ field, fieldState: { error } }) => /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Checkbox, { ...props, isSelected: field.value, onValueChange: field.onChange }),
+        error && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "text-tiny text-danger", children: error.message })
       ] })
     }
   );
@@ -995,17 +1271,17 @@ CheckboxField.displayName = "TeachInUI.CheckboxField";
 
 // src/ui/form/rhf/fields/switch-field.tsx
 var import_react_hook_form10 = require("react-hook-form");
-var import_jsx_runtime36 = require("react/jsx-runtime");
+var import_jsx_runtime37 = require("react/jsx-runtime");
 function SwitchField({ name, ...props }) {
   const { control } = (0, import_react_hook_form10.useFormContext)();
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
     import_react_hook_form10.Controller,
     {
       control,
       name,
-      render: ({ field, fieldState: { error } }) => /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Switch, { ...props, isSelected: field.value, onValueChange: field.onChange }),
-        error && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "text-tiny text-danger", children: error.message })
+      render: ({ field, fieldState: { error } }) => /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Switch, { ...props, isSelected: field.value, onValueChange: field.onChange }),
+        error && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "text-tiny text-danger", children: error.message })
       ] })
     }
   );
@@ -1014,15 +1290,15 @@ SwitchField.displayName = "TeachInUI.SwitchField";
 
 // src/ui/form/rhf/fields/radio-field.tsx
 var import_react_hook_form11 = require("react-hook-form");
-var import_jsx_runtime37 = require("react/jsx-runtime");
+var import_jsx_runtime38 = require("react/jsx-runtime");
 function RadioField({ name, ...props }) {
   const { control } = (0, import_react_hook_form11.useFormContext)();
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
     import_react_hook_form11.Controller,
     {
       control,
       name,
-      render: ({ field: { ref, value, onChange, ...field }, fieldState: { error } }) => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+      render: ({ field: { ref, value, onChange, ...field }, fieldState: { error } }) => /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
         RadioGroup,
         {
           ...props,
@@ -1041,15 +1317,15 @@ RadioField.displayName = "TeachInUI.RadioField";
 
 // src/ui/form/form.tsx
 var import_form = require("@heroui/form");
-var import_react29 = __toESM(require("react"));
-var import_jsx_runtime38 = require("react/jsx-runtime");
-var Form = import_react29.default.forwardRef(({ ...props }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_form.Form, { ref, ...props });
+var import_react31 = __toESM(require("react"));
+var import_jsx_runtime39 = require("react/jsx-runtime");
+var Form = import_react31.default.forwardRef(({ ...props }, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_form.Form, { ref, ...props });
 });
 Form.displayName = "TeachInUI.Form";
 
 // src/ui/format/datetime.tsx
-var import_jsx_runtime39 = require("react/jsx-runtime");
+var import_jsx_runtime40 = require("react/jsx-runtime");
 var defaultFormat = {
   day: "numeric",
   month: "long",
@@ -1065,15 +1341,15 @@ function Datetime({
   fallback = "\u2014"
 }) {
   const formatter = new Intl.DateTimeFormat(locale, format);
-  if (!value) return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_jsx_runtime39.Fragment, { children: fallback });
+  if (!value) return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_jsx_runtime40.Fragment, { children: fallback });
   const date = value instanceof Date ? value : new Date(value);
-  if (isNaN(date.getTime())) return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_jsx_runtime39.Fragment, { children: fallback });
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_jsx_runtime39.Fragment, { children: formatter.format(date) });
+  if (isNaN(date.getTime())) return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_jsx_runtime40.Fragment, { children: fallback });
+  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_jsx_runtime40.Fragment, { children: formatter.format(date) });
 }
 Datetime.displayName = "TeachInUI.FormatDatetime";
 
 // src/ui/format/date.tsx
-var import_jsx_runtime40 = require("react/jsx-runtime");
+var import_jsx_runtime41 = require("react/jsx-runtime");
 var defaultFormat2 = {
   day: "numeric",
   month: "long",
@@ -1086,15 +1362,15 @@ function DateFormat({
   fallback = "\u2014"
 }) {
   const formatter = new Intl.DateTimeFormat(locale, format);
-  if (!value) return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_jsx_runtime40.Fragment, { children: fallback });
+  if (!value) return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_jsx_runtime41.Fragment, { children: fallback });
   const date = value instanceof Date ? value : new Date(value);
-  if (isNaN(date.getTime())) return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_jsx_runtime40.Fragment, { children: fallback });
-  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_jsx_runtime40.Fragment, { children: formatter.format(date) });
+  if (isNaN(date.getTime())) return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_jsx_runtime41.Fragment, { children: fallback });
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_jsx_runtime41.Fragment, { children: formatter.format(date) });
 }
 DateFormat.displayName = "TeachInUI.FormatDate";
 
 // src/ui/format/time.tsx
-var import_jsx_runtime41 = require("react/jsx-runtime");
+var import_jsx_runtime42 = require("react/jsx-runtime");
 var defaultFormat3 = {
   hour: "2-digit",
   minute: "2-digit"
@@ -1106,15 +1382,15 @@ function Time({
   fallback = "\u2014"
 }) {
   const formatter = new Intl.DateTimeFormat(locale, format);
-  if (!value) return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_jsx_runtime41.Fragment, { children: fallback });
+  if (!value) return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_jsx_runtime42.Fragment, { children: fallback });
   const date = value instanceof Date ? value : new Date(value);
-  if (isNaN(date.getTime())) return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_jsx_runtime41.Fragment, { children: fallback });
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_jsx_runtime41.Fragment, { children: formatter.format(date) });
+  if (isNaN(date.getTime())) return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_jsx_runtime42.Fragment, { children: fallback });
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_jsx_runtime42.Fragment, { children: formatter.format(date) });
 }
 Time.displayName = "TeachInUI.FormatTime";
 
 // src/ui/format/currency.tsx
-var import_jsx_runtime42 = require("react/jsx-runtime");
+var import_jsx_runtime43 = require("react/jsx-runtime");
 function Currency({
   amount,
   currency = "RUB",
@@ -1129,23 +1405,23 @@ function Currency({
       maximumFractionDigits: decimals
     }
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_jsx_runtime42.Fragment, { children: formatter.format(amount) });
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_jsx_runtime43.Fragment, { children: formatter.format(amount) });
 }
 Currency.displayName = "TeachInUI.FormatCurrency";
 
 // src/ui/format/number.tsx
-var import_jsx_runtime43 = require("react/jsx-runtime");
-function Number2({ value, decimals, locale = "ru-RU" }) {
+var import_jsx_runtime44 = require("react/jsx-runtime");
+function Number3({ value, decimals, locale = "ru-RU" }) {
   const formatter = new Intl.NumberFormat(locale, {
     minimumFractionDigits: decimals != null ? decimals : 0,
     maximumFractionDigits: decimals != null ? decimals : 2
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_jsx_runtime43.Fragment, { children: formatter.format(value) });
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_jsx_runtime44.Fragment, { children: formatter.format(value) });
 }
-Number2.displayName = "TeachInUI.FormatNumber";
+Number3.displayName = "TeachInUI.FormatNumber";
 
 // src/ui/format/percent.tsx
-var import_jsx_runtime44 = require("react/jsx-runtime");
+var import_jsx_runtime45 = require("react/jsx-runtime");
 function Percent({
   value,
   decimals = 1,
@@ -1158,12 +1434,12 @@ function Percent({
     maximumFractionDigits: decimals
   });
   const normalizedValue = unit === "percent" ? value / 100 : value;
-  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_jsx_runtime44.Fragment, { children: formatter.format(normalizedValue) });
+  return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_jsx_runtime45.Fragment, { children: formatter.format(normalizedValue) });
 }
 Percent.displayName = "TeachInUI.FormatPercent";
 
 // src/ui/format/plural.tsx
-var import_jsx_runtime45 = require("react/jsx-runtime");
+var import_jsx_runtime46 = require("react/jsx-runtime");
 function Plural({
   count,
   one,
@@ -1184,12 +1460,12 @@ function Plural({
   };
   const selectedForm = forms[rule];
   const result = showCount ? `${count} ${selectedForm}` : selectedForm;
-  return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_jsx_runtime45.Fragment, { children: result });
+  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_jsx_runtime46.Fragment, { children: result });
 }
 Plural.displayName = "TeachInUI.FormatPlural";
 
 // src/ui/format/duration.tsx
-var import_jsx_runtime46 = require("react/jsx-runtime");
+var import_jsx_runtime47 = require("react/jsx-runtime");
 function Duration({
   minutes = 0,
   hours = 0,
@@ -1211,25 +1487,25 @@ function Duration({
   if (remainingMinutes > 0 || totalDays === 0 && totalHours === 0) {
     parts.push(compact ? `${remainingMinutes}\u043C` : `${remainingMinutes} \u043C\u0438\u043D`);
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_jsx_runtime46.Fragment, { children: parts.join(" ") });
+  return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_jsx_runtime47.Fragment, { children: parts.join(" ") });
 }
 Duration.displayName = "TeachInUI.FormatDuration";
 
 // src/ui/format/boolean.tsx
-var import_jsx_runtime47 = require("react/jsx-runtime");
-function Boolean({
+var import_jsx_runtime48 = require("react/jsx-runtime");
+function Boolean2({
   value,
   trueLabel = "\u0414\u0430",
   falseLabel = "\u041D\u0435\u0442",
   nullLabel = "\u2014"
 }) {
-  if (value === null || value === void 0) return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_jsx_runtime47.Fragment, { children: nullLabel });
-  return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_jsx_runtime47.Fragment, { children: value ? trueLabel : falseLabel });
+  if (value === null || value === void 0) return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_jsx_runtime48.Fragment, { children: nullLabel });
+  return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_jsx_runtime48.Fragment, { children: value ? trueLabel : falseLabel });
 }
-Boolean.displayName = "TeachInUI.FormatBoolean";
+Boolean2.displayName = "TeachInUI.FormatBoolean";
 
 // src/ui/format/uuid.tsx
-var import_jsx_runtime48 = require("react/jsx-runtime");
+var import_jsx_runtime49 = require("react/jsx-runtime");
 var uuidHyphenatedRegex = /^[0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[1-8][0-9a-fA-F]{3}-[89abAB][0-9a-fA-F]{3}-[0-9a-fA-F]{12}$/;
 function normalizeUuid(value) {
   const trimmed = value.trim();
@@ -1252,24 +1528,24 @@ function Uuid({
   showVersion = false,
   invalidFallback = "\u2014"
 }) {
-  if (!value) return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_jsx_runtime48.Fragment, { children: invalidFallback });
+  if (!value) return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_jsx_runtime49.Fragment, { children: invalidFallback });
   const normalized = normalizeUuid(value);
-  if (!normalized) return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_jsx_runtime48.Fragment, { children: invalidFallback });
+  if (!normalized) return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_jsx_runtime49.Fragment, { children: invalidFallback });
   const formatted = letterCase === "upper" ? normalized.toUpperCase() : normalized;
-  if (!showVersion) return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_jsx_runtime48.Fragment, { children: formatted });
+  if (!showVersion) return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_jsx_runtime49.Fragment, { children: formatted });
   const version = detectUuidVersion(normalized);
-  return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_jsx_runtime48.Fragment, { children: version !== null ? `${formatted} (v${version})` : formatted });
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_jsx_runtime49.Fragment, { children: version !== null ? `${formatted} (v${version})` : formatted });
 }
 Uuid.displayName = "TeachInUI.FormatUUID";
 
 // src/ui/surface/bento/bento.tsx
-var import_tailwind_variants5 = require("tailwind-variants");
-var import_jsx_runtime49 = require("react/jsx-runtime");
-var bento = (0, import_tailwind_variants5.tv)({
-  base: "rounded-xl p-6 transition-colors",
+var import_tailwind_variants7 = require("tailwind-variants");
+var import_jsx_runtime50 = require("react/jsx-runtime");
+var bento = (0, import_tailwind_variants7.tv)({
+  base: "p-8 transition-colors",
   variants: {
     color: {
-      default: "bg-default-50 text-default-700",
+      default: "bg-content1 text-foreground",
       primary: "bg-primary-50 text-primary-700",
       secondary: "bg-secondary-50 text-secondary-700",
       success: "bg-success-50 text-success-700",
@@ -1278,9 +1554,9 @@ var bento = (0, import_tailwind_variants5.tv)({
     },
     radius: {
       none: "rounded-none",
-      sm: "rounded-md",
-      md: "rounded-lg",
-      lg: "rounded-xl",
+      sm: "rounded-lg",
+      md: "rounded-2xl",
+      lg: "rounded-3xl",
       full: "rounded-full"
     },
     shadow: {
@@ -1302,28 +1578,40 @@ var bento = (0, import_tailwind_variants5.tv)({
   }
 });
 var Bento = ({ className, ...props }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: bento({ ...props, className }), ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: bento({ ...props, className }), ...props });
 };
 Bento.displayName = "TeachInUI.Bento";
 
 // src/ui/surface/card/card.tsx
-var import_react30 = __toESM(require("react"));
+var import_react32 = __toESM(require("react"));
 var import_card = require("@heroui/card");
-var import_jsx_runtime50 = require("react/jsx-runtime");
-var Root = import_react30.default.forwardRef(({ children, ...props }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_card.Card, { ref, ...props, children });
+var import_jsx_runtime51 = require("react/jsx-runtime");
+var CardBase = extendVariants2(import_card.Card, {
+  variants: {
+    radius: {
+      sm: { base: "rounded-lg" },
+      md: { base: "rounded-2xl" },
+      lg: { base: "rounded-3xl" }
+    }
+  },
+  defaultVariants: {
+    shadow: "none"
+  }
+});
+var Root = import_react32.default.forwardRef(({ children, className, ...props }, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(CardBase, { ref, className: cn("bg-default-100", className), ...props, children });
 });
 Root.displayName = "TeachInUI.Card.Root";
-var Header = import_react30.default.forwardRef(({ children, ...props }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_card.CardHeader, { ref, ...props, children });
+var Header = import_react32.default.forwardRef(({ children, ...props }, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_card.CardHeader, { ref, ...props, children });
 });
 Header.displayName = "TeachInUI.Card.Header";
-var Body = import_react30.default.forwardRef(({ children, ...props }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_card.CardBody, { ref, ...props, children });
+var Body = import_react32.default.forwardRef(({ children, ...props }, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_card.CardBody, { ref, ...props, children });
 });
 Body.displayName = "TeachInUI.Card.Body";
-var Footer = import_react30.default.forwardRef(({ children, ...props }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_card.CardFooter, { ref, ...props, children });
+var Footer = import_react32.default.forwardRef(({ children, ...props }, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_card.CardFooter, { ref, ...props, children });
 });
 Footer.displayName = "TeachInUI.Card.Footer";
 var Card = {
@@ -1335,9 +1623,9 @@ var Card = {
 
 // src/ui/layout/container/container.tsx
 var import_react_slot = require("@radix-ui/react-slot");
-var import_tailwind_variants6 = require("tailwind-variants");
-var import_jsx_runtime51 = require("react/jsx-runtime");
-var variants = (0, import_tailwind_variants6.tv)({
+var import_tailwind_variants8 = require("tailwind-variants");
+var import_jsx_runtime52 = require("react/jsx-runtime");
+var variants = (0, import_tailwind_variants8.tv)({
   base: "w-full mx-auto px-6",
   variants: {
     size: {
@@ -1356,58 +1644,58 @@ var variants = (0, import_tailwind_variants6.tv)({
 });
 var Container = ({ children, asChild = false, className, size, ...props }) => {
   const Comp = asChild ? import_react_slot.Slot : "div";
-  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(Comp, { className: cn(variants({ size }), className), ...props, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(Comp, { className: cn(variants({ size }), className), ...props, children });
 };
 Container.displayName = "TeachInUI.Container";
 
 // src/ui/layout/page/breadcrumbs.tsx
 var import_breadcrumbs = require("@heroui/breadcrumbs");
-var import_jsx_runtime52 = require("react/jsx-runtime");
-var Breadcrumbs = ({ items }) => /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_breadcrumbs.Breadcrumbs, { children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_breadcrumbs.BreadcrumbItem, { href: item.href, isDisabled: item.href === void 0, children: item.label }, item.label)) });
+var import_jsx_runtime53 = require("react/jsx-runtime");
+var Breadcrumbs = ({ items }) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_breadcrumbs.Breadcrumbs, { children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_breadcrumbs.BreadcrumbItem, { href: item.href, isDisabled: item.href === void 0, children: item.label }, item.label)) });
 
 // src/ui/layout/page/page-content.tsx
-var import_jsx_runtime53 = require("react/jsx-runtime");
+var import_jsx_runtime54 = require("react/jsx-runtime");
 var Root2 = ({
   children,
   breadcrumbs = []
-}) => /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "flex flex-col gap-6", children: [
-  breadcrumbs.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Breadcrumbs, { items: breadcrumbs }),
+}) => /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "flex flex-col gap-6", children: [
+  breadcrumbs.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(Breadcrumbs, { items: breadcrumbs }),
   children
 ] });
 Root2.displayName = "TeachInUI.PageContent.Root";
-var Header2 = ({ children, ...others }) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("header", { className: "flex items-center justify-between gap-4", role: "banner", ...others, children });
+var Header2 = ({ children, ...others }) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("header", { className: "flex items-center justify-between gap-4", role: "banner", ...others, children });
 Header2.displayName = "TeachInUI.PageContent.Header";
 var Title = ({
   children,
   ...others
-}) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("h1", { className: "text-4xl leading-10 font-bold", ...others, children });
+}) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("h1", { className: "text-4xl leading-10 font-bold", ...others, children });
 Title.displayName = "TeachInUI.PageContent.Title";
 var Actions = ({
   children,
   ...others
-}) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "flex gap-2", role: "group", ...others, children });
+}) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "flex gap-2", role: "group", ...others, children });
 Actions.displayName = "TeachInUI.PageContent.Actions";
-var Body2 = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "flex flex-col gap-6", children });
+var Body2 = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "flex flex-col gap-6", children });
 Body2.displayName = "TeachInUI.PageContent.Body";
 var Section = ({
   children,
   ...others
-}) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("section", { className: "flex flex-col gap-4", ...others, children });
+}) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("section", { className: "flex flex-col gap-4", ...others, children });
 Section.displayName = "TeachInUI.PageContent.Section";
 var SectionHeader = ({
   children,
   ...others
-}) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "flex items-center justify-between", ...others, children });
+}) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "flex items-center justify-between", ...others, children });
 SectionHeader.displayName = "TeachInUI.PageContent.SectionHeader";
 var SectionTitle = ({
   children,
   ...others
-}) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("h2", { className: "text-3xl leading-9 font-bold", ...others, children });
+}) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("h2", { className: "text-3xl leading-9 font-bold", ...others, children });
 SectionTitle.displayName = "TeachInUI.PageContent.SectionTitle";
 var SectionActions = ({
   children,
   ...others
-}) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "flex gap-2", role: "group", ...others, children });
+}) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "flex gap-2", role: "group", ...others, children });
 SectionActions.displayName = "TeachInUI.PageContent.SectionActions";
 var PageContent = {
   Root: Root2,
@@ -1422,19 +1710,19 @@ var PageContent = {
 };
 
 // src/ui/layout/page/page-loading.tsx
-var import_jsx_runtime54 = require("react/jsx-runtime");
-var PageLoading = () => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "flex h-screen items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(Spinner, {}) });
+var import_jsx_runtime55 = require("react/jsx-runtime");
+var PageLoading = () => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "flex h-screen items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Spinner, {}) });
 PageLoading.displayName = "TeachInUI.PageLoading";
 
 // src/ui/layout/page/section-loading.tsx
-var import_jsx_runtime55 = require("react/jsx-runtime");
-var SectionLoading = () => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "flex min-h-[400px] items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Spinner, {}) });
+var import_jsx_runtime56 = require("react/jsx-runtime");
+var SectionLoading = () => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "flex min-h-[400px] items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Spinner, {}) });
 SectionLoading.displayName = "TeachInUI.SectionLoading";
 
 // src/ui/layout/flex/flex.tsx
-var import_tailwind_variants7 = require("tailwind-variants");
-var import_jsx_runtime56 = require("react/jsx-runtime");
-var variants2 = (0, import_tailwind_variants7.tv)({
+var import_tailwind_variants9 = require("tailwind-variants");
+var import_jsx_runtime57 = require("react/jsx-runtime");
+var variants2 = (0, import_tailwind_variants9.tv)({
   base: "flex",
   variants: {
     direction: {
@@ -1481,14 +1769,14 @@ var variants2 = (0, import_tailwind_variants7.tv)({
   }
 });
 var Flex = ({ className, ...props }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: variants2({ ...props, className }), ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: variants2({ ...props, className }), ...props });
 };
 Flex.displayName = "TeachInUI.Flex";
 
 // src/ui/layout/grid/grid.tsx
-var import_tailwind_variants8 = require("tailwind-variants");
-var import_jsx_runtime57 = require("react/jsx-runtime");
-var variants3 = (0, import_tailwind_variants8.tv)({
+var import_tailwind_variants10 = require("tailwind-variants");
+var import_jsx_runtime58 = require("react/jsx-runtime");
+var variants3 = (0, import_tailwind_variants10.tv)({
   base: "grid",
   variants: {
     columns: {
@@ -1537,26 +1825,26 @@ var variants3 = (0, import_tailwind_variants8.tv)({
   }
 });
 var Grid = ({ className, ...props }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: variants3({ ...props, className }), ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { className: variants3({ ...props, className }), ...props });
 };
 Grid.displayName = "TeachInUI.Grid";
 
 // src/ui/layout/divider/divider.tsx
-var import_react31 = __toESM(require("react"));
+var import_react33 = __toESM(require("react"));
 var import_divider = require("@heroui/divider");
-var import_jsx_runtime58 = require("react/jsx-runtime");
-var Divider = import_react31.default.forwardRef((props, ref) => {
+var import_jsx_runtime59 = require("react/jsx-runtime");
+var Divider = import_react33.default.forwardRef((props, ref) => {
   const { ...restProps } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_divider.Divider, { ref, ...restProps });
+  return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_divider.Divider, { ref, ...restProps });
 });
 Divider.displayName = "TeachInUI.Divider";
 
 // src/ui/layout/scroll-shadow/scroll-shadow.tsx
-var import_react32 = __toESM(require("react"));
+var import_react34 = __toESM(require("react"));
 var import_scroll_shadow = require("@heroui/scroll-shadow");
-var import_jsx_runtime59 = require("react/jsx-runtime");
-var ScrollShadow = import_react32.default.forwardRef((props, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_scroll_shadow.ScrollShadow, { ref, ...props });
+var import_jsx_runtime60 = require("react/jsx-runtime");
+var ScrollShadow = import_react34.default.forwardRef((props, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_scroll_shadow.ScrollShadow, { ref, ...props });
 });
 ScrollShadow.displayName = "TeachInUI.ScrollShadow";
 
@@ -1567,18 +1855,18 @@ var AccordionItem = Object.assign(import_accordion.AccordionItem, { displayName:
 
 // src/ui/navigation/link/link.tsx
 var import_link = require("@heroui/link");
-var import_jsx_runtime60 = require("react/jsx-runtime");
+var import_jsx_runtime61 = require("react/jsx-runtime");
 function Link({ children, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_link.Link, { ...props, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_link.Link, { ...props, children });
 }
 Link.displayName = "TeachInUI.Link";
 
 // src/ui/navigation/tabs/tabs.tsx
-var import_react33 = __toESM(require("react"));
+var import_react35 = __toESM(require("react"));
 var import_tabs = require("@heroui/tabs");
-var import_jsx_runtime61 = require("react/jsx-runtime");
-var Root3 = import_react33.default.forwardRef(({ children, ...props }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_tabs.Tabs, { ref, ...props, children });
+var import_jsx_runtime62 = require("react/jsx-runtime");
+var Root3 = import_react35.default.forwardRef(({ children, ...props }, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_tabs.Tabs, { ref, ...props, children });
 });
 Root3.displayName = "TeachInUI.Tabs.Root";
 var Tab = Object.assign(import_tabs.Tab, {
@@ -1590,35 +1878,35 @@ var Tabs = {
 };
 
 // src/ui/navigation/navbar/navbar.tsx
-var import_react34 = __toESM(require("react"));
+var import_react36 = __toESM(require("react"));
 var import_navbar = require("@heroui/navbar");
-var import_jsx_runtime62 = require("react/jsx-runtime");
-var Navbar = import_react34.default.forwardRef((props, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_navbar.Navbar, { ref, ...props });
+var import_jsx_runtime63 = require("react/jsx-runtime");
+var Navbar = import_react36.default.forwardRef((props, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_navbar.Navbar, { ref, ...props });
 });
 Navbar.displayName = "TeachInUI.Navbar";
-var NavbarBrand = import_react34.default.forwardRef((props, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_navbar.NavbarBrand, { ref, ...props });
+var NavbarBrand = import_react36.default.forwardRef((props, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_navbar.NavbarBrand, { ref, ...props });
 });
 NavbarBrand.displayName = "TeachInUI.NavbarBrand";
-var NavbarContent = import_react34.default.forwardRef((props, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_navbar.NavbarContent, { ref, ...props });
+var NavbarContent = import_react36.default.forwardRef((props, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_navbar.NavbarContent, { ref, ...props });
 });
 NavbarContent.displayName = "TeachInUI.NavbarContent";
-var NavbarItem = import_react34.default.forwardRef((props, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_navbar.NavbarItem, { ref, ...props });
+var NavbarItem = import_react36.default.forwardRef((props, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_navbar.NavbarItem, { ref, ...props });
 });
 NavbarItem.displayName = "TeachInUI.NavbarItem";
-var NavbarMenu = import_react34.default.forwardRef((props, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_navbar.NavbarMenu, { ref, ...props });
+var NavbarMenu = import_react36.default.forwardRef((props, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_navbar.NavbarMenu, { ref, ...props });
 });
 NavbarMenu.displayName = "TeachInUI.NavbarMenu";
-var NavbarMenuItem = import_react34.default.forwardRef((props, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_navbar.NavbarMenuItem, { ref, ...props });
+var NavbarMenuItem = import_react36.default.forwardRef((props, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_navbar.NavbarMenuItem, { ref, ...props });
 });
 NavbarMenuItem.displayName = "TeachInUI.NavbarMenuItem";
-var NavbarMenuToggle = import_react34.default.forwardRef((props, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_navbar.NavbarMenuToggle, { ref, ...props });
+var NavbarMenuToggle = import_react36.default.forwardRef((props, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_navbar.NavbarMenuToggle, { ref, ...props });
 });
 NavbarMenuToggle.displayName = "TeachInUI.NavbarMenuToggle";
 
@@ -1631,30 +1919,30 @@ var BreadcrumbItem2 = Object.assign(import_breadcrumbs3.BreadcrumbItem, {
 
 // src/ui/overlays/modal/modal.tsx
 var import_modal = require("@heroui/modal");
-var import_jsx_runtime63 = require("react/jsx-runtime");
+var import_jsx_runtime64 = require("react/jsx-runtime");
 function Root4({
   size = "md",
   placement = "center",
   children,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_modal.Modal, { placement, size, ...props, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_modal.Modal, { placement, size, ...props, children });
 }
 Root4.displayName = "TeachInUI.Modal.Root";
 function Content({ children, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_modal.ModalContent, { ...props, children: (onClose) => typeof children === "function" ? children(onClose) : children });
+  return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_modal.ModalContent, { ...props, children: (onClose) => typeof children === "function" ? children(onClose) : children });
 }
 Content.displayName = "TeachInUI.Modal.Content";
 function Header3({ children, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_modal.ModalHeader, { ...props, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_modal.ModalHeader, { ...props, children });
 }
 Header3.displayName = "TeachInUI.Modal.Header";
 function Body3({ children, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_modal.ModalBody, { ...props, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_modal.ModalBody, { ...props, children });
 }
 Body3.displayName = "TeachInUI.Modal.Body";
 function Footer2({ children, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_modal.ModalFooter, { ...props, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_modal.ModalFooter, { ...props, children });
 }
 Footer2.displayName = "TeachInUI.Modal.Footer";
 var Modal = {
@@ -1679,17 +1967,17 @@ var DropdownSection = Object.assign(import_dropdown.DropdownSection, {
 
 // src/ui/overlays/popover/popover.tsx
 var import_popover = require("@heroui/popover");
-var import_jsx_runtime64 = require("react/jsx-runtime");
+var import_jsx_runtime65 = require("react/jsx-runtime");
 var Root5 = ({ children, ...props }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_popover.Popover, { ...props, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_popover.Popover, { ...props, children });
 };
 Root5.displayName = "TeachInUI.Popover.Root";
 var Trigger = ({ children, ...props }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_popover.PopoverTrigger, { ...props, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_popover.PopoverTrigger, { ...props, children });
 };
 Trigger.displayName = "TeachInUI.Popover.Trigger";
 var Content2 = ({ children, ...props }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_popover.PopoverContent, { ...props, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_popover.PopoverContent, { ...props, children });
 };
 Content2.displayName = "TeachInUI.Popover.Content";
 var Popover = {
@@ -1700,7 +1988,7 @@ var Popover = {
 
 // src/ui/provider/ui-provider.tsx
 var import_system3 = require("@heroui/system");
-var import_jsx_runtime65 = require("react/jsx-runtime");
+var import_jsx_runtime66 = require("react/jsx-runtime");
 function UIProvider({
   children,
   locale = "ru-RU",
@@ -1708,19 +1996,12 @@ function UIProvider({
   navigate,
   toastProviderProps
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(import_system3.HeroUIProvider, { labelPlacement, locale, navigate, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_system3.HeroUIProvider, { labelPlacement, locale, navigate, children: [
     children,
-    /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(ToastProvider, { ...toastProviderProps })
+    /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(ToastProvider, { ...toastProviderProps })
   ] });
 }
 
-// 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/theme/tokens/breakpoints.ts
 var breakpoints = {
   xs: 480,
@@ -2171,6 +2452,7 @@ var theme = (0, import_theme.heroui)({
   NavbarMenu,
   NavbarMenuItem,
   NavbarMenuToggle,
+  Number,
   PageContent,
   PageLoading,
   Pagination,
@@ -2190,6 +2472,7 @@ var theme = (0, import_theme.heroui)({
   SectionTitle,
   Select,
   SelectField,
+  SelectItem,
   Spinner,
   Switch,
   SwitchField,