@jbpark/ui-kit 2.11.0 → 2.11.2

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/skeleton/skeleton.mjs

@@ -15,7 +15,10 @@ const SIZES = {
 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;
 	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;\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;AAGT,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/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/badge.d.mts

@@ -8,7 +8,7 @@ declare namespace badge_d_exports {
   export { Badge, Props, badgeVariants };
 }
 declare const badgeVariants: (props?: ({
-  variant?: "default" | "destructive" | "outline" | "secondary" | null | undefined;
+  variant?: "default" | "secondary" | "destructive" | "outline" | null | undefined;
 } & class_variance_authority_types0.ClassProp) | undefined) => string;
 type Props = React$1.ComponentProps<'span'> & VariantProps<typeof badgeVariants> & {
   asChild?: boolean;

package/dist/core/button.d.mts

@@ -8,7 +8,7 @@ declare namespace button_d_exports {
   export { Button, Props, buttonVariants };
 }
 declare const buttonVariants: (props?: ({
-  variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
+  variant?: "link" | "default" | "secondary" | "destructive" | "outline" | "ghost" | null | undefined;
   size?: "default" | "icon" | "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> & {

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);
   }
@@ -1160,9 +1163,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 +1930,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.2",
   "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",