@jbpark/ui-kit 2.11.0 → 2.11.3

package/dist/components/atoms/checkbox/checkbox.d.mts

@@ -17,7 +17,7 @@ interface Props extends Omit<React.ComponentPropsWithoutRef<'div'>, 'onChange'>
 }
 declare const Checkbox: ({
   placement,
-  value,
+  value: _value,
   children,
   className,
   icons,

package/dist/components/atoms/checkbox/checkbox.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.d.mts","names":[],"sources":["../../../../src/components/atoms/checkbox/checkbox.tsx"],"mappings":";;;;UAciB,KAAA,SAAc,IAAA,CAC7B,KAAA,CAAM,wBAAA;EAGN,SAAA;EACA,cAAA;EACA,OAAA;EACA,KAAA,GAAQ,WAAA;EACR,QAAA;EACA,KAAA;IAAU,OAAA,EAAS,KAAA,CAAM,SAAA;IAAW,SAAA,EAAW,KAAA,CAAM,SAAA;EAAA;EACrD,QAAA,GAAW,KAAA,CAAM,SAAA;EACjB,QAAA,IAAY,OAAA;AAAA;AAAA,cAGR,QAAA;EAAY,SAAA;EAAA,KAAA;EAAA,QAAA;EAAA,SAAA;EAAA,KAAA;EAAA,QAAA;EAAA,cAAA;EAAA,OAAA,EAAA,QAAA;EAAA,QAAA,EAAA,SAAA;EAAA,GAAA;AAAA,GAWf,KAAA,KAAK,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"checkbox.d.mts","names":[],"sources":["../../../../src/components/atoms/checkbox/checkbox.tsx"],"mappings":";;;;UAciB,KAAA,SAAc,IAAA,CAC7B,KAAA,CAAM,wBAAA;EAGN,SAAA;EACA,cAAA;EACA,OAAA;EACA,KAAA,GAAQ,WAAA;EACR,QAAA;EACA,KAAA;IAAU,OAAA,EAAS,KAAA,CAAM,SAAA;IAAW,SAAA,EAAW,KAAA,CAAM,SAAA;EAAA;EACrD,QAAA,GAAW,KAAA,CAAM,SAAA;EACjB,QAAA,IAAY,OAAA;AAAA;AAAA,cAGR,QAAA;EAAY,SAAA;EAAA,KAAA,EAAA,MAAA;EAAA,QAAA;EAAA,SAAA;EAAA,KAAA;EAAA,QAAA;EAAA,cAAA;EAAA,OAAA,EAAA,QAAA;EAAA,QAAA,EAAA,SAAA;EAAA,GAAA;AAAA,GAWf,KAAA,KAAK,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/atoms/checkbox/checkbox.mjs

@@ -10,10 +10,9 @@ import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/atoms/checkbox/checkbox.tsx
 const { Checkbox: CoreCheckbox } = checkbox_exports;
 const { Label: CoreLabel } = label_exports;
-const Checkbox = ({ placement = "left", value = "", children, className, icons, disabled, defaultChecked, checked: _checked, onChange: _onChange = () => {}, ...props }) => {
+const Checkbox = ({ placement = "left", value: _value, children, className, icons, disabled, defaultChecked, checked: _checked, onChange: _onChange = () => {}, ...props }) => {
 	const [uncontrolledChecked, setUncontrolledChecked] = useState(defaultChecked || false);
-	const reactId = useId();
-	const id = typeof value === "boolean" || !value ? reactId : String(value);
+	const id = useId();
 	const controlled = _checked !== void 0;
 	const checked = controlled ? _checked : uncontrolledChecked;
 	const cursorClassName = disabled ? "cursor-not-allowed" : "cursor-pointer";

package/dist/components/atoms/checkbox/checkbox.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.mjs","names":["checkbox","label"],"sources":["../../../../src/components/atoms/checkbox/checkbox.tsx"],"sourcesContent":["'use client';\n\nimport { useId, useState } from 'react';\n\nimport { Square, SquareCheck } from 'lucide-react';\n\nimport { checkbox, label } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nimport { type OptionValue } from './group';\n\nconst { Checkbox: CoreCheckbox } = checkbox;\nconst { Label: CoreLabel } = label;\n\nexport interface Props extends Omit<\n  React.ComponentPropsWithoutRef<'div'>,\n  'onChange'\n> {\n  placement?: 'left' | 'right';\n  defaultChecked?: boolean;\n  checked?: boolean;\n  value?: OptionValue;\n  disabled?: boolean;\n  icons?: { checked: React.ReactNode; unchecked: React.ReactNode };\n  children?: React.ReactNode;\n  onChange?: (checked: boolean) => void;\n}\n\nconst Checkbox = ({\n  placement = 'left',\n  value = '',\n  children,\n  className,\n  icons,\n  disabled,\n  defaultChecked,\n  checked: _checked,\n  onChange: _onChange = () => {},\n  ...props\n}: Props) => {\n  const [uncontrolledChecked, setUncontrolledChecked] = useState<boolean>(\n    defaultChecked || false,\n  );\n\n  const reactId = useId();\n\n  const id = typeof value === 'boolean' || !value ? reactId : String(value);\n  const controlled = _checked !== undefined;\n  const checked = controlled ? _checked : uncontrolledChecked;\n\n  const cursorClassName = disabled ? 'cursor-not-allowed' : 'cursor-pointer';\n\n  const onChange = (next: boolean) => {\n    if (disabled) {\n      return;\n    }\n\n    if (!controlled) {\n      setUncontrolledChecked(next);\n    }\n    _onChange(next);\n  };\n\n  const renderContent = icons ? (\n    <>\n      <input\n        id={id}\n        hidden\n        type=\"checkbox\"\n        checked={checked}\n        onChange={e => {\n          onChange(e.target.checked);\n        }}\n      />\n      <span\n        className={cn(cursorClassName, disabled && 'opacity-50')}\n        onClick={() => {\n          document.getElementById(id)?.click();\n        }}\n      >\n        {checked\n          ? (icons.checked ?? <SquareCheck />)\n          : (icons.unchecked ?? <Square />)}\n      </span>\n      {children && (\n        <label\n          className={cn(cursorClassName, disabled && 'opacity-50')}\n          htmlFor={id}\n        >\n          {children}\n        </label>\n      )}\n    </>\n  ) : (\n    <>\n      <CoreCheckbox\n        id={id}\n        checked={checked}\n        disabled={disabled}\n        className={cn(cursorClassName)}\n        onCheckedChange={onChange}\n      />\n      {children && (\n        <CoreLabel htmlFor={id} className={cn(cursorClassName, 'text-left')}>\n          {children}\n        </CoreLabel>\n      )}\n    </>\n  );\n\n  return (\n    <div\n      className={cn(\n        'flex items-center gap-x-2',\n        placement === 'right' && 'flex-row-reverse',\n        cursorClassName,\n        className,\n        //\n      )}\n      {...props}\n    >\n      {renderContent}\n    </div>\n  );\n};\n\nexport default Checkbox;\n"],"mappings":";;;;;;;;;;AAWA,MAAM,EAAE,UAAU,iBAAiBA;AACnC,MAAM,EAAE,OAAO,cAAcC;AAgB7B,MAAM,YAAY,EAChB,YAAY,QACZ,QAAQ,IACR,UACA,WACA,OACA,UACA,gBACA,SAAS,UACT,UAAU,kBAAkB,IAC5B,GAAG,YACQ;CACX,MAAM,CAAC,qBAAqB,0BAA0B,SACpD,kBAAkB,MACnB;CAED,MAAM,UAAU,OAAO;CAEvB,MAAM,KAAK,OAAO,UAAU,aAAa,CAAC,QAAQ,UAAU,OAAO,MAAM;CACzE,MAAM,aAAa,aAAa;CAChC,MAAM,UAAU,aAAa,WAAW;CAExC,MAAM,kBAAkB,WAAW,uBAAuB;CAE1D,MAAM,YAAY,SAAkB;AAClC,MAAI,SACF;AAGF,MAAI,CAAC,WACH,wBAAuB,KAAK;AAE9B,YAAU,KAAK;;CAGjB,MAAM,gBAAgB,QACpB;EACE,oBAAC;GACK;GACJ;GACA,MAAK;GACI;GACT,WAAU,MAAK;AACb,aAAS,EAAE,OAAO,QAAQ;;IAE5B;EACF,oBAAC;GACC,WAAW,GAAG,iBAAiB,YAAY,aAAa;GACxD,eAAe;AACb,aAAS,eAAe,GAAG,EAAE,OAAO;;aAGrC,UACI,MAAM,WAAW,oBAAC,gBAAc,GAChC,MAAM,aAAa,oBAAC,WAAS;IAC7B;EACN,YACC,oBAAC;GACC,WAAW,GAAG,iBAAiB,YAAY,aAAa;GACxD,SAAS;GAER;IACK;KAET,GAEH,8CACE,oBAAC;EACK;EACK;EACC;EACV,WAAW,GAAG,gBAAgB;EAC9B,iBAAiB;GACjB,EACD,YACC,oBAAC;EAAU,SAAS;EAAI,WAAW,GAAG,iBAAiB,YAAY;EAChE;GACS,IAEb;AAGL,QACE,oBAAC;EACC,WAAW,GACT,6BACA,cAAc,WAAW,oBACzB,iBACA,UAED;EACD,GAAI;YAEH;GACG"}
+{"version":3,"file":"checkbox.mjs","names":["checkbox","label"],"sources":["../../../../src/components/atoms/checkbox/checkbox.tsx"],"sourcesContent":["'use client';\n\nimport { useId, useState } from 'react';\n\nimport { Square, SquareCheck } from 'lucide-react';\n\nimport { checkbox, label } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nimport { type OptionValue } from './group';\n\nconst { Checkbox: CoreCheckbox } = checkbox;\nconst { Label: CoreLabel } = label;\n\nexport interface Props extends Omit<\n  React.ComponentPropsWithoutRef<'div'>,\n  'onChange'\n> {\n  placement?: 'left' | 'right';\n  defaultChecked?: boolean;\n  checked?: boolean;\n  value?: OptionValue;\n  disabled?: boolean;\n  icons?: { checked: React.ReactNode; unchecked: React.ReactNode };\n  children?: React.ReactNode;\n  onChange?: (checked: boolean) => void;\n}\n\nconst Checkbox = ({\n  placement = 'left',\n  value: _value,\n  children,\n  className,\n  icons,\n  disabled,\n  defaultChecked,\n  checked: _checked,\n  onChange: _onChange = () => {},\n  ...props\n}: Props) => {\n  const [uncontrolledChecked, setUncontrolledChecked] = useState<boolean>(\n    defaultChecked || false,\n  );\n\n  const id = useId();\n\n  const controlled = _checked !== undefined;\n  const checked = controlled ? _checked : uncontrolledChecked;\n\n  const cursorClassName = disabled ? 'cursor-not-allowed' : 'cursor-pointer';\n\n  const onChange = (next: boolean) => {\n    if (disabled) {\n      return;\n    }\n\n    if (!controlled) {\n      setUncontrolledChecked(next);\n    }\n    _onChange(next);\n  };\n\n  const renderContent = icons ? (\n    <>\n      <input\n        id={id}\n        hidden\n        type=\"checkbox\"\n        checked={checked}\n        onChange={e => {\n          onChange(e.target.checked);\n        }}\n      />\n      <span\n        className={cn(cursorClassName, disabled && 'opacity-50')}\n        onClick={() => {\n          document.getElementById(id)?.click();\n        }}\n      >\n        {checked\n          ? (icons.checked ?? <SquareCheck />)\n          : (icons.unchecked ?? <Square />)}\n      </span>\n      {children && (\n        <label\n          className={cn(cursorClassName, disabled && 'opacity-50')}\n          htmlFor={id}\n        >\n          {children}\n        </label>\n      )}\n    </>\n  ) : (\n    <>\n      <CoreCheckbox\n        id={id}\n        checked={checked}\n        disabled={disabled}\n        className={cn(cursorClassName)}\n        onCheckedChange={onChange}\n      />\n      {children && (\n        <CoreLabel htmlFor={id} className={cn(cursorClassName, 'text-left')}>\n          {children}\n        </CoreLabel>\n      )}\n    </>\n  );\n\n  return (\n    <div\n      className={cn(\n        'flex items-center gap-x-2',\n        placement === 'right' && 'flex-row-reverse',\n        cursorClassName,\n        className,\n        //\n      )}\n      {...props}\n    >\n      {renderContent}\n    </div>\n  );\n};\n\nexport default Checkbox;\n"],"mappings":";;;;;;;;;;AAWA,MAAM,EAAE,UAAU,iBAAiBA;AACnC,MAAM,EAAE,OAAO,cAAcC;AAgB7B,MAAM,YAAY,EAChB,YAAY,QACZ,OAAO,QACP,UACA,WACA,OACA,UACA,gBACA,SAAS,UACT,UAAU,kBAAkB,IAC5B,GAAG,YACQ;CACX,MAAM,CAAC,qBAAqB,0BAA0B,SACpD,kBAAkB,MACnB;CAED,MAAM,KAAK,OAAO;CAElB,MAAM,aAAa,aAAa;CAChC,MAAM,UAAU,aAAa,WAAW;CAExC,MAAM,kBAAkB,WAAW,uBAAuB;CAE1D,MAAM,YAAY,SAAkB;AAClC,MAAI,SACF;AAGF,MAAI,CAAC,WACH,wBAAuB,KAAK;AAE9B,YAAU,KAAK;;CAGjB,MAAM,gBAAgB,QACpB;EACE,oBAAC;GACK;GACJ;GACA,MAAK;GACI;GACT,WAAU,MAAK;AACb,aAAS,EAAE,OAAO,QAAQ;;IAE5B;EACF,oBAAC;GACC,WAAW,GAAG,iBAAiB,YAAY,aAAa;GACxD,eAAe;AACb,aAAS,eAAe,GAAG,EAAE,OAAO;;aAGrC,UACI,MAAM,WAAW,oBAAC,gBAAc,GAChC,MAAM,aAAa,oBAAC,WAAS;IAC7B;EACN,YACC,oBAAC;GACC,WAAW,GAAG,iBAAiB,YAAY,aAAa;GACxD,SAAS;GAER;IACK;KAET,GAEH,8CACE,oBAAC;EACK;EACK;EACC;EACV,WAAW,GAAG,gBAAgB;EAC9B,iBAAiB;GACjB,EACD,YACC,oBAAC;EAAU,SAAS;EAAI,WAAW,GAAG,iBAAiB,YAAY;EAChE;GACS,IAEb;AAGL,QACE,oBAAC;EACC,WAAW,GACT,6BACA,cAAc,WAAW,oBACzB,iBACA,UAED;EACD,GAAI;YAEH;GACG"}

package/dist/components/atoms/float-button/back-top.mjs

@@ -10,6 +10,7 @@ import { useWindowScroll } from "@uidotdev/usehooks";
 const BackTop = ({ visibilityHeight = 450, className, onClick, ...props }) => {
 	const [{ y }, scrollTo] = useWindowScroll();
 	return /* @__PURE__ */ jsx(FloatButton, {
+		"aria-label": "맨 위로",
 		icon: /* @__PURE__ */ jsx(ArrowUp, {}),
 		className: cn(className, (!y || visibilityHeight > y) && "hidden"),
 		onClick: (e) => {

package/dist/components/atoms/float-button/back-top.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"back-top.mjs","names":[],"sources":["../../../../src/components/atoms/float-button/back-top.tsx"],"sourcesContent":["'use client';\n\nimport { MouseEvent } from 'react';\n\nimport { useWindowScroll } from '@uidotdev/usehooks';\nimport { ArrowUp } from 'lucide-react';\n\nimport { cn } from '@repo/ui/utils';\n\nimport { type Props as ButtonProps } from '../button';\nimport FloatButton from './float-button';\n\nexport interface Props extends ButtonProps {\n  visibilityHeight?: number;\n  onClick?: (e: MouseEvent<HTMLElement>) => void;\n}\n\nconst BackTop = ({\n  visibilityHeight = 450,\n  className,\n  onClick,\n  ...props\n}: Props) => {\n  const [{ y }, scrollTo] = useWindowScroll();\n\n  return (\n    <FloatButton\n      icon={<ArrowUp />}\n      className={cn(\n        className,\n        (!y || visibilityHeight > y) && 'hidden',\n        //\n      )}\n      onClick={e => {\n        scrollTo({ left: 0, top: 0, behavior: 'smooth' });\n        onClick?.(e);\n      }}\n      {...props}\n    />\n  );\n};\n\nexport default BackTop;\n"],"mappings":";;;;;;;;;AAiBA,MAAM,WAAW,EACf,mBAAmB,KACnB,WACA,SACA,GAAG,YACQ;CACX,MAAM,CAAC,EAAE,KAAK,YAAY,iBAAiB;AAE3C,QACE,oBAAC;EACC,MAAM,oBAAC,YAAU;EACjB,WAAW,GACT,YACC,CAAC,KAAK,mBAAmB,MAAM,SAEjC;EACD,UAAS,MAAK;AACZ,YAAS;IAAE,MAAM;IAAG,KAAK;IAAG,UAAU;IAAU,CAAC;AACjD,aAAU,EAAE;;EAEd,GAAI;GACJ"}
+{"version":3,"file":"back-top.mjs","names":[],"sources":["../../../../src/components/atoms/float-button/back-top.tsx"],"sourcesContent":["'use client';\n\nimport { MouseEvent } from 'react';\n\nimport { useWindowScroll } from '@uidotdev/usehooks';\nimport { ArrowUp } from 'lucide-react';\n\nimport { cn } from '@repo/ui/utils';\n\nimport { type Props as ButtonProps } from '../button';\nimport FloatButton from './float-button';\n\nexport interface Props extends ButtonProps {\n  visibilityHeight?: number;\n  onClick?: (e: MouseEvent<HTMLElement>) => void;\n}\n\nconst BackTop = ({\n  visibilityHeight = 450,\n  className,\n  onClick,\n  ...props\n}: Props) => {\n  const [{ y }, scrollTo] = useWindowScroll();\n\n  return (\n    <FloatButton\n      aria-label=\"맨 위로\"\n      icon={<ArrowUp />}\n      className={cn(\n        className,\n        (!y || visibilityHeight > y) && 'hidden',\n        //\n      )}\n      onClick={e => {\n        scrollTo({ left: 0, top: 0, behavior: 'smooth' });\n        onClick?.(e);\n      }}\n      {...props}\n    />\n  );\n};\n\nexport default BackTop;\n"],"mappings":";;;;;;;;;AAiBA,MAAM,WAAW,EACf,mBAAmB,KACnB,WACA,SACA,GAAG,YACQ;CACX,MAAM,CAAC,EAAE,KAAK,YAAY,iBAAiB;AAE3C,QACE,oBAAC;EACC,cAAW;EACX,MAAM,oBAAC,YAAU;EACjB,WAAW,GACT,YACC,CAAC,KAAK,mBAAmB,MAAM,SAEjC;EACD,UAAS,MAAK;AACZ,YAAS;IAAE,MAAM;IAAG,KAAK;IAAG,UAAU;IAAU,CAAC;AACjD,aAAU,EAAE;;EAEd,GAAI;GACJ"}

package/dist/components/atoms/float-button/float-button.mjs

@@ -5,7 +5,7 @@ import { jsx } from "react/jsx-runtime";
 //#region src/components/atoms/float-button/float-button.tsx
 const FloatButton = ({ className, children, ...props }) => {
 	return /* @__PURE__ */ jsx(Button, {
-		className: cn("fixed right-5 bottom-5 rounded-full", "bg-white hover:bg-white", "z-50 h-12 w-12", "shadow-md", className),
+		className: cn("fixed right-5 bottom-5 rounded-full", "z-50 h-12 w-12", "shadow-md", className),
 		variant: "outlined",
 		...props,
 		children

package/dist/components/atoms/float-button/float-button.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"float-button.mjs","names":[],"sources":["../../../../src/components/atoms/float-button/float-button.tsx"],"sourcesContent":["import { cn } from '@repo/ui/utils';\n\nimport Button, { Props as ButtonProps } from '../button';\n\nexport interface Props extends ButtonProps {}\n\nconst FloatButton = ({ className, children, ...props }: Props) => {\n  return (\n    <Button\n      className={cn(\n        'fixed right-5 bottom-5 rounded-full',\n        'bg-white hover:bg-white',\n        'z-50 h-12 w-12',\n        'shadow-md',\n        className,\n      )}\n      variant=\"outlined\"\n      {...props}\n    >\n      {children}\n    </Button>\n  );\n};\n\nexport default FloatButton;\n"],"mappings":";;;;;AAMA,MAAM,eAAe,EAAE,WAAW,UAAU,GAAG,YAAmB;AAChE,QACE,oBAAC;EACC,WAAW,GACT,uCACA,2BACA,kBACA,aACA,UACD;EACD,SAAQ;EACR,GAAI;EAEH;GACM"}
+{"version":3,"file":"float-button.mjs","names":[],"sources":["../../../../src/components/atoms/float-button/float-button.tsx"],"sourcesContent":["import { cn } from '@repo/ui/utils';\n\nimport Button, { Props as ButtonProps } from '../button';\n\nexport interface Props extends ButtonProps {}\n\nconst FloatButton = ({ className, children, ...props }: Props) => {\n  return (\n    <Button\n      className={cn(\n        'fixed right-5 bottom-5 rounded-full',\n        'z-50 h-12 w-12',\n        'shadow-md',\n        className,\n      )}\n      variant=\"outlined\"\n      {...props}\n    >\n      {children}\n    </Button>\n  );\n};\n\nexport default FloatButton;\n"],"mappings":";;;;;AAMA,MAAM,eAAe,EAAE,WAAW,UAAU,GAAG,YAAmB;AAChE,QACE,oBAAC;EACC,WAAW,GACT,uCACA,kBACA,aACA,UACD;EACD,SAAQ;EACR,GAAI;EAEH;GACM"}

package/dist/components/atoms/input/search.mjs

@@ -4,7 +4,7 @@ import { cn } from "../../../utils.mjs";
 import { input_exports } from "../../../core/input.mjs";
 import Button from "../../../Button.mjs";
 import { CircleX, Search } from "lucide-react";
-import { useRef } from "react";
+import { useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/components/atoms/input/search.tsx
@@ -12,9 +12,12 @@ const { Input: Core } = input_exports;
 const Search$1 = ({ ref, className, defaultValue, value, allowClear = true, onChange, onSearch: _onSearch, ...props }) => {
 	const internalRef = useRef(null);
 	const inputRef = ref || internalRef;
+	const [uncontrolledHasValue, setUncontrolledHasValue] = useState(!!defaultValue);
+	const hasValue = value !== void 0 ? !!value : uncontrolledHasValue;
 	const onClear = () => {
 		if (inputRef.current) {
 			inputRef.current.value = "";
+			if (value === void 0) setUncontrolledHasValue(false);
 			onChange?.({ target: { value: "" } });
 		}
 	};
@@ -33,13 +36,16 @@ const Search$1 = ({ ref, className, defaultValue, value, allowClear = true, onCh
 				className: cn("rounded-r-none", "[&::-webkit-search-cancel-button]:hidden", "[&::-webkit-search-decoration]:hidden"),
 				value,
 				defaultValue,
-				onChange,
+				onChange: (e) => {
+					if (value === void 0) setUncontrolledHasValue(!!e.target.value);
+					onChange?.(e);
+				},
 				onKeyDown: (e) => {
 					if (e.key === "Enter") onSearch();
 				},
 				...props
 			}), /* @__PURE__ */ jsx(CircleX, {
-				className: cn("absolute right-2 size-4", "shrink-0 cursor-pointer", (!allowClear || value !== void 0 && !value) && "hidden"),
+				className: cn("absolute right-2 size-4", "shrink-0 cursor-pointer", (!allowClear || !hasValue) && "hidden"),
 				onClick: onClear
 			})]
 		}), /* @__PURE__ */ jsx(Button, {

package/dist/components/atoms/input/search.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"search.mjs","names":["input","Search","SearchOutlined"],"sources":["../../../../src/components/atoms/input/search.tsx"],"sourcesContent":["'use client';\n\nimport { useRef } from 'react';\n\nimport { CircleX, Search as SearchOutlined } from 'lucide-react';\n\nimport { input } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nimport Button from '../button';\n\nconst { Input: Core } = input;\n\nexport interface Props extends React.ComponentPropsWithRef<'input'> {\n  allowClear?: boolean;\n  onChange?: (\n    e: React.ChangeEvent<HTMLInputElement> | { target: { value: string } },\n  ) => void;\n  onSearch?: (value: string) => void;\n}\n\nconst Search = ({\n  ref,\n  className,\n  defaultValue,\n  value,\n  allowClear = true,\n  onChange,\n  onSearch: _onSearch,\n  ...props\n}: Props) => {\n  const internalRef = useRef<HTMLInputElement>(null);\n  const inputRef = (ref as React.RefObject<HTMLInputElement>) || internalRef;\n\n  const onClear = () => {\n    if (inputRef.current) {\n      inputRef.current.value = '';\n\n      const event = {\n        target: { value: '' },\n      } as React.ChangeEvent<HTMLInputElement>;\n      onChange?.(event);\n    }\n  };\n\n  const onSearch = () => {\n    if (inputRef.current) {\n      _onSearch?.(inputRef.current.value);\n    }\n  };\n\n  return (\n    <div\n      className={cn(\n        'flex items-center',\n        'rounded-md',\n        className,\n        //\n      )}\n    >\n      <div\n        className={cn(\n          'relative grow',\n          'inline-flex items-center',\n          //\n        )}\n      >\n        <Core\n          ref={inputRef}\n          inputMode=\"search\"\n          type=\"search\"\n          enterKeyHint=\"search\"\n          className={cn(\n            'rounded-r-none',\n            '[&::-webkit-search-cancel-button]:hidden',\n            '[&::-webkit-search-decoration]:hidden',\n            //\n          )}\n          value={value}\n          defaultValue={defaultValue}\n          onChange={onChange}\n          onKeyDown={e => {\n            if (e.key === 'Enter') {\n              onSearch();\n            }\n          }}\n          {...props}\n        />\n        <CircleX\n          className={cn(\n            'absolute right-2 size-4',\n            'shrink-0 cursor-pointer',\n            (!allowClear || (value !== undefined && !value)) && 'hidden',\n          )}\n          onClick={onClear}\n        />\n      </div>\n      <Button\n        icon={<SearchOutlined />}\n        className={cn(\n          'rounded-l-none',\n          'size-9',\n          //\n        )}\n        onClick={onSearch}\n      />\n    </div>\n  );\n};\n\nSearch.displayName = 'Search';\n\nexport default Search;\n"],"mappings":";;;;;;;;;;AAWA,MAAM,EAAE,OAAO,SAASA;AAUxB,MAAMC,YAAU,EACd,KACA,WACA,cACA,OACA,aAAa,MACb,UACA,UAAU,WACV,GAAG,YACQ;CACX,MAAM,cAAc,OAAyB,KAAK;CAClD,MAAM,WAAY,OAA6C;CAE/D,MAAM,gBAAgB;AACpB,MAAI,SAAS,SAAS;AACpB,YAAS,QAAQ,QAAQ;AAKzB,cAHc,EACZ,QAAQ,EAAE,OAAO,IAAI,EACtB,CACgB;;;CAIrB,MAAM,iBAAiB;AACrB,MAAI,SAAS,QACX,aAAY,SAAS,QAAQ,MAAM;;AAIvC,QACE,qBAAC;EACC,WAAW,GACT,qBACA,cACA,UAED;aAED,qBAAC;GACC,WAAW,GACT,iBACA,2BAED;cAED,oBAAC;IACC,KAAK;IACL,WAAU;IACV,MAAK;IACL,cAAa;IACb,WAAW,GACT,kBACA,4CACA,wCAED;IACM;IACO;IACJ;IACV,YAAW,MAAK;AACd,SAAI,EAAE,QAAQ,QACZ,WAAU;;IAGd,GAAI;KACJ,EACF,oBAAC;IACC,WAAW,GACT,2BACA,4BACC,CAAC,cAAe,UAAU,UAAa,CAAC,UAAW,SACrD;IACD,SAAS;KACT;IACE,EACN,oBAAC;GACC,MAAM,oBAACC,WAAiB;GACxB,WAAW,GACT,kBACA,SAED;GACD,SAAS;IACT;GACE;;AAIV,SAAO,cAAc"}
+{"version":3,"file":"search.mjs","names":["input","Search","SearchOutlined"],"sources":["../../../../src/components/atoms/input/search.tsx"],"sourcesContent":["'use client';\n\nimport { useRef, useState } from 'react';\n\nimport { CircleX, Search as SearchOutlined } from 'lucide-react';\n\nimport { input } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nimport Button from '../button';\n\nconst { Input: Core } = input;\n\nexport interface Props extends React.ComponentPropsWithRef<'input'> {\n  allowClear?: boolean;\n  onChange?: (\n    e: React.ChangeEvent<HTMLInputElement> | { target: { value: string } },\n  ) => void;\n  onSearch?: (value: string) => void;\n}\n\nconst Search = ({\n  ref,\n  className,\n  defaultValue,\n  value,\n  allowClear = true,\n  onChange,\n  onSearch: _onSearch,\n  ...props\n}: Props) => {\n  const internalRef = useRef<HTMLInputElement>(null);\n  const inputRef = (ref as React.RefObject<HTMLInputElement>) || internalRef;\n\n  const [uncontrolledHasValue, setUncontrolledHasValue] =\n    useState(!!defaultValue);\n  const hasValue = value !== undefined ? !!value : uncontrolledHasValue;\n\n  const onClear = () => {\n    if (inputRef.current) {\n      inputRef.current.value = '';\n\n      if (value === undefined) {\n        setUncontrolledHasValue(false);\n      }\n\n      const event = {\n        target: { value: '' },\n      } as React.ChangeEvent<HTMLInputElement>;\n      onChange?.(event);\n    }\n  };\n\n  const onSearch = () => {\n    if (inputRef.current) {\n      _onSearch?.(inputRef.current.value);\n    }\n  };\n\n  return (\n    <div\n      className={cn(\n        'flex items-center',\n        'rounded-md',\n        className,\n        //\n      )}\n    >\n      <div\n        className={cn(\n          'relative grow',\n          'inline-flex items-center',\n          //\n        )}\n      >\n        <Core\n          ref={inputRef}\n          inputMode=\"search\"\n          type=\"search\"\n          enterKeyHint=\"search\"\n          className={cn(\n            'rounded-r-none',\n            '[&::-webkit-search-cancel-button]:hidden',\n            '[&::-webkit-search-decoration]:hidden',\n            //\n          )}\n          value={value}\n          defaultValue={defaultValue}\n          onChange={e => {\n            if (value === undefined) {\n              setUncontrolledHasValue(!!e.target.value);\n            }\n            onChange?.(e);\n          }}\n          onKeyDown={e => {\n            if (e.key === 'Enter') {\n              onSearch();\n            }\n          }}\n          {...props}\n        />\n        <CircleX\n          className={cn(\n            'absolute right-2 size-4',\n            'shrink-0 cursor-pointer',\n            (!allowClear || !hasValue) && 'hidden',\n          )}\n          onClick={onClear}\n        />\n      </div>\n      <Button\n        icon={<SearchOutlined />}\n        className={cn(\n          'rounded-l-none',\n          'size-9',\n          //\n        )}\n        onClick={onSearch}\n      />\n    </div>\n  );\n};\n\nSearch.displayName = 'Search';\n\nexport default Search;\n"],"mappings":";;;;;;;;;;AAWA,MAAM,EAAE,OAAO,SAASA;AAUxB,MAAMC,YAAU,EACd,KACA,WACA,cACA,OACA,aAAa,MACb,UACA,UAAU,WACV,GAAG,YACQ;CACX,MAAM,cAAc,OAAyB,KAAK;CAClD,MAAM,WAAY,OAA6C;CAE/D,MAAM,CAAC,sBAAsB,2BAC3B,SAAS,CAAC,CAAC,aAAa;CAC1B,MAAM,WAAW,UAAU,SAAY,CAAC,CAAC,QAAQ;CAEjD,MAAM,gBAAgB;AACpB,MAAI,SAAS,SAAS;AACpB,YAAS,QAAQ,QAAQ;AAEzB,OAAI,UAAU,OACZ,yBAAwB,MAAM;AAMhC,cAHc,EACZ,QAAQ,EAAE,OAAO,IAAI,EACtB,CACgB;;;CAIrB,MAAM,iBAAiB;AACrB,MAAI,SAAS,QACX,aAAY,SAAS,QAAQ,MAAM;;AAIvC,QACE,qBAAC;EACC,WAAW,GACT,qBACA,cACA,UAED;aAED,qBAAC;GACC,WAAW,GACT,iBACA,2BAED;cAED,oBAAC;IACC,KAAK;IACL,WAAU;IACV,MAAK;IACL,cAAa;IACb,WAAW,GACT,kBACA,4CACA,wCAED;IACM;IACO;IACd,WAAU,MAAK;AACb,SAAI,UAAU,OACZ,yBAAwB,CAAC,CAAC,EAAE,OAAO,MAAM;AAE3C,gBAAW,EAAE;;IAEf,YAAW,MAAK;AACd,SAAI,EAAE,QAAQ,QACZ,WAAU;;IAGd,GAAI;KACJ,EACF,oBAAC;IACC,WAAW,GACT,2BACA,4BACC,CAAC,cAAc,CAAC,aAAa,SAC/B;IACD,SAAS;KACT;IACE,EACN,oBAAC;GACC,MAAM,oBAACC,WAAiB;GACxB,WAAW,GACT,kBACA,SAED;GACD,SAAS;IACT;GACE;;AAIV,SAAO,cAAc"}

package/dist/components/atoms/radio/radio.d.mts

@@ -19,7 +19,7 @@ interface Props extends Omit<React.ComponentPropsWithoutRef<typeof Core>, 'onCha
 }
 declare const Radio: ({
   placement,
-  value,
+  value: _value,
   children,
   className,
   icons,

package/dist/components/atoms/radio/radio.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"radio.d.mts","names":[],"sources":["../../../../src/components/atoms/radio/radio.tsx"],"mappings":";;;;;;cAWoB,IAAA,SAAI,UAAA;AAAA,UAGP,KAAA,SAAc,IAAA,CAC7B,KAAA,CAAM,wBAAA,QAAgC,IAAA;EAGtC,SAAA;EACA,cAAA;EACA,OAAA;EACA,KAAA,GAAQ,WAAA;EACR,QAAA;EACA,KAAA;IAAU,OAAA,EAAS,KAAA,CAAM,SAAA;IAAW,SAAA,EAAW,KAAA,CAAM,SAAA;EAAA;EACrD,QAAA,IAAY,OAAA;AAAA;AAAA,cAGR,KAAA;EAAS,SAAA;EAAA,KAAA;EAAA,QAAA;EAAA,SAAA;EAAA,KAAA;EAAA,QAAA;EAAA,cAAA;EAAA,OAAA,EAAA,QAAA;EAAA,QAAA,EAAA,SAAA;EAAA,GAAA;AAAA,GAWZ,KAAA,KAAK,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"radio.d.mts","names":[],"sources":["../../../../src/components/atoms/radio/radio.tsx"],"mappings":";;;;;;cAWoB,IAAA,SAAI,UAAA;AAAA,UAGP,KAAA,SAAc,IAAA,CAC7B,KAAA,CAAM,wBAAA,QAAgC,IAAA;EAGtC,SAAA;EACA,cAAA;EACA,OAAA;EACA,KAAA,GAAQ,WAAA;EACR,QAAA;EACA,KAAA;IAAU,OAAA,EAAS,KAAA,CAAM,SAAA;IAAW,SAAA,EAAW,KAAA,CAAM,SAAA;EAAA;EACrD,QAAA,IAAY,OAAA;AAAA;AAAA,cAGR,KAAA;EAAS,SAAA;EAAA,KAAA,EAAA,MAAA;EAAA,QAAA;EAAA,SAAA;EAAA,KAAA;EAAA,QAAA;EAAA,cAAA;EAAA,OAAA,EAAA,QAAA;EAAA,QAAA,EAAA,SAAA;EAAA,GAAA;AAAA,GAWZ,KAAA,KAAK,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/atoms/radio/radio.mjs

@@ -10,10 +10,9 @@ import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/atoms/radio/radio.tsx
 const { RadioGroup: Core, RadioGroupItem: Item } = radio_group_exports;
 const { Field, FieldLabel } = field_exports;
-const Radio = ({ placement = "left", value = "", children, className, icons, disabled, defaultChecked, checked: _checked, onChange: _onChange = () => {}, ...props }) => {
+const Radio = ({ placement = "left", value: _value, children, className, icons, disabled, defaultChecked, checked: _checked, onChange: _onChange = () => {}, ...props }) => {
 	const [uncontrolledChecked, setUncontrolledChecked] = useState(defaultChecked || false);
-	const reactId = useId();
-	const id = typeof value === "boolean" || !value ? reactId : String(value);
+	const id = useId();
 	const controlled = _checked !== void 0;
 	const checked = controlled ? _checked : uncontrolledChecked;
 	const cursorClassName = disabled ? "cursor-not-allowed" : "cursor-pointer";

package/dist/components/atoms/radio/radio.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"radio.mjs","names":["radio","field"],"sources":["../../../../src/components/atoms/radio/radio.tsx"],"sourcesContent":["'use client';\n\nimport { useId, useState } from 'react';\n\nimport { Circle, CircleCheck } from 'lucide-react';\n\nimport { field, radio } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nimport { type OptionValue } from './group';\n\nconst { RadioGroup: Core, RadioGroupItem: Item } = radio;\nconst { Field, FieldLabel } = field;\n\nexport interface Props extends Omit<\n  React.ComponentPropsWithoutRef<typeof Core>,\n  'onChange' | 'value'\n> {\n  placement?: 'left' | 'right';\n  defaultChecked?: boolean;\n  checked?: boolean;\n  value?: OptionValue;\n  disabled?: boolean;\n  icons?: { checked: React.ReactNode; unchecked: React.ReactNode };\n  onChange?: (checked: boolean) => void;\n}\n\nconst Radio = ({\n  placement = 'left',\n  value = '',\n  children,\n  className,\n  icons,\n  disabled,\n  defaultChecked,\n  checked: _checked,\n  onChange: _onChange = () => {},\n  ...props\n}: Props) => {\n  const [uncontrolledChecked, setUncontrolledChecked] = useState<boolean>(\n    defaultChecked || false,\n  );\n\n  const reactId = useId();\n  const id = typeof value === 'boolean' || !value ? reactId : String(value);\n  const controlled = _checked !== undefined;\n  const checked = controlled ? _checked : uncontrolledChecked;\n\n  const cursorClassName = disabled ? 'cursor-not-allowed' : 'cursor-pointer';\n\n  const onChange = (next: boolean) => {\n    if (disabled) {\n      return;\n    }\n\n    if (!controlled) {\n      setUncontrolledChecked(next);\n    }\n    _onChange(next);\n  };\n\n  const renderContent = icons ? (\n    <>\n      <input\n        id={id}\n        hidden\n        type=\"radio\"\n        checked={checked}\n        onChange={e => {\n          onChange(e.target.checked);\n        }}\n      />\n      <span\n        className={cn(cursorClassName, disabled && 'opacity-50')}\n        onClick={() => {\n          document.getElementById(id)?.click();\n        }}\n      >\n        {checked\n          ? (icons.checked ?? <CircleCheck />)\n          : (icons.unchecked ?? <Circle />)}\n      </span>\n      {children && (\n        <label\n          className={cn(cursorClassName, disabled && 'opacity-50')}\n          htmlFor={id}\n        >\n          {children}\n        </label>\n      )}\n    </>\n  ) : (\n    <Core value={checked ? id : ''} onValueChange={() => onChange(true)}>\n      <Field\n        orientation=\"horizontal\"\n        className={cn(\n          'flex gap-2',\n          placement === 'right' && 'flex-row-reverse',\n        )}\n        data-disabled={disabled}\n      >\n        <Item value={id} id={id} checked={checked} disabled={disabled} />\n        <FieldLabel htmlFor={id} className={cursorClassName}>\n          {children}\n        </FieldLabel>\n      </Field>\n    </Core>\n  );\n\n  return (\n    <div\n      className={cn(\n        'flex items-center',\n        icons && placement === 'right' && 'flex-row-reverse',\n        cursorClassName,\n        className,\n        //\n      )}\n      {...props}\n    >\n      {renderContent}\n    </div>\n  );\n};\n\nexport default Radio;\n"],"mappings":";;;;;;;;;;AAWA,MAAM,EAAE,YAAY,MAAM,gBAAgB,SAASA;AACnD,MAAM,EAAE,OAAO,eAAeC;AAe9B,MAAM,SAAS,EACb,YAAY,QACZ,QAAQ,IACR,UACA,WACA,OACA,UACA,gBACA,SAAS,UACT,UAAU,kBAAkB,IAC5B,GAAG,YACQ;CACX,MAAM,CAAC,qBAAqB,0BAA0B,SACpD,kBAAkB,MACnB;CAED,MAAM,UAAU,OAAO;CACvB,MAAM,KAAK,OAAO,UAAU,aAAa,CAAC,QAAQ,UAAU,OAAO,MAAM;CACzE,MAAM,aAAa,aAAa;CAChC,MAAM,UAAU,aAAa,WAAW;CAExC,MAAM,kBAAkB,WAAW,uBAAuB;CAE1D,MAAM,YAAY,SAAkB;AAClC,MAAI,SACF;AAGF,MAAI,CAAC,WACH,wBAAuB,KAAK;AAE9B,YAAU,KAAK;;CAGjB,MAAM,gBAAgB,QACpB;EACE,oBAAC;GACK;GACJ;GACA,MAAK;GACI;GACT,WAAU,MAAK;AACb,aAAS,EAAE,OAAO,QAAQ;;IAE5B;EACF,oBAAC;GACC,WAAW,GAAG,iBAAiB,YAAY,aAAa;GACxD,eAAe;AACb,aAAS,eAAe,GAAG,EAAE,OAAO;;aAGrC,UACI,MAAM,WAAW,oBAAC,gBAAc,GAChC,MAAM,aAAa,oBAAC,WAAS;IAC7B;EACN,YACC,oBAAC;GACC,WAAW,GAAG,iBAAiB,YAAY,aAAa;GACxD,SAAS;GAER;IACK;KAET,GAEH,oBAAC;EAAK,OAAO,UAAU,KAAK;EAAI,qBAAqB,SAAS,KAAK;YACjE,qBAAC;GACC,aAAY;GACZ,WAAW,GACT,cACA,cAAc,WAAW,mBAC1B;GACD,iBAAe;cAEf,oBAAC;IAAK,OAAO;IAAQ;IAAa;IAAmB;KAAY,EACjE,oBAAC;IAAW,SAAS;IAAI,WAAW;IACjC;KACU;IACP;GACH;AAGT,QACE,oBAAC;EACC,WAAW,GACT,qBACA,SAAS,cAAc,WAAW,oBAClC,iBACA,UAED;EACD,GAAI;YAEH;GACG"}
+{"version":3,"file":"radio.mjs","names":["radio","field"],"sources":["../../../../src/components/atoms/radio/radio.tsx"],"sourcesContent":["'use client';\n\nimport { useId, useState } from 'react';\n\nimport { Circle, CircleCheck } from 'lucide-react';\n\nimport { field, radio } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nimport { type OptionValue } from './group';\n\nconst { RadioGroup: Core, RadioGroupItem: Item } = radio;\nconst { Field, FieldLabel } = field;\n\nexport interface Props extends Omit<\n  React.ComponentPropsWithoutRef<typeof Core>,\n  'onChange' | 'value'\n> {\n  placement?: 'left' | 'right';\n  defaultChecked?: boolean;\n  checked?: boolean;\n  value?: OptionValue;\n  disabled?: boolean;\n  icons?: { checked: React.ReactNode; unchecked: React.ReactNode };\n  onChange?: (checked: boolean) => void;\n}\n\nconst Radio = ({\n  placement = 'left',\n  value: _value,\n  children,\n  className,\n  icons,\n  disabled,\n  defaultChecked,\n  checked: _checked,\n  onChange: _onChange = () => {},\n  ...props\n}: Props) => {\n  const [uncontrolledChecked, setUncontrolledChecked] = useState<boolean>(\n    defaultChecked || false,\n  );\n\n  const id = useId();\n  const controlled = _checked !== undefined;\n  const checked = controlled ? _checked : uncontrolledChecked;\n\n  const cursorClassName = disabled ? 'cursor-not-allowed' : 'cursor-pointer';\n\n  const onChange = (next: boolean) => {\n    if (disabled) {\n      return;\n    }\n\n    if (!controlled) {\n      setUncontrolledChecked(next);\n    }\n    _onChange(next);\n  };\n\n  const renderContent = icons ? (\n    <>\n      <input\n        id={id}\n        hidden\n        type=\"radio\"\n        checked={checked}\n        onChange={e => {\n          onChange(e.target.checked);\n        }}\n      />\n      <span\n        className={cn(cursorClassName, disabled && 'opacity-50')}\n        onClick={() => {\n          document.getElementById(id)?.click();\n        }}\n      >\n        {checked\n          ? (icons.checked ?? <CircleCheck />)\n          : (icons.unchecked ?? <Circle />)}\n      </span>\n      {children && (\n        <label\n          className={cn(cursorClassName, disabled && 'opacity-50')}\n          htmlFor={id}\n        >\n          {children}\n        </label>\n      )}\n    </>\n  ) : (\n    <Core value={checked ? id : ''} onValueChange={() => onChange(true)}>\n      <Field\n        orientation=\"horizontal\"\n        className={cn(\n          'flex gap-2',\n          placement === 'right' && 'flex-row-reverse',\n        )}\n        data-disabled={disabled}\n      >\n        <Item value={id} id={id} checked={checked} disabled={disabled} />\n        <FieldLabel htmlFor={id} className={cursorClassName}>\n          {children}\n        </FieldLabel>\n      </Field>\n    </Core>\n  );\n\n  return (\n    <div\n      className={cn(\n        'flex items-center',\n        icons && placement === 'right' && 'flex-row-reverse',\n        cursorClassName,\n        className,\n        //\n      )}\n      {...props}\n    >\n      {renderContent}\n    </div>\n  );\n};\n\nexport default Radio;\n"],"mappings":";;;;;;;;;;AAWA,MAAM,EAAE,YAAY,MAAM,gBAAgB,SAASA;AACnD,MAAM,EAAE,OAAO,eAAeC;AAe9B,MAAM,SAAS,EACb,YAAY,QACZ,OAAO,QACP,UACA,WACA,OACA,UACA,gBACA,SAAS,UACT,UAAU,kBAAkB,IAC5B,GAAG,YACQ;CACX,MAAM,CAAC,qBAAqB,0BAA0B,SACpD,kBAAkB,MACnB;CAED,MAAM,KAAK,OAAO;CAClB,MAAM,aAAa,aAAa;CAChC,MAAM,UAAU,aAAa,WAAW;CAExC,MAAM,kBAAkB,WAAW,uBAAuB;CAE1D,MAAM,YAAY,SAAkB;AAClC,MAAI,SACF;AAGF,MAAI,CAAC,WACH,wBAAuB,KAAK;AAE9B,YAAU,KAAK;;CAGjB,MAAM,gBAAgB,QACpB;EACE,oBAAC;GACK;GACJ;GACA,MAAK;GACI;GACT,WAAU,MAAK;AACb,aAAS,EAAE,OAAO,QAAQ;;IAE5B;EACF,oBAAC;GACC,WAAW,GAAG,iBAAiB,YAAY,aAAa;GACxD,eAAe;AACb,aAAS,eAAe,GAAG,EAAE,OAAO;;aAGrC,UACI,MAAM,WAAW,oBAAC,gBAAc,GAChC,MAAM,aAAa,oBAAC,WAAS;IAC7B;EACN,YACC,oBAAC;GACC,WAAW,GAAG,iBAAiB,YAAY,aAAa;GACxD,SAAS;GAER;IACK;KAET,GAEH,oBAAC;EAAK,OAAO,UAAU,KAAK;EAAI,qBAAqB,SAAS,KAAK;YACjE,qBAAC;GACC,aAAY;GACZ,WAAW,GACT,cACA,cAAc,WAAW,mBAC1B;GACD,iBAAe;cAEf,oBAAC;IAAK,OAAO;IAAQ;IAAa;IAAmB;KAAY,EACjE,oBAAC;IAAW,SAAS;IAAI,WAAW;IACjC;KACU;IACP;GACH;AAGT,QACE,oBAAC;EACC,WAAW,GACT,qBACA,SAAS,cAAc,WAAW,oBAClC,iBACA,UAED;EACD,GAAI;YAEH;GACG"}

package/dist/components/atoms/skeleton/skeleton.d.mts

@@ -33,7 +33,7 @@ declare const Skeleton: ({
   height,
   children,
   ...props
-}: Props) => string | number | bigint | boolean | Iterable<react.ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<react.ReactNode> | null | undefined> | react_jsx_runtime0.JSX.Element | null | undefined;
+}: Props) => string | number | bigint | boolean | Iterable<react.ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<react.ReactNode> | null | undefined> | react_jsx_runtime0.JSX.Element | null;
 //#endregion
 export { Props, Skeleton };
 //# sourceMappingURL=skeleton.d.mts.map

package/dist/components/atoms/skeleton/skeleton.mjs

@@ -13,9 +13,12 @@ const SIZES = {
 	large: "w-72 h-8"
 };
 const Skeleton = ({ active = true, loading = true, avatar, size = "default", direction = "vertical", count = 1, gap = 6, className, classNames = {}, style, width, height, children, ...props }) => {
-	if (!loading) return children;
+	if (!loading) return children ?? null;
 	return /* @__PURE__ */ jsxs("div", {
+		role: "status",
+		"aria-label": "로딩 중",
 		className: cn("flex items-center gap-3"),
+		...props,
 		children: [avatar && /* @__PURE__ */ jsx(Core, { className: cn("h-12 w-12", "rounded-xl", !active && "animate-none", classNames.avatar) }), /* @__PURE__ */ jsx("div", {
 			className: cn("flex grow", direction === "vertical" && "flex-col", classNames.wrapper),
 			style: { gap },
@@ -28,8 +31,7 @@ const Skeleton = ({ active = true, loading = true, avatar, size = "default", dir
 						...style,
 						width: itemWidth,
 						height: itemHeight
-					},
-					...props
+					}
 				}, index);
 			})
 		})]

package/dist/components/atoms/skeleton/skeleton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton.mjs","names":["skeleton"],"sources":["../../../../src/components/atoms/skeleton/skeleton.tsx"],"sourcesContent":["import { skeleton } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nconst { Skeleton: Core } = skeleton;\n\nconst getValueAtIndex = <T,>(value: T | T[], index: number) => {\n  return Array.isArray(value) ? (value[index] ?? value[0]) : value;\n};\n\nexport interface Props extends React.ComponentPropsWithoutRef<'div'> {\n  active?: boolean;\n  loading?: boolean;\n  avatar?: boolean;\n  size?: 'default' | 'small' | 'large';\n  count?: number;\n  gap?: number;\n  direction?: 'horizontal' | 'vertical';\n  width?: string | number | (string | number)[];\n  height?: string | number | (string | number)[];\n  classNames?: {\n    wrapper?: string;\n    avatar?: string;\n    item?: string;\n  };\n}\n\nconst SIZES = {\n  small: 'w-48 h-4',\n  default: 'w-60 h-6',\n  large: 'w-72 h-8',\n};\n\nconst Skeleton = ({\n  active = true,\n  loading = true,\n  avatar,\n  size = 'default',\n  direction = 'vertical',\n  count = 1,\n  gap = 6,\n  className,\n  classNames = {},\n  style,\n  width,\n  height,\n  children,\n  ...props\n}: Props) => {\n  if (!loading) {\n    return children;\n  }\n\n  return (\n    <div\n      className={cn(\n        'flex items-center gap-3',\n        //\n      )}\n    >\n      {avatar && (\n        <Core\n          className={cn(\n            'h-12 w-12',\n            'rounded-xl',\n            !active && 'animate-none',\n            classNames.avatar,\n          )}\n        />\n      )}\n      <div\n        className={cn(\n          'flex grow',\n          direction === 'vertical' && 'flex-col',\n          classNames.wrapper,\n        )}\n        style={{\n          gap,\n        }}\n      >\n        {Array.from({ length: count }).map((_, index) => {\n          const itemWidth = getValueAtIndex(width, index);\n          const itemHeight = getValueAtIndex(height, index);\n\n          return (\n            <Core\n              key={index}\n              className={cn(\n                'rounded-md',\n                !active && 'animate-none',\n                SIZES[size],\n                className,\n                classNames.item,\n                //\n              )}\n              style={{\n                ...style,\n                width: itemWidth,\n                height: itemHeight,\n              }}\n              {...props}\n            />\n          );\n        })}\n      </div>\n    </div>\n  );\n};\n\nexport default Skeleton;\n"],"mappings":";;;;;AAGA,MAAM,EAAE,UAAU,SAASA;AAE3B,MAAM,mBAAuB,OAAgB,UAAkB;AAC7D,QAAO,MAAM,QAAQ,MAAM,GAAI,MAAM,UAAU,MAAM,KAAM;;AAoB7D,MAAM,QAAQ;CACZ,OAAO;CACP,SAAS;CACT,OAAO;CACR;AAED,MAAM,YAAY,EAChB,SAAS,MACT,UAAU,MACV,QACA,OAAO,WACP,YAAY,YACZ,QAAQ,GACR,MAAM,GACN,WACA,aAAa,EAAE,EACf,OACA,OACA,QACA,UACA,GAAG,YACQ;AACX,KAAI,CAAC,QACH,QAAO;AAGT,QACE,qBAAC;EACC,WAAW,GACT,0BAED;aAEA,UACC,oBAAC,QACC,WAAW,GACT,aACA,cACA,CAAC,UAAU,gBACX,WAAW,OACZ,GACD,EAEJ,oBAAC;GACC,WAAW,GACT,aACA,cAAc,cAAc,YAC5B,WAAW,QACZ;GACD,OAAO,EACL,KACD;aAEA,MAAM,KAAK,EAAE,QAAQ,OAAO,CAAC,CAAC,KAAK,GAAG,UAAU;IAC/C,MAAM,YAAY,gBAAgB,OAAO,MAAM;IAC/C,MAAM,aAAa,gBAAgB,QAAQ,MAAM;AAEjD,WACE,oBAAC;KAEC,WAAW,GACT,cACA,CAAC,UAAU,gBACX,MAAM,OACN,WACA,WAAW,KAEZ;KACD,OAAO;MACL,GAAG;MACH,OAAO;MACP,QAAQ;MACT;KACD,GAAI;OAdC,MAeL;KAEJ;IACE;GACF"}
+{"version":3,"file":"skeleton.mjs","names":["skeleton"],"sources":["../../../../src/components/atoms/skeleton/skeleton.tsx"],"sourcesContent":["import { skeleton } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nconst { Skeleton: Core } = skeleton;\n\nconst getValueAtIndex = <T,>(value: T | T[], index: number) => {\n  return Array.isArray(value) ? (value[index] ?? value[0]) : value;\n};\n\nexport interface Props extends React.ComponentPropsWithoutRef<'div'> {\n  active?: boolean;\n  loading?: boolean;\n  avatar?: boolean;\n  size?: 'default' | 'small' | 'large';\n  count?: number;\n  gap?: number;\n  direction?: 'horizontal' | 'vertical';\n  width?: string | number | (string | number)[];\n  height?: string | number | (string | number)[];\n  classNames?: {\n    wrapper?: string;\n    avatar?: string;\n    item?: string;\n  };\n}\n\nconst SIZES = {\n  small: 'w-48 h-4',\n  default: 'w-60 h-6',\n  large: 'w-72 h-8',\n};\n\nconst Skeleton = ({\n  active = true,\n  loading = true,\n  avatar,\n  size = 'default',\n  direction = 'vertical',\n  count = 1,\n  gap = 6,\n  className,\n  classNames = {},\n  style,\n  width,\n  height,\n  children,\n  ...props\n}: Props) => {\n  if (!loading) {\n    return children ?? null;\n  }\n\n  return (\n    <div\n      role=\"status\"\n      aria-label=\"로딩 중\"\n      className={cn(\n        'flex items-center gap-3',\n        //\n      )}\n      {...props}\n    >\n      {avatar && (\n        <Core\n          className={cn(\n            'h-12 w-12',\n            'rounded-xl',\n            !active && 'animate-none',\n            classNames.avatar,\n          )}\n        />\n      )}\n      <div\n        className={cn(\n          'flex grow',\n          direction === 'vertical' && 'flex-col',\n          classNames.wrapper,\n        )}\n        style={{\n          gap,\n        }}\n      >\n        {Array.from({ length: count }).map((_, index) => {\n          const itemWidth = getValueAtIndex(width, index);\n          const itemHeight = getValueAtIndex(height, index);\n\n          return (\n            <Core\n              key={index}\n              className={cn(\n                'rounded-md',\n                !active && 'animate-none',\n                SIZES[size],\n                className,\n                classNames.item,\n                //\n              )}\n              style={{\n                ...style,\n                width: itemWidth,\n                height: itemHeight,\n              }}\n            />\n          );\n        })}\n      </div>\n    </div>\n  );\n};\n\nexport default Skeleton;\n"],"mappings":";;;;;AAGA,MAAM,EAAE,UAAU,SAASA;AAE3B,MAAM,mBAAuB,OAAgB,UAAkB;AAC7D,QAAO,MAAM,QAAQ,MAAM,GAAI,MAAM,UAAU,MAAM,KAAM;;AAoB7D,MAAM,QAAQ;CACZ,OAAO;CACP,SAAS;CACT,OAAO;CACR;AAED,MAAM,YAAY,EAChB,SAAS,MACT,UAAU,MACV,QACA,OAAO,WACP,YAAY,YACZ,QAAQ,GACR,MAAM,GACN,WACA,aAAa,EAAE,EACf,OACA,OACA,QACA,UACA,GAAG,YACQ;AACX,KAAI,CAAC,QACH,QAAO,YAAY;AAGrB,QACE,qBAAC;EACC,MAAK;EACL,cAAW;EACX,WAAW,GACT,0BAED;EACD,GAAI;aAEH,UACC,oBAAC,QACC,WAAW,GACT,aACA,cACA,CAAC,UAAU,gBACX,WAAW,OACZ,GACD,EAEJ,oBAAC;GACC,WAAW,GACT,aACA,cAAc,cAAc,YAC5B,WAAW,QACZ;GACD,OAAO,EACL,KACD;aAEA,MAAM,KAAK,EAAE,QAAQ,OAAO,CAAC,CAAC,KAAK,GAAG,UAAU;IAC/C,MAAM,YAAY,gBAAgB,OAAO,MAAM;IAC/C,MAAM,aAAa,gBAAgB,QAAQ,MAAM;AAEjD,WACE,oBAAC;KAEC,WAAW,GACT,cACA,CAAC,UAAU,gBACX,MAAM,OACN,WACA,WAAW,KAEZ;KACD,OAAO;MACL,GAAG;MACH,OAAO;MACP,QAAQ;MACT;OAbI,MAcL;KAEJ;IACE;GACF"}

package/dist/components/atoms/typography/link.d.mts

@@ -5,6 +5,8 @@ interface Props extends React.ComponentPropsWithoutRef<'a'> {}
 declare const Link: ({
   children,
   className,
+  target,
+  rel,
   ...props
 }: Props) => react_jsx_runtime0.JSX.Element;
 //#endregion

package/dist/components/atoms/typography/link.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"link.d.mts","names":[],"sources":["../../../../src/components/atoms/typography/link.tsx"],"mappings":";;;UAEiB,KAAA,SAAc,KAAA,CAAM,wBAAA;AAAA,cAE/B,IAAA;EAAQ,QAAA;EAAA,SAAA;EAAA,GAAA;AAAA,GAAmC,KAAA,KAAK,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"link.d.mts","names":[],"sources":["../../../../src/components/atoms/typography/link.tsx"],"mappings":";;;UAEiB,KAAA,SAAc,KAAA,CAAM,wBAAA;AAAA,cAE/B,IAAA;EAAQ,QAAA;EAAA,SAAA;EAAA,MAAA;EAAA,GAAA;EAAA,GAAA;AAAA,GAAgD,KAAA,KAAK,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/atoms/typography/link.mjs

@@ -2,9 +2,11 @@ import { cn } from "../../../utils.mjs";
 import { jsx } from "react/jsx-runtime";
 
 //#region src/components/atoms/typography/link.tsx
-const Link = ({ children, className, ...props }) => {
+const Link = ({ children, className, target, rel, ...props }) => {
 	return /* @__PURE__ */ jsx("a", {
 		className: cn("underline-offset-1 hover:underline", className),
+		target,
+		rel: rel ?? (target === "_blank" ? "noopener noreferrer" : void 0),
 		...props,
 		children
 	});

package/dist/components/atoms/typography/link.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"link.mjs","names":[],"sources":["../../../../src/components/atoms/typography/link.tsx"],"sourcesContent":["import { cn } from '@repo/ui/utils';\n\nexport interface Props extends React.ComponentPropsWithoutRef<'a'> {}\n\nconst Link = ({ children, className, ...props }: Props) => {\n  return (\n    <a\n      className={cn(\n        'underline-offset-1 hover:underline',\n        className,\n        //\n      )}\n      {...props}\n    >\n      {children}\n    </a>\n  );\n};\n\nexport default Link;\n"],"mappings":";;;;AAIA,MAAM,QAAQ,EAAE,UAAU,WAAW,GAAG,YAAmB;AACzD,QACE,oBAAC;EACC,WAAW,GACT,sCACA,UAED;EACD,GAAI;EAEH;GACC"}
+{"version":3,"file":"link.mjs","names":[],"sources":["../../../../src/components/atoms/typography/link.tsx"],"sourcesContent":["import { cn } from '@repo/ui/utils';\n\nexport interface Props extends React.ComponentPropsWithoutRef<'a'> {}\n\nconst Link = ({ children, className, target, rel, ...props }: Props) => {\n  return (\n    <a\n      className={cn(\n        'underline-offset-1 hover:underline',\n        className,\n        //\n      )}\n      target={target}\n      rel={rel ?? (target === '_blank' ? 'noopener noreferrer' : undefined)}\n      {...props}\n    >\n      {children}\n    </a>\n  );\n};\n\nexport default Link;\n"],"mappings":";;;;AAIA,MAAM,QAAQ,EAAE,UAAU,WAAW,QAAQ,KAAK,GAAG,YAAmB;AACtE,QACE,oBAAC;EACC,WAAW,GACT,sCACA,UAED;EACO;EACR,KAAK,QAAQ,WAAW,WAAW,wBAAwB;EAC3D,GAAI;EAEH;GACC"}

package/dist/components/atoms/typography/text.mjs

@@ -4,7 +4,7 @@ import { jsx } from "react/jsx-runtime";
 //#region src/components/atoms/typography/text.tsx
 const Text = ({ children, underline, strong, className, ...props }) => {
 	return /* @__PURE__ */ jsx("span", {
-		className: cn("text-nowrap", underline && "underline", strong && "font-bold", className),
+		className: cn(underline && "underline", strong && "font-bold", className),
 		...props,
 		children
 	});

package/dist/components/atoms/typography/text.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"text.mjs","names":[],"sources":["../../../../src/components/atoms/typography/text.tsx"],"sourcesContent":["import { cn } from '@repo/ui/utils';\n\nexport interface Props extends React.ComponentPropsWithoutRef<'span'> {\n  underline?: boolean;\n  strong?: boolean;\n}\n\nconst Text = ({ children, underline, strong, className, ...props }: Props) => {\n  return (\n    <span\n      className={cn(\n        'text-nowrap',\n        underline && 'underline',\n        strong && 'font-bold',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </span>\n  );\n};\n\nexport default Text;\n"],"mappings":";;;;AAOA,MAAM,QAAQ,EAAE,UAAU,WAAW,QAAQ,WAAW,GAAG,YAAmB;AAC5E,QACE,oBAAC;EACC,WAAW,GACT,eACA,aAAa,aACb,UAAU,aACV,UACD;EACD,GAAI;EAEH;GACI"}
+{"version":3,"file":"text.mjs","names":[],"sources":["../../../../src/components/atoms/typography/text.tsx"],"sourcesContent":["import { cn } from '@repo/ui/utils';\n\nexport interface Props extends React.ComponentPropsWithoutRef<'span'> {\n  underline?: boolean;\n  strong?: boolean;\n}\n\nconst Text = ({ children, underline, strong, className, ...props }: Props) => {\n  return (\n    <span\n      className={cn(underline && 'underline', strong && 'font-bold', className)}\n      {...props}\n    >\n      {children}\n    </span>\n  );\n};\n\nexport default Text;\n"],"mappings":";;;;AAOA,MAAM,QAAQ,EAAE,UAAU,WAAW,QAAQ,WAAW,GAAG,YAAmB;AAC5E,QACE,oBAAC;EACC,WAAW,GAAG,aAAa,aAAa,UAAU,aAAa,UAAU;EACzE,GAAI;EAEH;GACI"}

package/dist/components/molecules/marquees/marquees.mjs

@@ -12,8 +12,12 @@ const Marquees = ({ className, items, speed, pauseOnHover = true, autoFill = tru
 	const [padding, setPadding] = useState(0);
 	const [pause, setPause] = useState(false);
 	const throttledWidth = useThrottle(width, 200);
-	const { size } = useResponsiveSize();
+	const { size, ref: responsiveRef } = useResponsiveSize();
 	const containerRef = useRef(null);
+	const setContainerRef = (node) => {
+		containerRef.current = node;
+		responsiveRef(node);
+	};
 	const hoverEvents = pauseOnHover ? {
 		onMouseEnter: () => {
 			setPause(true);
@@ -28,17 +32,8 @@ const Marquees = ({ className, items, speed, pauseOnHover = true, autoFill = tru
 		setPadding((parseFloat(computedStyle.paddingLeft) || 0) + (parseFloat(computedStyle.paddingRight) || 0));
 		setWidth(size.width);
 	}, [size]);
-	useEffect(() => {
-		const onScroll = () => {
-			setWidth(document.body.scrollWidth);
-		};
-		window.addEventListener("scroll", onScroll);
-		return () => {
-			window.removeEventListener("scroll", onScroll);
-		};
-	}, []);
 	return /* @__PURE__ */ jsx("div", {
-		ref: containerRef,
+		ref: setContainerRef,
 		className: cn(className),
 		...hoverEvents,
 		...props,

package/dist/components/molecules/marquees/marquees.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"marquees.mjs","names":[],"sources":["../../../../src/components/molecules/marquees/marquees.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect, useRef, useState } from 'react';\n\nimport { useResponsiveSize, useThrottle } from '@jbpark/use-hooks';\n\nimport { cn } from '@repo/ui/utils';\n\nimport Item, { type ItemProps } from './item';\n\nexport interface Props extends React.ComponentPropsWithoutRef<'div'> {\n  speed?: number;\n  autoFill?: boolean | number;\n  pauseOnHover?: boolean;\n  items?: ItemProps[];\n}\n\nconst Marquees = ({\n  className,\n  items,\n  speed,\n  pauseOnHover = true,\n  autoFill = true,\n  ...props\n}: Props) => {\n  const [width, setWidth] = useState<string | number>(\n    '100vw',\n    //\n  );\n  const [padding, setPadding] = useState(0);\n  const [pause, setPause] = useState(false);\n\n  const throttledWidth = useThrottle(width, 200);\n\n  const { size } = useResponsiveSize<HTMLDivElement>();\n  const containerRef = useRef<HTMLDivElement | null>(null);\n  const hoverEvents = pauseOnHover\n    ? {\n        onMouseEnter: () => {\n          setPause(true);\n        },\n        onMouseLeave: () => {\n          setPause(false);\n        },\n      }\n    : {};\n\n  useEffect(() => {\n    if (!size.width || !containerRef.current) {\n      return;\n    }\n\n    const computedStyle = getComputedStyle(containerRef.current);\n    const paddingLeft = parseFloat(computedStyle.paddingLeft) || 0;\n    const paddingRight = parseFloat(computedStyle.paddingRight) || 0;\n\n    setPadding(paddingLeft + paddingRight);\n\n    setWidth(size.width);\n  }, [size]);\n\n  useEffect(() => {\n    const onScroll = () => {\n      setWidth(document.body.scrollWidth);\n    };\n\n    window.addEventListener('scroll', onScroll);\n\n    return () => {\n      window.removeEventListener('scroll', onScroll);\n    };\n  }, []);\n\n  return (\n    <div\n      ref={containerRef}\n      className={cn(\n        className,\n        //\n      )}\n      {...hoverEvents}\n      {...props}\n    >\n      <div\n        className={cn(\n          'flex flex-col gap-y-5',\n          'overflow-hidden',\n          'whitespace-nowrap',\n          'bg-inherit',\n          //\n        )}\n        style={{\n          width:\n            typeof throttledWidth === 'number'\n              ? throttledWidth - padding\n              : throttledWidth,\n        }}\n      >\n        {items?.map(({ children, key: itemKey, ...item }: ItemProps, key) => (\n          <Item\n            key={itemKey || key}\n            width={throttledWidth}\n            pause={pause}\n            speed={speed}\n            autoFill={autoFill}\n            {...item}\n          >\n            {children}\n          </Item>\n        ))}\n      </div>\n    </div>\n  );\n};\n\nexport default Marquees;\n"],"mappings":";;;;;;;;;AAiBA,MAAM,YAAY,EAChB,WACA,OACA,OACA,eAAe,MACf,WAAW,MACX,GAAG,YACQ;CACX,MAAM,CAAC,OAAO,YAAY,SACxB,QAED;CACD,MAAM,CAAC,SAAS,cAAc,SAAS,EAAE;CACzC,MAAM,CAAC,OAAO,YAAY,SAAS,MAAM;CAEzC,MAAM,iBAAiB,YAAY,OAAO,IAAI;CAE9C,MAAM,EAAE,SAAS,mBAAmC;CACpD,MAAM,eAAe,OAA8B,KAAK;CACxD,MAAM,cAAc,eAChB;EACE,oBAAoB;AAClB,YAAS,KAAK;;EAEhB,oBAAoB;AAClB,YAAS,MAAM;;EAElB,GACD,EAAE;AAEN,iBAAgB;AACd,MAAI,CAAC,KAAK,SAAS,CAAC,aAAa,QAC/B;EAGF,MAAM,gBAAgB,iBAAiB,aAAa,QAAQ;AAI5D,cAHoB,WAAW,cAAc,YAAY,IAAI,MACxC,WAAW,cAAc,aAAa,IAAI,GAEzB;AAEtC,WAAS,KAAK,MAAM;IACnB,CAAC,KAAK,CAAC;AAEV,iBAAgB;EACd,MAAM,iBAAiB;AACrB,YAAS,SAAS,KAAK,YAAY;;AAGrC,SAAO,iBAAiB,UAAU,SAAS;AAE3C,eAAa;AACX,UAAO,oBAAoB,UAAU,SAAS;;IAE/C,EAAE,CAAC;AAEN,QACE,oBAAC;EACC,KAAK;EACL,WAAW,GACT,UAED;EACD,GAAI;EACJ,GAAI;YAEJ,oBAAC;GACC,WAAW,GACT,yBACA,mBACA,qBACA,aAED;GACD,OAAO,EACL,OACE,OAAO,mBAAmB,WACtB,iBAAiB,UACjB,gBACP;aAEA,OAAO,KAAK,EAAE,UAAU,KAAK,SAAS,GAAG,QAAmB,QAC3D,oBAAC;IAEC,OAAO;IACA;IACA;IACG;IACV,GAAI;IAEH;MAPI,WAAW,IAQX,CACP;IACE;GACF"}
+{"version":3,"file":"marquees.mjs","names":[],"sources":["../../../../src/components/molecules/marquees/marquees.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect, useRef, useState } from 'react';\n\nimport { useResponsiveSize, useThrottle } from '@jbpark/use-hooks';\n\nimport { cn } from '@repo/ui/utils';\n\nimport Item, { type ItemProps } from './item';\n\nexport interface Props extends React.ComponentPropsWithoutRef<'div'> {\n  speed?: number;\n  autoFill?: boolean | number;\n  pauseOnHover?: boolean;\n  items?: ItemProps[];\n}\n\nconst Marquees = ({\n  className,\n  items,\n  speed,\n  pauseOnHover = true,\n  autoFill = true,\n  ...props\n}: Props) => {\n  const [width, setWidth] = useState<string | number>(\n    '100vw',\n    //\n  );\n  const [padding, setPadding] = useState(0);\n  const [pause, setPause] = useState(false);\n\n  const throttledWidth = useThrottle(width, 200);\n\n  const { size, ref: responsiveRef } = useResponsiveSize<HTMLDivElement>();\n  const containerRef = useRef<HTMLDivElement | null>(null);\n  const setContainerRef = (node: HTMLDivElement | null) => {\n    containerRef.current = node;\n    responsiveRef(node);\n  };\n  const hoverEvents = pauseOnHover\n    ? {\n        onMouseEnter: () => {\n          setPause(true);\n        },\n        onMouseLeave: () => {\n          setPause(false);\n        },\n      }\n    : {};\n\n  useEffect(() => {\n    if (!size.width || !containerRef.current) {\n      return;\n    }\n\n    const computedStyle = getComputedStyle(containerRef.current);\n    const paddingLeft = parseFloat(computedStyle.paddingLeft) || 0;\n    const paddingRight = parseFloat(computedStyle.paddingRight) || 0;\n\n    setPadding(paddingLeft + paddingRight);\n\n    setWidth(size.width);\n  }, [size]);\n\n  return (\n    <div\n      ref={setContainerRef}\n      className={cn(\n        className,\n        //\n      )}\n      {...hoverEvents}\n      {...props}\n    >\n      <div\n        className={cn(\n          'flex flex-col gap-y-5',\n          'overflow-hidden',\n          'whitespace-nowrap',\n          'bg-inherit',\n          //\n        )}\n        style={{\n          width:\n            typeof throttledWidth === 'number'\n              ? throttledWidth - padding\n              : throttledWidth,\n        }}\n      >\n        {items?.map(({ children, key: itemKey, ...item }: ItemProps, key) => (\n          <Item\n            key={itemKey || key}\n            width={throttledWidth}\n            pause={pause}\n            speed={speed}\n            autoFill={autoFill}\n            {...item}\n          >\n            {children}\n          </Item>\n        ))}\n      </div>\n    </div>\n  );\n};\n\nexport default Marquees;\n"],"mappings":";;;;;;;;;AAiBA,MAAM,YAAY,EAChB,WACA,OACA,OACA,eAAe,MACf,WAAW,MACX,GAAG,YACQ;CACX,MAAM,CAAC,OAAO,YAAY,SACxB,QAED;CACD,MAAM,CAAC,SAAS,cAAc,SAAS,EAAE;CACzC,MAAM,CAAC,OAAO,YAAY,SAAS,MAAM;CAEzC,MAAM,iBAAiB,YAAY,OAAO,IAAI;CAE9C,MAAM,EAAE,MAAM,KAAK,kBAAkB,mBAAmC;CACxE,MAAM,eAAe,OAA8B,KAAK;CACxD,MAAM,mBAAmB,SAAgC;AACvD,eAAa,UAAU;AACvB,gBAAc,KAAK;;CAErB,MAAM,cAAc,eAChB;EACE,oBAAoB;AAClB,YAAS,KAAK;;EAEhB,oBAAoB;AAClB,YAAS,MAAM;;EAElB,GACD,EAAE;AAEN,iBAAgB;AACd,MAAI,CAAC,KAAK,SAAS,CAAC,aAAa,QAC/B;EAGF,MAAM,gBAAgB,iBAAiB,aAAa,QAAQ;AAI5D,cAHoB,WAAW,cAAc,YAAY,IAAI,MACxC,WAAW,cAAc,aAAa,IAAI,GAEzB;AAEtC,WAAS,KAAK,MAAM;IACnB,CAAC,KAAK,CAAC;AAEV,QACE,oBAAC;EACC,KAAK;EACL,WAAW,GACT,UAED;EACD,GAAI;EACJ,GAAI;YAEJ,oBAAC;GACC,WAAW,GACT,yBACA,mBACA,qBACA,aAED;GACD,OAAO,EACL,OACE,OAAO,mBAAmB,WACtB,iBAAiB,UACjB,gBACP;aAEA,OAAO,KAAK,EAAE,UAAU,KAAK,SAAS,GAAG,QAAmB,QAC3D,oBAAC;IAEC,OAAO;IACA;IACA;IACG;IACV,GAAI;IAEH;MAPI,WAAW,IAQX,CACP;IACE;GACF"}

package/dist/components/templates/layout/content.mjs

@@ -4,7 +4,7 @@ import { jsx } from "react/jsx-runtime";
 //#region src/components/templates/layout/content.tsx
 const Content = ({ children, className, ...props }) => {
 	return /* @__PURE__ */ jsx("main", {
-		className: cn("min-h-0 min-w-0 shrink grow basis-0", className),
+		className: cn("min-w-0 shrink grow basis-auto", className),
 		...props,
 		children
 	});

package/dist/components/templates/layout/content.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"content.mjs","names":[],"sources":["../../../../src/components/templates/layout/content.tsx"],"sourcesContent":["import { cn } from '@repo/ui/utils';\n\nexport interface Props extends React.ComponentPropsWithoutRef<'main'> {}\n\nconst Content = ({ children, className, ...props }: Props) => {\n  return (\n    <main\n      className={cn('min-h-0 min-w-0 shrink grow basis-0', className)}\n      {...props}\n    >\n      {children}\n    </main>\n  );\n};\n\nexport default Content;\n"],"mappings":";;;;AAIA,MAAM,WAAW,EAAE,UAAU,WAAW,GAAG,YAAmB;AAC5D,QACE,oBAAC;EACC,WAAW,GAAG,uCAAuC,UAAU;EAC/D,GAAI;EAEH;GACI"}
+{"version":3,"file":"content.mjs","names":[],"sources":["../../../../src/components/templates/layout/content.tsx"],"sourcesContent":["import { cn } from '@repo/ui/utils';\n\nexport interface Props extends React.ComponentPropsWithoutRef<'main'> {}\n\nconst Content = ({ children, className, ...props }: Props) => {\n  return (\n    <main\n      className={cn(\n        'min-w-0 shrink grow basis-auto',\n        // basis-auto (not basis-0) sizes Content from its actual content\n        // height first, so flex-grow only adds extra space when content is\n        // shorter than the viewport — when content is taller, Content\n        // keeps its natural (larger) height instead of clipping to\n        // available space and pushes Footer below it. min-h-0 is\n        // intentionally omitted here: with basis-auto, the default\n        // min-height:auto (content-based) is what makes that possible; on\n        // the Sider row's cross axis it's harmless since min-height there\n        // governs stretch, not main-axis growth.\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </main>\n  );\n};\n\nexport default Content;\n"],"mappings":";;;;AAIA,MAAM,WAAW,EAAE,UAAU,WAAW,GAAG,YAAmB;AAC5D,QACE,oBAAC;EACC,WAAW,GACT,kCAUA,UACD;EACD,GAAI;EAEH;GACI"}

package/dist/components/templates/layout/layout.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"layout.d.mts","names":[],"sources":["../../../../src/components/templates/layout/layout.tsx"],"mappings":";;;UAMiB,KAAA,SAAc,KAAA,CAAM,wBAAA;AAAA,cAO/B,MAAA;EAAU,QAAA;EAAA,SAAA;EAAA,GAAA;AAAA,GAAmC,KAAA,KAAK,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"layout.d.mts","names":[],"sources":["../../../../src/components/templates/layout/layout.tsx"],"mappings":";;;UAMiB,KAAA,SAAc,KAAA,CAAM,wBAAA;AAAA,cAS/B,MAAA;EAAU,QAAA;EAAA,SAAA;EAAA,GAAA;AAAA,GAAmC,KAAA,KAAK,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/templates/layout/layout.mjs

@@ -1,15 +1,21 @@
 import { cn } from "../../../utils.mjs";
 import Sider from "./sider.mjs";
-import { Children, isValidElement } from "react";
+import { Children, createContext, isValidElement, useContext } from "react";
 import { jsx } from "react/jsx-runtime";
 
 //#region src/components/templates/layout/layout.tsx
+const LayoutNestedContext = createContext(false);
 const hasSiderChild = (children) => Children.toArray(children).some((child) => isValidElement(child) && child.type === Sider);
 const Layout = ({ children, className, ...props }) => {
-	return /* @__PURE__ */ jsx("div", {
-		className: cn("flex min-h-0 w-full flex-1", hasSiderChild(children) ? "flex-row" : "flex-col", className),
-		...props,
-		children
+	const isNested = useContext(LayoutNestedContext);
+	const isRow = hasSiderChild(children);
+	return /* @__PURE__ */ jsx(LayoutNestedContext.Provider, {
+		value: true,
+		children: /* @__PURE__ */ jsx("div", {
+			className: cn("flex w-full flex-1", isNested ? "min-h-0" : "min-h-screen", isRow ? "flex-row" : "flex-col", className),
+			...props,
+			children
+		})
 	});
 };
 

package/dist/components/templates/layout/layout.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"layout.mjs","names":[],"sources":["../../../../src/components/templates/layout/layout.tsx"],"sourcesContent":["import { Children, isValidElement } from 'react';\n\nimport { cn } from '@repo/ui/utils';\n\nimport Sider from './sider';\n\nexport interface Props extends React.ComponentPropsWithoutRef<'div'> {}\n\nconst hasSiderChild = (children: React.ReactNode) =>\n  Children.toArray(children).some(\n    child => isValidElement(child) && child.type === Sider,\n  );\n\nconst Layout = ({ children, className, ...props }: Props) => {\n  const isRow = hasSiderChild(children);\n\n  return (\n    <div\n      className={cn(\n        'flex min-h-0 w-full flex-1',\n        isRow ? 'flex-row' : 'flex-col',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n};\n\nexport default Layout;\n"],"mappings":";;;;;;AAQA,MAAM,iBAAiB,aACrB,SAAS,QAAQ,SAAS,CAAC,MACzB,UAAS,eAAe,MAAM,IAAI,MAAM,SAAS,MAClD;AAEH,MAAM,UAAU,EAAE,UAAU,WAAW,GAAG,YAAmB;AAG3D,QACE,oBAAC;EACC,WAAW,GACT,8BALQ,cAAc,SAAS,GAMvB,aAAa,YACrB,UACD;EACD,GAAI;EAEH;GACG"}
+{"version":3,"file":"layout.mjs","names":[],"sources":["../../../../src/components/templates/layout/layout.tsx"],"sourcesContent":["import { Children, createContext, isValidElement, useContext } from 'react';\n\nimport { cn } from '@repo/ui/utils';\n\nimport Sider from './sider';\n\nexport interface Props extends React.ComponentPropsWithoutRef<'div'> {}\n\nconst LayoutNestedContext = createContext(false);\n\nconst hasSiderChild = (children: React.ReactNode) =>\n  Children.toArray(children).some(\n    child => isValidElement(child) && child.type === Sider,\n  );\n\nconst Layout = ({ children, className, ...props }: Props) => {\n  const isNested = useContext(LayoutNestedContext);\n  const isRow = hasSiderChild(children);\n\n  return (\n    <LayoutNestedContext.Provider value>\n      <div\n        className={cn(\n          'flex w-full flex-1',\n          // A nested Layout (the Sider row wrapper) must stay free to\n          // shrink/grow inside its parent's flex column, so it keeps\n          // min-h-0. The outermost Layout has no ancestor to size against,\n          // so it needs its own height anchor or flex-1/grow are no-ops\n          // and Content collapses under Footer.\n          isNested ? 'min-h-0' : 'min-h-screen',\n          isRow ? 'flex-row' : 'flex-col',\n          className,\n        )}\n        {...props}\n      >\n        {children}\n      </div>\n    </LayoutNestedContext.Provider>\n  );\n};\n\nexport default Layout;\n"],"mappings":";;;;;;AAQA,MAAM,sBAAsB,cAAc,MAAM;AAEhD,MAAM,iBAAiB,aACrB,SAAS,QAAQ,SAAS,CAAC,MACzB,UAAS,eAAe,MAAM,IAAI,MAAM,SAAS,MAClD;AAEH,MAAM,UAAU,EAAE,UAAU,WAAW,GAAG,YAAmB;CAC3D,MAAM,WAAW,WAAW,oBAAoB;CAChD,MAAM,QAAQ,cAAc,SAAS;AAErC,QACE,oBAAC,oBAAoB;EAAS;YAC5B,oBAAC;GACC,WAAW,GACT,sBAMA,WAAW,YAAY,gBACvB,QAAQ,aAAa,YACrB,UACD;GACD,GAAI;GAEH;IACG;GACuB"}

package/dist/core/button.d.mts

@@ -9,7 +9,7 @@ declare namespace button_d_exports {
 }
 declare const buttonVariants: (props?: ({
   variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
-  size?: "default" | "icon" | "xs" | "sm" | "lg" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
+  size?: "icon" | "default" | "xs" | "sm" | "lg" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
 } & class_variance_authority_types0.ClassProp) | undefined) => string;
 type Props = React$1.ComponentProps<'button'> & VariantProps<typeof buttonVariants> & {
   asChild?: boolean;

package/dist/style.css

@@ -522,6 +522,9 @@
   .min-h-16 {
     min-height: calc(var(--spacing) * 16);
   }
+  .min-h-screen {
+    min-height: 100vh;
+  }
   .w-3 {
     width: calc(var(--spacing) * 3);
   }
@@ -606,11 +609,14 @@
   .shrink-0 {
     flex-shrink: 0;
   }
+  .flex-grow {
+    flex-grow: 1;
+  }
   .grow {
     flex-grow: 1;
   }
-  .basis-0 {
-    flex-basis: calc(var(--spacing) * 0);
+  .basis-auto {
+    flex-basis: auto;
   }
   .origin-\(--radix-popover-content-transform-origin\) {
     transform-origin: var(--radix-popover-content-transform-origin);
@@ -1160,9 +1166,6 @@
     --tw-font-weight: var(--font-weight-semibold);
     font-weight: var(--font-weight-semibold);
   }
-  .text-nowrap {
-    text-wrap: nowrap;
-  }
   .break-all {
     word-break: break-all;
   }
@@ -1930,13 +1933,6 @@
       }
     }
   }
-  .hover\:bg-white {
-    &:hover {
-      @media (hover: hover) {
-        background-color: var(--color-white);
-      }
-    }
-  }
   .hover\:text-accent-foreground {
     &:hover {
       @media (hover: hover) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jbpark/ui-kit",
-  "version": "2.11.0",
+  "version": "2.11.3",
   "description": "Modern React UI component library built with TypeScript, Tailwind CSS, and Radix UI. Featuring atoms, molecules, organisms and layout templates for building beautiful interfaces.",
   "keywords": [
     "react",