bytelyst/learning_ai_common_plat
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
a55b819533
learning_ai_common_plat/packages/ui/src/components
History
saravanakumardb1 a55b819533 feat(ui): @bytelyst/ui@0.2.0 — Skeleton/SkeletonGroup/LoadingDots/SearchInput 
Wave 9.D additions to the shared UI primitive package.

──────────────────────────────────────────────────────────────────
Skeleton — `card` shape added + new <SkeletonGroup> orchestrator
──────────────────────────────────────────────────────────────────
  packages/ui/src/components/Skeleton.tsx

  - 4 shape variants: text / block / circle / **card**
    The `card` variant uses min-h-32 + rounded-2xl + a subtle
    border so a real <Card> can swap in without CLS.
  - New <SkeletonGroup loading fallback>{children}</SkeletonGroup>
    component handles the fade-out → content swap centrally. Use
    one per loadable region rather than sprinkling <Skeleton/>
    everywhere. Supports `keepContent` for re-fetch flows.
  - In-source TODO #2 marker for the pending vitest setup.

──────────────────────────────────────────────────────────────────
LoadingDots — three-dot inline pulse
──────────────────────────────────────────────────────────────────
  packages/ui/src/components/LoadingDots.tsx  (new)

  - sm / md / lg sizes
  - `color` override, defaults to var(--bl-accent)
  - motion-safe:animate-bounce respects prefers-reduced-motion
  - role="status" + sr-only label for screen readers
  - inline-flex layout — composes inside chat bubbles + buttons

──────────────────────────────────────────────────────────────────
SearchInput — themed search field with suggestions slot
──────────────────────────────────────────────────────────────────
  packages/ui/src/components/SearchInput.tsx  (new)

  - Leading Search icon + clear-x button (visible while value !== '')
  - role="searchbox", proper aria-label fallback to placeholder
  - 3 size scales matching ButtonSize convention
  - `suggestions` slot for typeahead lists below
  - Forwards ref to <input> for imperative focus
  - Consolidates the bespoke search-field pattern from notes,
    fastgap, voice, jarvisjr (roadmap §2.2).

──────────────────────────────────────────────────────────────────
Package hygiene
──────────────────────────────────────────────────────────────────
  - package.json: 0.1.11 → 0.2.0
  - tsconfig.json: added DOM + DOM.Iterable libs to match
    motion/data-viz packages (required for e.target.value typing)
  - src/index.ts: exported SkeletonGroup, LoadingDots, SearchInput

──────────────────────────────────────────────────────────────────
Quality gates
──────────────────────────────────────────────────────────────────
  ✓ tsc --noEmit clean
  ✓ tsc build clean (no errors)
  ✓ No regression to existing ui exports

──────────────────────────────────────────────────────────────────
Roadmap tracker — 5 boxes flipped (§11)
──────────────────────────────────────────────────────────────────
  9.D.1  Skeleton extended with card shape
  9.D.2  SkeletonGroup orchestrator
  9.D.3  EmptyState verified (already shipped in 0.1.x)
  9.D.4  SearchInput added
  9.D.6  LoadingDots added + LoadingSpinner verified

§11.2 counter rewrote by scripts/count-roadmap-progress.ts:
  Wave 9 Data: 0/42 → 5/42 (12%)
  TOTAL:       5/202 → 10/202 (5%)

Open TODOs (§11.2.A):
  #2  Add vitest + happy-dom + @testing-library/react to
      @bytelyst/ui devDeps; write unit tests for the new
      Skeleton/SkeletonGroup/LoadingDots/SearchInput surfaces.
  #4  Republish @bytelyst/ui@0.2.0 to Gitea registry once #1
      (publish workflow) closes.

