Skip to content

Commit 7b63af4

Browse files
Ohh-889Ohh-889
committed
feat: update assets
1 parent e9ccd91 commit 7b63af4

File tree

5 files changed

+322
-6
lines changed

5 files changed

+322
-6
lines changed

‎packages/ui/registry.json‎

Lines changed: 144 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1194,6 +1194,53 @@
11941194
"title": "Input",
11951195
"type": "registry:block"
11961196
},
1197+
{
1198+
"files": [
1199+
{
1200+
"path": "src/components/input-otp/InputOTP.tsx",
1201+
"target": "components/input-otp/InputOTP.tsx",
1202+
"type": "registry:ui"
1203+
},
1204+
{
1205+
"path": "src/components/input-otp/InputOTPGroup.tsx",
1206+
"target": "components/input-otp/InputOTPGroup.tsx",
1207+
"type": "registry:ui"
1208+
},
1209+
{
1210+
"path": "src/components/input-otp/InputOTPSeparator.tsx",
1211+
"target": "components/input-otp/InputOTPSeparator.tsx",
1212+
"type": "registry:ui"
1213+
},
1214+
{
1215+
"path": "src/components/input-otp/InputOTPSlot.tsx",
1216+
"target": "components/input-otp/InputOTPSlot.tsx",
1217+
"type": "registry:ui"
1218+
},
1219+
{
1220+
"path": "src/components/input-otp/InputOtpRoot.tsx",
1221+
"target": "components/input-otp/InputOtpRoot.tsx",
1222+
"type": "registry:ui"
1223+
},
1224+
{
1225+
"path": "src/components/input-otp/index.ts",
1226+
"target": "components/input-otp/index.ts",
1227+
"type": "registry:ui"
1228+
},
1229+
{
1230+
"path": "src/components/input-otp/input-otp-variants.ts",
1231+
"target": "components/input-otp/input-otp-variants.ts",
1232+
"type": "registry:ui"
1233+
},
1234+
{
1235+
"path": "src/components/input-otp/types.ts",
1236+
"target": "components/input-otp/types.ts",
1237+
"type": "registry:ui"
1238+
}
1239+
],
1240+
"name": "input-otp",
1241+
"title": "Input Otp",
1242+
"type": "registry:block"
1243+
},
11971244
{
11981245
"files": [
11991246
{
@@ -1435,6 +1482,11 @@
14351482
},
14361483
{
14371484
"files": [
1485+
{
1486+
"path": "src/components/navigation-menu/NavigationMenu.tsx",
1487+
"target": "components/navigation-menu/NavigationMenu.tsx",
1488+
"type": "registry:ui"
1489+
},
14381490
{
14391491
"path": "src/components/navigation-menu/NavigationMenuChildLink.tsx",
14401492
"target": "components/navigation-menu/NavigationMenuChildLink.tsx",
@@ -1450,6 +1502,51 @@
14501502
"target": "components/navigation-menu/NavigationMenuChildListItem.tsx",
14511503
"type": "registry:ui"
14521504
},
1505+
{
1506+
"path": "src/components/navigation-menu/NavigationMenuContent.tsx",
1507+
"target": "components/navigation-menu/NavigationMenuContent.tsx",
1508+
"type": "registry:ui"
1509+
},
1510+
{
1511+
"path": "src/components/navigation-menu/NavigationMenuIndicator.tsx",
1512+
"target": "components/navigation-menu/NavigationMenuIndicator.tsx",
1513+
"type": "registry:ui"
1514+
},
1515+
{
1516+
"path": "src/components/navigation-menu/NavigationMenuItem.tsx",
1517+
"target": "components/navigation-menu/NavigationMenuItem.tsx",
1518+
"type": "registry:ui"
1519+
},
1520+
{
1521+
"path": "src/components/navigation-menu/NavigationMenuLink.tsx",
1522+
"target": "components/navigation-menu/NavigationMenuLink.tsx",
1523+
"type": "registry:ui"
1524+
},
1525+
{
1526+
"path": "src/components/navigation-menu/NavigationMenuList.tsx",
1527+
"target": "components/navigation-menu/NavigationMenuList.tsx",
1528+
"type": "registry:ui"
1529+
},
1530+
{
1531+
"path": "src/components/navigation-menu/NavigationMenuRoot.tsx",
1532+
"target": "components/navigation-menu/NavigationMenuRoot.tsx",
1533+
"type": "registry:ui"
1534+
},
1535+
{
1536+
"path": "src/components/navigation-menu/NavigationMenuTrigger.tsx",
1537+
"target": "components/navigation-menu/NavigationMenuTrigger.tsx",
1538+
"type": "registry:ui"
1539+
},
1540+
{
1541+
"path": "src/components/navigation-menu/NavigationMenuViewport.tsx",
1542+
"target": "components/navigation-menu/NavigationMenuViewport.tsx",
1543+
"type": "registry:ui"
1544+
},
1545+
{
1546+
"path": "src/components/navigation-menu/index.ts",
1547+
"target": "components/navigation-menu/index.ts",
1548+
"type": "registry:ui"
1549+
},
14531550
{
14541551
"path": "src/components/navigation-menu/navigation-menu.ts",
14551552
"target": "components/navigation-menu/navigation-menu.ts",
@@ -1629,6 +1726,53 @@
16291726
"title": "Skeleton",
16301727
"type": "registry:block"
16311728
},
1729+
{
1730+
"files": [
1731+
{
1732+
"path": "src/components/slider/Slider.tsx",
1733+
"target": "components/slider/Slider.tsx",
1734+
"type": "registry:ui"
1735+
},
1736+
{
1737+
"path": "src/components/slider/SliderRange.tsx",
1738+
"target": "components/slider/SliderRange.tsx",
1739+
"type": "registry:ui"
1740+
},
1741+
{
1742+
"path": "src/components/slider/SliderRoot.tsx",
1743+
"target": "components/slider/SliderRoot.tsx",
1744+
"type": "registry:ui"
1745+
},
1746+
{
1747+
"path": "src/components/slider/SliderThumb.tsx",
1748+
"target": "components/slider/SliderThumb.tsx",
1749+
"type": "registry:ui"
1750+
},
1751+
{
1752+
"path": "src/components/slider/SliderTrack.tsx",
1753+
"target": "components/slider/SliderTrack.tsx",
1754+
"type": "registry:ui"
1755+
},
1756+
{
1757+
"path": "src/components/slider/index.ts",
1758+
"target": "components/slider/index.ts",
1759+
"type": "registry:ui"
1760+
},
1761+
{
1762+
"path": "src/components/slider/slider-variants.ts",
1763+
"target": "components/slider/slider-variants.ts",
1764+
"type": "registry:ui"
1765+
},
1766+
{
1767+
"path": "src/components/slider/types.ts",
1768+
"target": "components/slider/types.ts",
1769+
"type": "registry:ui"
1770+
}
1771+
],
1772+
"name": "slider",
1773+
"title": "Slider",
1774+
"type": "registry:block"
1775+
},
16321776
{
16331777
"files": [
16341778
{

‎packages/ui/src/components/input-otp/InputOTPSlot.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ const InputOTPSlot = (props: InputOTPSlotProps) => {
3030
data-slot="input-otp-slot"
3131
{...rest}
3232
>
33-
{mask ? '●' : char}
33+
{mask && char ? '●' : char}
3434

3535
{hasFakeCaret && (
3636
<div className="pointer-events-none absolute inset-0 flex items-center justify-center">

‎playground/public/r/input-otp.json‎

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
{
2+
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
3+
"name": "input-otp",
4+
"type": "registry:block",
5+
"title": "Input Otp",
6+
"files": [
7+
{
8+
"path": "src/components/input-otp/InputOTP.tsx",
9+
"content": "import type { ComponentRef } from 'react';\nimport { Fragment, forwardRef } from 'react';\n\nimport InputOTPGroup from './InputOTPGroup';\nimport InputOTPSeparator from './InputOTPSeparator';\nimport InputOTPSlot from './InputOTPSlot';\nimport InputOtpRoot from './InputOtpRoot';\nimport type { InputOTPProps } from './types';\n\nconst InputOTP = forwardRef<ComponentRef<typeof InputOtpRoot>, InputOTPProps>((props, ref) => {\n const { className, classNames, inputCount = 6, mask, separator, size, ...rest } = props;\n\n const isSeparator = Boolean(separator);\n\n return (\n <InputOtpRoot\n className={className || classNames?.root}\n maxLength={inputCount}\n ref={ref}\n {...rest}\n >\n <InputOTPGroup\n className={classNames?.group}\n separate={isSeparator}\n size={size}\n >\n {Array.from({ length: inputCount }).map((_, index) => (\n <Fragment key={String(index)}>\n <InputOTPSlot\n className={classNames?.input}\n index={index}\n mask={mask}\n separate={isSeparator}\n size={size}\n />\n\n {isSeparator && index !== inputCount - 1 && (\n <InputOTPSeparator\n className={classNames?.separator}\n size={size}\n >\n {separator}\n </InputOTPSeparator>\n )}\n </Fragment>\n ))}\n </InputOTPGroup>\n </InputOtpRoot>\n );\n});\n\nInputOTP.displayName = 'InputOTP';\n\nexport default InputOTP;\n",
10+
"type": "registry:ui",
11+
"target": "components/input-otp/InputOTP.tsx"
12+
},
13+
{
14+
"path": "src/components/input-otp/InputOTPGroup.tsx",
15+
"content": "import { cn } from '@/lib/utils';\n\nimport { inputOTPVariants } from './input-otp-variants';\nimport type { InputOTPGroupProps } from './types';\n\nconst InputOTPGroup = (props: InputOTPGroupProps) => {\n const { className, separate, size, ...rest } = props;\n\n const { group } = inputOTPVariants({ separate, size });\n\n const mergedCls = cn(group(), className);\n\n return (\n <div\n className={mergedCls}\n data-separate={separate}\n data-size={size}\n data-slot=\"input-otp-group\"\n {...rest}\n />\n );\n};\n\nexport default InputOTPGroup;\n",
16+
"type": "registry:ui",
17+
"target": "components/input-otp/InputOTPGroup.tsx"
18+
},
19+
{
20+
"path": "src/components/input-otp/InputOTPSeparator.tsx",
21+
"content": "import { Minus } from 'lucide-react';\n\nimport { cn } from '@/lib/utils';\n\nimport { inputOTPVariants } from './input-otp-variants';\nimport type { InputOTPSeparatorProps } from './types';\n\nconst InputOTPSeparator = (props: InputOTPSeparatorProps) => {\n const { children, className, size, ...rest } = props;\n\n const { separator } = inputOTPVariants({ size });\n\n const mergedCls = cn(separator(), className);\n\n return (\n <div\n className={mergedCls}\n data-size={size}\n data-slot=\"input-otp-separator\"\n {...rest}\n >\n {children || <Minus />}\n </div>\n );\n};\n\nexport default InputOTPSeparator;\n",
22+
"type": "registry:ui",
23+
"target": "components/input-otp/InputOTPSeparator.tsx"
24+
},
25+
{
26+
"path": "src/components/input-otp/InputOTPSlot.tsx",
27+
"content": "'use client';\n\nimport { OTPInputContext } from 'input-otp';\nimport { useContext } from 'react';\n\nimport { cn } from '@/lib/utils';\n\nimport { inputOTPVariants } from './input-otp-variants';\nimport type { InputOTPSlotProps } from './types';\n\nconst InputOTPSlot = (props: InputOTPSlotProps) => {\n const { className, index, mask, separate, size, ...rest } = props;\n\n const inputOTPContext = useContext(OTPInputContext);\n\n const { char, hasFakeCaret, isActive } = inputOTPContext.slots[index];\n\n const { input } = inputOTPVariants({ isActive, separate, size });\n\n const mergedCls = cn(input(), className);\n\n return (\n <div\n className={mergedCls}\n data-has-fake-caret={hasFakeCaret}\n data-index={index}\n data-is-active={isActive}\n data-separate={separate}\n data-size={size}\n data-slot=\"input-otp-slot\"\n {...rest}\n >\n {mask ? '●' : char}\n\n {hasFakeCaret && (\n <div className=\"pointer-events-none absolute inset-0 flex items-center justify-center\">\n <div className=\"h-4 w-px animate-caret-blink bg-foreground duration-1000\" />\n </div>\n )}\n </div>\n );\n};\n\nexport default InputOTPSlot;\n",
28+
"type": "registry:ui",
29+
"target": "components/input-otp/InputOTPSlot.tsx"
30+
},
31+
{
32+
"path": "src/components/input-otp/InputOtpRoot.tsx",
33+
"content": "'use client';\n\nimport { OTPInput } from 'input-otp';\nimport { type ComponentRef, forwardRef } from 'react';\n\nimport { cn } from '@/lib/utils';\n\nimport { inputOTPVariants } from './input-otp-variants';\nimport type { InputOTPRootProps } from './types';\n\nconst InputOtpRoot = forwardRef<ComponentRef<typeof OTPInput>, InputOTPRootProps>((props, ref) => {\n const { className, size: _, ...rest } = props;\n\n const { root } = inputOTPVariants();\n\n const mergedCls = cn(root(), className);\n\n return (\n <OTPInput\n className={mergedCls}\n data-slot=\"input-otp-root\"\n ref={ref}\n {...rest}\n />\n );\n});\n\nInputOtpRoot.displayName = 'InputOtpRoot';\n\nexport default InputOtpRoot;\n",
34+
"type": "registry:ui",
35+
"target": "components/input-otp/InputOtpRoot.tsx"
36+
},
37+
{
38+
"path": "src/components/input-otp/index.ts",
39+
"content": "export { default as InputOTP } from './InputOTP';\nexport { default as InputOTPGroup } from './InputOTPGroup';\nexport { default as InputOtpRoot } from './InputOtpRoot';\nexport { default as InputOTPSeparator } from './InputOTPSeparator';\nexport { default as InputOTPSlot } from './InputOTPSlot';\n\nexport * from './types';\n",
40+
"type": "registry:ui",
41+
"target": "components/input-otp/index.ts"
42+
},
43+
{
44+
"path": "src/components/input-otp/input-otp-variants.ts",
45+
"content": "import { tv } from 'tailwind-variants';\n\nexport const inputOTPVariants = tv({\n compoundVariants: [\n {\n class: {\n group: 'gap-0.75'\n },\n separate: true,\n size: 'xs'\n },\n {\n class: {\n group: 'gap-1'\n },\n separate: true,\n size: 'sm'\n },\n {\n class: {\n group: 'gap-1.25'\n },\n separate: true,\n size: 'lg'\n },\n {\n class: {\n group: 'gap-1.5'\n },\n separate: true,\n size: 'xl'\n },\n {\n class: {\n group: 'gap-1.75'\n },\n separate: true,\n size: '2xl'\n }\n ],\n defaultVariants: {\n separate: false,\n size: 'md'\n },\n slots: {\n group: 'flex items-center disabled:opacity-50 has-[:disabled]:opacity-50',\n input: [\n `relative flex items-center justify-center text-center border-y border-r border-solid border-input bg-background transition-all duration-200`,\n `focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-offset-background focus-visible:ring-primary focus-visible:z-2`,\n `disabled:cursor-not-allowed disabled:opacity-50`\n ],\n root: `flex items-center disabled:cursor-not-allowed`,\n separator: `text-muted-foreground`\n },\n variants: {\n isActive: {\n true: {\n input: `z-10 ring-1 ring-ring`\n }\n },\n separate: {\n false: {\n input: `first:rounded-l-md first:border-l last:rounded-r-md`\n },\n true: {\n group: `gap-1`,\n input: `rounded-md border`\n }\n },\n size: {\n '2xl': {\n input: `h-12 w-12 text-xl`,\n separator: `text-xl`\n },\n lg: {\n input: `h-9 w-9 text-base`,\n separator: `text-base`\n },\n md: {\n input: `h-8 w-8 text-sm`,\n separator: `text-sm`\n },\n sm: {\n input: `h-7 w-7 text-xs`,\n separator: `text-xs`\n },\n xl: {\n input: `h-10 w-10 text-lg`,\n separator: `text-lg`\n },\n xs: {\n input: `h-6 w-6 text-2xs`,\n separator: `text-2xs`\n }\n }\n }\n});\n\nexport type InputOTPSlots = keyof typeof inputOTPVariants.slots;\n",
46+
"type": "registry:ui",
47+
"target": "components/input-otp/input-otp-variants.ts"
48+
},
49+
{
50+
"path": "src/components/input-otp/types.ts",
51+
"content": "import type { RenderProps } from 'input-otp';\n\nimport type { BaseComponentProps, ClassValue, ThemeSize } from '@/types/other';\n\nimport type { InputOTPSlots } from './input-otp-variants';\n\ntype OverrideProps<T, R> = Omit<T, keyof R> & R;\n\ntype OTPInputRootBaseProps = OverrideProps<\n React.InputHTMLAttributes<HTMLInputElement>,\n {\n className?: ClassValue;\n containerClassName?: string;\n maxLength: number;\n noScriptCSSFallback?: string | null;\n onChange?: (newValue: string) => unknown;\n onComplete?: (...args: any[]) => unknown;\n pasteTransformer?: (pasted: string) => string;\n pushPasswordManagerStrategy?: 'increase-width' | 'none';\n size?: ThemeSize;\n textAlign?: 'center' | 'left' | 'right';\n value?: string;\n }\n>;\n\ntype InputOTPRenderFn = (props: RenderProps) => React.ReactNode;\n\nexport type InputOTPGroupProps = BaseComponentProps<'div'> & {\n separate?: boolean;\n};\n\nexport type InputOTPRootProps = OTPInputRootBaseProps &\n (\n | {\n children?: never;\n render: InputOTPRenderFn;\n }\n | {\n children: React.ReactNode;\n render?: never;\n }\n );\n\nexport interface InputOTPSeparatorProps extends BaseComponentProps<'div'> {}\n\nexport interface InputOTPSlotProps extends BaseComponentProps<'div'> {\n index: number;\n mask?: boolean;\n separate?: boolean;\n}\n\nexport type InputOTPClassNames = Partial<Record<InputOTPSlots, ClassValue>>;\n\nexport type InputOTPProps = Omit<OTPInputRootBaseProps, 'maxLength' | 'separate'> & {\n classNames?: InputOTPClassNames;\n inputCount?: number;\n mask?: boolean;\n separator?: React.ReactNode | true;\n size?: ThemeSize;\n};\n",
52+
"type": "registry:ui",
53+
"target": "components/input-otp/types.ts"
54+
}
55+
]
56+
}

0 commit comments

Comments
 (0)