torch-glare 2.3.0 → 2.4.1

package/docs/components/label-field.md

@@ -11,13 +11,22 @@ keywords: [label-field, form, input, label, required, field]
 
 ## Installation
 
-No external dependencies required.
+TORCH Glare is a copy-in library: the CLI copies this component's source into your project
+(you do **not** install it from the npm package). Run `init` once, then `add`:
+
+```bash
+npx torch-glare@latest init
+npx torch-glare@latest add LabelField
+```
+
+`add` also copies any components, hooks, and utilities that `LabelField` depends on.
 
 ## Import
 
-```typescript
-import { LabelField } from '@torch-ui/components'
-import type { LabelFieldProps } from '@torch-ui/components'
+Import from your project's local path — the alias configured in `glare.json` (e.g. `@/*`):
+
+```tsx
+import { LabelField } from "@/components/LabelField";
 ```
 
 ## Quick Examples
@@ -25,7 +34,7 @@ import type { LabelFieldProps } from '@torch-ui/components'
 ### Basic Usage
 
 ```typescript
-import { LabelField } from '@torch-ui/components'
+import { LabelField } from "@/components/LabelField";
 import { useState } from 'react'
 
 function Example() {
@@ -45,7 +54,7 @@ function Example() {
 ### With Required Indicator
 
 ```typescript
-import { LabelField } from '@torch-ui/components'
+import { LabelField } from "@/components/LabelField";
 
 function RequiredField() {
   return (
@@ -61,7 +70,7 @@ function RequiredField() {
 ### With Secondary Label
 
 ```typescript
-import { LabelField } from '@torch-ui/components'
+import { LabelField } from "@/components/LabelField";
 
 function WithSecondary() {
   return (
@@ -77,7 +86,7 @@ function WithSecondary() {
 ### With Error Message
 
 ```typescript
-import { LabelField } from '@torch-ui/components'
+import { LabelField } from "@/components/LabelField";
 import { useState } from 'react'
 
 function WithValidation() {
@@ -108,7 +117,7 @@ function WithValidation() {
 ### With Icon
 
 ```typescript
-import { LabelField } from '@torch-ui/components'
+import { LabelField } from "@/components/LabelField";
 
 function WithIcon() {
   return (
@@ -124,8 +133,8 @@ function WithIcon() {
 ### With Action Button
 
 ```typescript
-import { LabelField } from '@torch-ui/components'
-import { ActionButton } from '@torch-ui/components'
+import { LabelField } from "@/components/LabelField";
+import { ActionButton } from "@/components/ActionButton";
 import { useState } from 'react'
 
 function WithActionButton() {
@@ -151,7 +160,7 @@ function WithActionButton() {
 ### Horizontal Layout
 
 ```typescript
-import { LabelField } from '@torch-ui/components'
+import { LabelField } from "@/components/LabelField";
 
 function HorizontalLayout() {
   return (
@@ -168,7 +177,7 @@ function HorizontalLayout() {
 ### Different Sizes
 
 ```typescript
-import { LabelField } from '@torch-ui/components'
+import { LabelField } from "@/components/LabelField";
 
 function Sizes() {
   return (
@@ -192,8 +201,9 @@ function Sizes() {
 ### Registration Form
 
 ```typescript
-import { LabelField } from '@torch-ui/components'
-import { Button, PasswordLevel } from '@torch-ui/components'
+import { LabelField } from "@/components/LabelField";
+import { Button } from "@/components/Button";
+import { PasswordLevel } from "@/components/PasswordLevel";
 import { useState } from 'react'
 
 function RegistrationForm() {
@@ -281,7 +291,7 @@ function RegistrationForm() {
 ### With Popover Dropdown
 
 ```typescript
-import { LabelField } from '@torch-ui/components'
+import { LabelField } from "@/components/LabelField";
 import { useState } from 'react'
 
 function WithPopover() {
@@ -314,8 +324,8 @@ function WithPopover() {
 ### Profile Settings Form
 
 ```typescript
-import { LabelField } from '@torch-ui/components'
-import { Button } from '@torch-ui/components'
+import { LabelField } from "@/components/LabelField";
+import { Button } from "@/components/Button";
 import { useState } from 'react'
 
 function ProfileSettings() {
@@ -426,7 +436,7 @@ export const LabelField: React.ForwardRefExoticComponent<
 ### Usage with Types
 
 ```typescript
-import { LabelField } from '@torch-ui/components'
+import { LabelField } from "@/components/LabelField";
 import { useRef, useState } from 'react'
 
 function TypedExample() {
@@ -455,7 +465,7 @@ function TypedExample() {
 ### Form Field Wrapper Hook
 
 ```typescript
-import { LabelField } from '@torch-ui/components'
+import { LabelField } from "@/components/LabelField";
 import { useState, useCallback } from 'react'
 
 function useFormField(initialValue: string = '') {
@@ -526,7 +536,7 @@ function FormWithHook() {
 ### Reusable Form Fields
 
 ```typescript
-import { LabelField } from '@torch-ui/components'
+import { LabelField } from "@/components/LabelField";
 import { ComponentProps } from 'react'
 
 type FieldConfig = Omit<ComponentProps<typeof LabelField>, 'value' | 'onChange'> & {
@@ -580,7 +590,7 @@ function DynamicForm() {
 
 ```typescript
 import { render, screen, fireEvent } from '@testing-library/react'
-import { LabelField } from '@torch-ui/components'
+import { LabelField } from "@/components/LabelField";
 import userEvent from '@testing-library/user-event'
 
 describe('LabelField', () => {

package/docs/components/label.md

@@ -11,13 +11,22 @@ keywords: [label, form, input, required, text, typography]
 
 ## Installation
 
-No external dependencies required.
+TORCH Glare is a copy-in library: the CLI copies this component's source into your project
+(you do **not** install it from the npm package). Run `init` once, then `add`:
+
+```bash
+npx torch-glare@latest init
+npx torch-glare@latest add Label
+```
+
+`add` also copies any components, hooks, and utilities that `Label` depends on.
 
 ## Import
 
-```typescript
-import { Label } from '@torch-ui/components'
-import type { LabelProps } from '@torch-ui/components'
+Import from your project's local path — the alias configured in `glare.json` (e.g. `@/*`):
+
+```tsx
+import { Label } from "@/components/Label";
 ```
 
 ## Quick Examples
@@ -25,8 +34,8 @@ import type { LabelProps } from '@torch-ui/components'
 ### Basic Usage
 
 ```typescript
-import { Label } from '@torch-ui/components'
-import { InputField } from '@torch-ui/components'
+import { Label } from "@/components/Label";
+import { InputField } from "@/components/InputField";
 
 function Example() {
   return (
@@ -40,8 +49,8 @@ function Example() {
 ### With Required Indicator
 
 ```typescript
-import { Label } from '@torch-ui/components'
-import { InputField } from '@torch-ui/components'
+import { Label } from "@/components/Label";
+import { InputField } from "@/components/InputField";
 
 function RequiredField() {
   return (
@@ -58,8 +67,8 @@ function RequiredField() {
 ### With Secondary Label
 
 ```typescript
-import { Label } from '@torch-ui/components'
-import { InputField } from '@torch-ui/components'
+import { Label } from "@/components/Label";
+import { InputField } from "@/components/InputField";
 
 function WithSecondary() {
   return (
@@ -76,8 +85,8 @@ function WithSecondary() {
 ### All Labels Combined
 
 ```typescript
-import { Label } from '@torch-ui/components'
-import { InputField } from '@torch-ui/components'
+import { Label } from "@/components/Label";
+import { InputField } from "@/components/InputField";
 
 function AllLabels() {
   return (
@@ -95,8 +104,8 @@ function AllLabels() {
 ### Horizontal Layout
 
 ```typescript
-import { Label } from '@torch-ui/components'
-import { Switch } from '@torch-ui/components'
+import { Label } from "@/components/Label";
+import { Switch } from "@/components/Switch";
 
 function HorizontalLabel() {
   return (
@@ -113,8 +122,8 @@ function HorizontalLabel() {
 ### Vertical Label Direction
 
 ```typescript
-import { Label } from '@torch-ui/components'
-import { InputField } from '@torch-ui/components'
+import { Label } from "@/components/Label";
+import { InputField } from "@/components/InputField";
 
 function VerticalLabels() {
   return (
@@ -132,8 +141,8 @@ function VerticalLabels() {
 ### Reversed Children
 
 ```typescript
-import { Label } from '@torch-ui/components'
-import { Checkbox } from '@torch-ui/components'
+import { Label } from "@/components/Label";
+import { Checkbox } from "@/components/Checkbox";
 
 function ReversedLayout() {
   return (
@@ -151,8 +160,8 @@ function ReversedLayout() {
 ### Different Sizes
 
 ```typescript
-import { Label } from '@torch-ui/components'
-import { InputField } from '@torch-ui/components'
+import { Label } from "@/components/Label";
+import { InputField } from "@/components/InputField";
 
 function Sizes() {
   return (
@@ -176,8 +185,8 @@ function Sizes() {
 ### Style Variants
 
 ```typescript
-import { Label } from '@torch-ui/components'
-import { InputField } from '@torch-ui/components'
+import { Label } from "@/components/Label";
+import { InputField } from "@/components/InputField";
 
 function Variants() {
   return (
@@ -203,7 +212,7 @@ function Variants() {
 ### Polymorphic Rendering
 
 ```typescript
-import { Label } from '@torch-ui/components'
+import { Label } from "@/components/Label";
 
 function PolymorphicLabel() {
   return (
@@ -233,8 +242,9 @@ function PolymorphicLabel() {
 ### Form Example
 
 ```typescript
-import { Label } from '@torch-ui/components'
-import { InputField, Button } from '@torch-ui/components'
+import { Label } from "@/components/Label";
+import { Button } from "@/components/Button";
+import { InputField } from "@/components/InputField";
 import { useState } from 'react'
 
 function RegistrationForm() {
@@ -359,7 +369,7 @@ export const Label: React.ForwardRefExoticComponent<
 ### Usage with Types
 
 ```typescript
-import { Label } from '@torch-ui/components'
+import { Label } from "@/components/Label";
 import { useRef } from 'react'
 
 function TypedExample() {
@@ -387,8 +397,8 @@ function TypedExample() {
 ### Responsive Layout
 
 ```typescript
-import { Label } from '@torch-ui/components'
-import { InputField } from '@torch-ui/components'
+import { Label } from "@/components/Label";
+import { InputField } from "@/components/InputField";
 import { useState, useEffect } from 'react'
 
 function ResponsiveLabel() {
@@ -417,8 +427,9 @@ function ResponsiveLabel() {
 ### Dynamic Required State
 
 ```typescript
-import { Label } from '@torch-ui/components'
-import { InputField, Checkbox } from '@torch-ui/components'
+import { Label } from "@/components/Label";
+import { Checkbox } from "@/components/Checkbox";
+import { InputField } from "@/components/InputField";
 import { useState } from 'react'
 
 function DynamicRequired() {
@@ -452,7 +463,7 @@ function DynamicRequired() {
 ### Label Group Component
 
 ```typescript
-import { Label } from '@torch-ui/components'
+import { Label } from "@/components/Label";
 import { ReactNode } from 'react'
 
 interface LabelGroupProps {
@@ -508,7 +519,7 @@ function FormWithGroup() {
 
 ```typescript
 import { render, screen } from '@testing-library/react'
-import { Label } from '@torch-ui/components'
+import { Label } from "@/components/Label";
 
 describe('Label', () => {
   it('renders label text', () => {

package/docs/components/labeled-check-box.md

@@ -1,6 +1,6 @@
 ---
 name: LabeledCheckBox
-version: 1.1.15
+version: 2.4.0
 status: stable
 category: components/forms
 tags: [form, checkbox, label, selection, accessible, compound]
@@ -17,14 +17,22 @@ dependencies:
 
 ## Installation
 
+TORCH Glare is a copy-in library: the CLI copies this component's source into your project
+(you do **not** install it from the npm package). Run `init` once, then `add`:
+
 ```bash
-npm install torch-glare
+npx torch-glare@latest init
+npx torch-glare@latest add LabeledCheckBox
 ```
 
+`add` also copies any components, hooks, and utilities that `LabeledCheckBox` depends on.
+
 ## Import
 
-```typescript
-import { LabeledCheckBox } from 'torch-glare/lib/components/LabeledCheckBox'
+Import from your project's local path — the alias configured in `glare.json` (e.g. `@/*`):
+
+```tsx
+import { LabeledCheckBox } from "@/components/LabeledCheckBox";
 ```
 
 ## Quick Examples
@@ -32,7 +40,7 @@ import { LabeledCheckBox } from 'torch-glare/lib/components/LabeledCheckBox'
 ### Basic Usage
 
 ```typescript
-import { LabeledCheckBox } from 'torch-glare/lib/components/LabeledCheckBox'
+import { LabeledCheckBox } from '@/components/LabeledCheckBox'
 
 function Example() {
   const [checked, setChecked] = useState(false)
@@ -389,7 +397,7 @@ function EmailSubscriptions() {
 
 ```typescript
 import { render, screen, fireEvent } from '@testing-library/react'
-import { LabeledCheckBox } from 'torch-glare/lib/components/LabeledCheckBox'
+import { LabeledCheckBox } from '@/components/LabeledCheckBox'
 
 describe('LabeledCheckBox', () => {
   it('renders label and checkbox together', () => {
@@ -571,10 +579,10 @@ Note: Large size uses medium checkbox for visual balance.
 ```diff
 // Import path
 - import LabeledCheckBox from 'torch-glare/LabeledCheckBox'
-+ import { LabeledCheckBox } from 'torch-glare/lib/components/LabeledCheckBox'
++ import { LabeledCheckBox } from '@/components/LabeledCheckBox'
 
 // Size prop values
-- <LabeledCheckBox size="small" />
+- <LabeledCheckBox size="M" />
 + <LabeledCheckBox size="S" />
 ```
 

package/docs/components/labeled-radio.md

@@ -1,6 +1,6 @@
 ---
 name: LabeledRadio
-version: 1.1.15
+version: 2.4.0
 status: stable
 category: components/forms
 tags: [form, radio, label, selection, accessible, compound]
@@ -17,15 +17,22 @@ dependencies:
 
 ## Installation
 
+TORCH Glare is a copy-in library: the CLI copies this component's source into your project
+(you do **not** install it from the npm package). Run `init` once, then `add`:
+
 ```bash
-npm install torch-glare
+npx torch-glare@latest init
+npx torch-glare@latest add LabeledRadio
 ```
 
+`add` also copies any components, hooks, and utilities that `LabeledRadio` depends on.
+
 ## Import
 
-```typescript
-import { LabeledRadio } from 'torch-glare/lib/components/LabeledRadio'
-import { RadioGroup } from 'torch-glare/lib/components/Radio'
+Import from your project's local path — the alias configured in `glare.json` (e.g. `@/*`):
+
+```tsx
+import { LabeledRadio } from "@/components/LabeledRadio";
 ```
 
 ## Quick Examples
@@ -33,8 +40,8 @@ import { RadioGroup } from 'torch-glare/lib/components/Radio'
 ### Basic Usage
 
 ```typescript
-import { LabeledRadio } from 'torch-glare/lib/components/LabeledRadio'
-import { RadioGroup } from 'torch-glare/lib/components/Radio'
+import { LabeledRadio } from '@/components/LabeledRadio'
+import { RadioGroup } from '@/components/Radio'
 
 function Example() {
   const [selected, setSelected] = useState('option1')
@@ -503,8 +510,8 @@ function AccountTypeSelector() {
 
 ```typescript
 import { render, screen, fireEvent } from '@testing-library/react'
-import { LabeledRadio } from 'torch-glare/lib/components/LabeledRadio'
-import { RadioGroup } from 'torch-glare/lib/components/Radio'
+import { LabeledRadio } from '@/components/LabeledRadio'
+import { RadioGroup } from '@/components/Radio'
 
 describe('LabeledRadio', () => {
   it('renders label and radio together', () => {
@@ -723,10 +730,10 @@ Note: Large size uses medium radio for visual balance.
 ```diff
 // Import path
 - import LabeledRadio from 'torch-glare/LabeledRadio'
-+ import { LabeledRadio } from 'torch-glare/lib/components/LabeledRadio'
++ import { LabeledRadio } from '@/components/LabeledRadio'
 
 // Size prop values
-- <LabeledRadio size="small" />
+- <LabeledRadio size="M" />
 + <LabeledRadio size="S" />
 ```
 

package/docs/components/link-button.md

@@ -12,10 +12,16 @@ A stylized link button component featuring an animated arrow that appears on hov
 
 ## Installation
 
+TORCH Glare is a copy-in library: the CLI copies this component's source into your project
+(you do **not** install it from the npm package). Run `init` once, then `add`:
+
 ```bash
-npx torch-cli add link-button
+npx torch-glare@latest init
+npx torch-glare@latest add LinkButton
 ```
 
+`add` also copies any components, hooks, and utilities that `LinkButton` depends on.
+
 ## Imports
 
 ```typescript

package/docs/components/login-button.md

@@ -12,10 +12,16 @@ A specialized full-width button component designed specifically for authenticati
 
 ## Installation
 
+TORCH Glare is a copy-in library: the CLI copies this component's source into your project
+(you do **not** install it from the npm package). Run `init` once, then `add`:
+
 ```bash
-npx torch-cli add login-button
+npx torch-glare@latest init
+npx torch-glare@latest add LoginButton
 ```
 
+`add` also copies any components, hooks, and utilities that `LoginButton` depends on.
+
 ## Imports
 
 ```typescript
@@ -843,7 +849,7 @@ describe('LoginButton', () => {
 // Before: Material-UI Button
 <Button
   fullWidth
-  variant="contained"
+  variant="PrimeStyle"
   loading={isLoading}
 >
   Sign In