Showcase demos for these primitives land in the next showcase
commit (9.D.7–9.D.9).
2026-05-27 15:45:44 -07:00
..
ActionMenu.tsx feat(ui): add operational workflow primitives 2026-05-08 21:16:48 -07:00
AlertBanner.tsx feat(ui): add operational workflow primitives 2026-05-08 21:16:48 -07:00
AppShell.tsx fix(ui): make app shell server compatible 2026-05-06 18:09:54 -07:00
Badge.stories.tsx test(ui): add primitive story coverage 2026-05-06 11:30:51 -07:00
Badge.tsx feat(ui): add product-safe primitive variants 2026-05-06 11:20:33 -07:00
Button.stories.tsx test(ui): add primitive story coverage 2026-05-06 11:30:51 -07:00
Button.tsx Improve shared UI primitives 2026-05-08 20:56:05 -07:00
Card.stories.tsx test(ui): add primitive story coverage 2026-05-06 11:30:51 -07:00
Card.tsx Improve shared UI primitives 2026-05-08 20:56:05 -07:00
CardButton.tsx feat(ui): add <CardButton> primitive (UI audit Pattern A fix) 2026-05-10 09:31:29 +00:00
Checkbox.tsx feat(ui): add accessible control primitives 2026-05-06 11:25:26 -07:00
ConfirmDialog.tsx fix(ui): use tokenized status colors 2026-05-06 11:15:29 -07:00
Controls.stories.tsx test(ui): add primitive story coverage 2026-05-06 11:30:51 -07:00
DataList.tsx feat(ui): add data display primitives 2026-05-06 11:27:51 -07:00
DataTable.tsx Improve shared UI primitives 2026-05-08 20:56:05 -07:00
DiffCard.tsx feat(ui): add operational core primitives 2026-05-06 11:10:08 -07:00
Drawer.tsx feat(ui): add operational workflow primitives 2026-05-08 21:16:48 -07:00
DropdownMenu.tsx feat(ui): add accessible control primitives 2026-05-06 11:25:26 -07:00
EmptyState.tsx Improve shared UI primitives 2026-05-08 20:56:05 -07:00
EntityCard.tsx feat(ui): add operational workflow primitives 2026-05-08 21:16:48 -07:00
Field.tsx Improve shared UI primitives 2026-05-08 20:56:05 -07:00
FieldGrid.tsx feat(ui): add operational workflow primitives 2026-05-08 21:16:48 -07:00
FilterBar.tsx feat(ui): add operational workflow primitives 2026-05-08 21:16:48 -07:00
FormSection.tsx feat(ui): add operational workflow primitives 2026-05-08 21:16:48 -07:00
IconButton.tsx feat(ui): add operational core primitives 2026-05-06 11:10:08 -07:00
Input.stories.tsx feat(ui): add Storybook for @bytelyst/ui component library 2026-03-28 00:59:25 -07:00
Input.tsx Improve shared UI primitives 2026-05-08 20:56:05 -07:00
Label.tsx feat(ui): add Input, Textarea, Card, Label, Select, Separator components to @bytelyst/ui 2026-03-28 00:33:38 -07:00
ListItemButton.tsx feat(ui): add operational core primitives 2026-05-06 11:10:08 -07:00
LoadingDots.tsx feat(ui): @bytelyst/ui@0.2.0 — Skeleton/SkeletonGroup/LoadingDots/SearchInput 2026-05-27 15:45:44 -07:00
LoadingSpinner.tsx feat(ui): add Sidebar, StatCard, LoadingSpinner components + README docs — Level 3 component coverage 2026-03-29 00:19:45 -07:00
MetricCard.tsx feat(ui): add operational workflow primitives 2026-05-08 21:16:48 -07:00
Modal.tsx feat(ui): create @bytelyst/ui with Button, Toast, Modal, ConfirmDialog, Badge, EmptyState 2026-03-27 16:29:37 -07:00
OperationalPreview.stories.tsx docs(ui): add launch state matrix story 2026-05-09 02:16:57 -07:00
OperationalPrimitives.stories.tsx test(ui): add primitive story coverage 2026-05-06 11:30:51 -07:00
PageHeader.tsx feat(ui): add operational workflow primitives 2026-05-08 21:16:48 -07:00
Panel.tsx Improve shared UI primitives 2026-05-08 20:56:05 -07:00
RadioGroup.tsx feat(ui): add accessible control primitives 2026-05-06 11:25:26 -07:00
SearchInput.tsx feat(ui): @bytelyst/ui@0.2.0 — Skeleton/SkeletonGroup/LoadingDots/SearchInput 2026-05-27 15:45:44 -07:00
Section.tsx feat(ui): add operational workflow primitives 2026-05-08 21:16:48 -07:00
SegmentedControl.tsx feat(ui): add accessible control primitives 2026-05-06 11:25:26 -07:00
Select.tsx Improve shared UI primitives 2026-05-08 20:56:05 -07:00
Separator.tsx feat(ui): add Input, Textarea, Card, Label, Select, Separator components to @bytelyst/ui 2026-03-28 00:33:38 -07:00
Sidebar.tsx feat(ui): add Sidebar, StatCard, LoadingSpinner components + README docs — Level 3 component coverage 2026-03-29 00:19:45 -07:00
Skeleton.tsx feat(ui): @bytelyst/ui@0.2.0 — Skeleton/SkeletonGroup/LoadingDots/SearchInput 2026-05-27 15:45:44 -07:00
StatCard.tsx Improve shared UI primitives 2026-05-08 20:56:05 -07:00
StatusBadge.tsx feat(ui): add operational core primitives 2026-05-06 11:10:08 -07:00
Surface.tsx feat(ui): add surface layout primitives 2026-05-06 11:21:50 -07:00
Switch.tsx feat(ui): add accessible control primitives 2026-05-06 11:25:26 -07:00
Tabs.tsx feat(ui): add accessible control primitives 2026-05-06 11:25:26 -07:00
Textarea.tsx Improve shared UI primitives 2026-05-08 20:56:05 -07:00
Timeline.tsx feat(ui): add operational core primitives 2026-05-06 11:10:08 -07:00
Toast.tsx fix(ui): use tokenized status colors 2026-05-06 11:15:29 -07:00
Toolbar.tsx feat(ui): add operational workflow primitives 2026-05-08 21:16:48 -07:00
Tooltip.tsx feat(ui): add accessible control primitives 2026-05-06 11:25:26 -07:00