<!-- source-hash: 6fc9c281d1bf67add13a5a334f1d1bf3 -->
Storybook stories for the `DeviceCardCompact` component, providing interactive documentation and visual test cases for its compact device card variant used in table cells.

## Key Components

| Export | Type | Description |
|--------|------|-------------|
| `Default` | `Story` | Both `deviceName` and `organization` populated |
| `NameOnly` | `Story` | Only `deviceName` provided |
| `OrganizationOnly` | `Story` | Only `organization` provided |
| `Empty` | `Story` | No props — renders empty fragment |
| `NullValues` | `Story` | Explicit `null` props — renders empty fragment |
| `DashValues` | `Story` | Dash placeholder (`"-"`) props — renders empty fragment |
| `StringNullValues` | `Story` | String `"null"` props — renders empty fragment |
| `LongName` | `Story` | Truncation behavior with long strings |
| `InTableContext` | `Story` | Multiple stacked cards simulating a table column |

## Usage Example

```typescript
import { DeviceCardCompact } from '../components/ui/device-card-compact'

// Typical table cell usage
<DeviceCardCompact
  deviceName="MacBook Pro"
  organization="Engineering Team"
/>

// Name only — organization row is omitted
<DeviceCardCompact deviceName="Dell XPS 15" />

// Gracefully handles empty/null/dash/string-null values
<DeviceCardCompact deviceName={null} organization="-" />
// → renders nothing (empty fragment)
```

## Notes

- The meta decorator wraps every story in a `300px` container to simulate a realistic table cell width.
- `InTableContext` overrides the decorator to render a full bordered list of four cards, demonstrating stacked row rendering.
- `argTypes` exposes `deviceName` and `organization` as text controls in the Storybook UI for live editing.