diff --git a/packages/ui/src/components/index.ts b/packages/ui/src/components/index.ts index 3705c14872..2646b14107 100644 --- a/packages/ui/src/components/index.ts +++ b/packages/ui/src/components/index.ts @@ -81,6 +81,8 @@ export { Sortable } from './composites/Sortable' /* Shadcn Primitive Components */ export * from './primitives/button' +export * from './primitives/checkbox' +export * from './primitives/combobox' export * from './primitives/command' export * from './primitives/dialog' export * from './primitives/popover' diff --git a/packages/ui/src/components/primitives/checkbox.tsx b/packages/ui/src/components/primitives/checkbox.tsx index c3817d5610..34f374fec4 100644 --- a/packages/ui/src/components/primitives/checkbox.tsx +++ b/packages/ui/src/components/primitives/checkbox.tsx @@ -4,6 +4,8 @@ import { cva, type VariantProps } from 'class-variance-authority' import { CheckIcon } from 'lucide-react' import * as React from 'react' +export type CheckedState = CheckboxPrimitive.CheckedState + const checkboxVariants = cva( cn( 'aspect-square shrink-0 rounded-[4px] border transition-all outline-none', diff --git a/packages/ui/stories/components/primitives/Checkbox.stories.tsx b/packages/ui/stories/components/primitives/Checkbox.stories.tsx index be48f82af6..3705fabeaa 100644 --- a/packages/ui/stories/components/primitives/Checkbox.stories.tsx +++ b/packages/ui/stories/components/primitives/Checkbox.stories.tsx @@ -2,7 +2,7 @@ import type { Meta, StoryObj } from '@storybook/react' import { Bell, Check, FileText, Mail, Shield, Star } from 'lucide-react' import { useState } from 'react' -import { Checkbox } from '../../../src/components/primitives/checkbox' +import { Checkbox, type CheckedState } from '../../../src/components/primitives/checkbox' const meta: Meta = { title: 'Components/Primitives/Checkbox', @@ -111,7 +111,7 @@ export const Disabled: Story = { // Controlled export const Controlled: Story = { render: function ControlledExample() { - const [checked, setChecked] = useState(false) + const [checked, setChecked] = useState(false) return (
@@ -191,8 +191,8 @@ export const Sizes: Story = { // All States export const AllStates: Story = { render: function AllStatesExample() { - const [normalChecked, setNormalChecked] = useState(false) - const [checkedState, setCheckedState] = useState(true) + const [normalChecked, setNormalChecked] = useState(false) + const [checkedState, setCheckedState] = useState(true) return (
@@ -524,7 +524,7 @@ export const FormExample: Story = { Register - {submitted && (formData.terms && formData.privacy) && ( + {submitted && formData.terms && formData.privacy && (

Registration successful!

)}