@open-mercato/core 0.7.1-develop.7202.1.a52dc6707c → 0.8.0

package/dist/modules/design_system/gallery/demos/cryptocurrency.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/modules/design_system/gallery/demos/cryptocurrency.tsx"],
+  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { Command } from 'cmdk'\nimport {\n  ArrowDown,\n  ArrowDownUp,\n  ArrowUpRight,\n  Bell,\n  Check,\n  ChevronDown,\n  ChevronRight,\n  Copy,\n  Gift,\n  House,\n  Info,\n  LoaderCircle,\n  LogOut,\n  MessageSquare,\n  Moon,\n  Search,\n  Settings,\n  Share2,\n  ShieldCheck,\n  SlidersHorizontal,\n  Star,\n  X,\n} from 'lucide-react'\nimport { useT, type TranslateParams } from '@open-mercato/shared/lib/i18n/context'\nimport { cn } from '@open-mercato/shared/lib/utils'\nimport { Avatar } from '@open-mercato/ui/primitives/avatar'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport { Card } from '@open-mercato/ui/primitives/card'\nimport { Checkbox } from '@open-mercato/ui/primitives/checkbox'\nimport {\n  CommandMenuInput,\n  CommandMenuList,\n  CommandMenuItem,\n  CommandMenuEmpty,\n  CommandMenuFooter,\n} from '@open-mercato/ui/primitives/command-menu'\nimport { Dialog, DialogContent, DialogTitle, DialogDescription } from '@open-mercato/ui/primitives/dialog'\nimport { Input } from '@open-mercato/ui/primitives/input'\nimport { Popover, PopoverContent, PopoverTrigger } from '@open-mercato/ui/primitives/popover'\nimport { SearchInput } from '@open-mercato/ui/primitives/search-input'\nimport { SegmentedControl, SegmentedControlItem } from '@open-mercato/ui/primitives/segmented-control'\nimport { Switch } from '@open-mercato/ui/primitives/switch'\nimport { Tabs, TabsList, TabsTrigger, TabsContent } from '@open-mercato/ui/primitives/tabs'\nimport { cryptoArtwork } from '../assets/cryptocurrency-artwork'\n\nexport type CryptoPreviewState =\n  | 'default'\n  | 'hover'\n  | 'active'\n  | 'filled'\n  | 'disabled'\n  | 'error'\n  | 'selected'\n  | 'searching'\n  | 'empty'\nexport type CryptoPart =\n  | 'status-icon'\n  | 'token-icon'\n  | 'navigation-item'\n  | 'navigation-search'\n  | 'navigation-wallet'\n  | 'navigation-action'\n  | 'chart-item'\n  | 'swap-select'\n  | 'chart-switch'\n  | 'table-button'\n  | 'table-switch-item'\n  | 'table-tab'\n  | 'table-filter'\n  | 'table-switch'\n  | 'swap-input'\n  | 'swap'\n  | 'search-modal'\n  | 'search-input'\n  | 'navigation'\n  | 'social-button'\n  | 'menu-dropdown'\n  | 'favorites-dropdown'\n  | 'profile-dropdown'\n  | 'wallet-dropdown'\n  | 'swap-token-dropdown'\n  | 'notifications-dropdown'\n  | 'connect-wallet'\n  | 'banner'\n  | 'filter-type'\n  | 'filter-date'\n  | 'filter-status'\n  | 'filter-token'\n  | 'mobile-navigation'\n  | 'mobile-bottom-navigation'\nexport type CryptocurrencyDemoProps = {\n  part: CryptoPart\n  state?: CryptoPreviewState\n  kind?: string\n  size?: 24 | 28\n  onlyIcon?: boolean\n  profile?: boolean\n  step?: 1 | 2 | 3\n}\n\nconst useCryptoLabels = () => {\n  const t = useT()\n  return (key: string, params?: TranslateParams) => t(`design_system.gallery.samples.crypto.${key}`, params)\n}\n\nconst tokenFixtures = [\n  { symbol: 'btc', name: 'Bitcoin', price: 116236.51, change: 2.5, balance: 0.0095 },\n  { symbol: 'eth', name: 'Ethereum', price: 2348, change: 1.3, balance: 242.4 },\n  { symbol: 'xrp', name: 'XRP', price: 1.55, change: -0.2, balance: 510.82 },\n  { symbol: 'usdt', name: 'TetherUS', price: 1, change: 0, balance: 125.63 },\n  { symbol: 'trx', name: 'Tron', price: 123.08, change: -1.1, balance: 0 },\n  { symbol: 'sol', name: 'Solana', price: 765.12, change: -2.3, balance: 0 },\n  { symbol: 'usdc', name: 'USDC', price: 1, change: 0, balance: 100 },\n  { symbol: 'bnb', name: 'BNB', price: 456.18, change: -1.5, balance: 0 },\n  { symbol: 'avax', name: 'Avalanche', price: 789.7, change: -2, balance: 0 },\n  { symbol: 'ada', name: 'Cardano', price: 101.26, change: 0.4, balance: 0 },\n  { symbol: 'hbar', name: 'Hedera', price: 0.18, change: 0.1, balance: 0 },\n  { symbol: 'dot', name: 'Polkadot', price: 4.2, change: -0.4, balance: 0 },\n] as const\n\ntype CryptoToken = (typeof tokenFixtures)[number]['symbol']\nconst tokenBySymbol = (symbol: string) => tokenFixtures.find((token) => token.symbol === symbol) ?? tokenFixtures[0]\nconst formatAmount = (amount: number, maximumFractionDigits = 2) =>\n  new Intl.NumberFormat('en-US', { maximumFractionDigits }).format(amount)\nconst money = (amount: number) =>\n  `$${new Intl.NumberFormat('en-US', { minimumFractionDigits: 2, maximumFractionDigits: 2 }).format(amount)}`\nconst greenButton =\n  'rounded-full bg-status-success-solid text-status-success-solid-foreground hover:bg-status-success-solid/90'\nconst pill = 'rounded-full text-muted-foreground hover:bg-muted hover:text-foreground'\nconst previewSurface = (state: CryptoPreviewState) =>\n  (state === 'hover' || state === 'active') && 'bg-muted text-foreground'\n\nfunction CryptoGlyph({\n  name,\n  className,\n}: {\n  name: 'crown' | 'star' | 'menu' | 'history' | 'clock' | 'rewards' | 'link' | 'more'\n  className?: string\n}) {\n  return (\n    <span\n      aria-hidden=\"true\"\n      className={cn('inline-block size-4.5 shrink-0 bg-current', className)}\n      style={{\n        maskImage: `url(${cryptoArtwork[name]})`,\n        WebkitMaskImage: `url(${cryptoArtwork[name]})`,\n        maskSize: 'contain',\n        WebkitMaskSize: 'contain',\n        maskRepeat: 'no-repeat',\n        WebkitMaskRepeat: 'no-repeat',\n        maskPosition: 'center',\n        WebkitMaskPosition: 'center',\n      }}\n    />\n  )\n}\n\nfunction TokenIcon({ symbol, className }: { symbol: CryptoToken; className?: string }) {\n  return <img src={cryptoArtwork[symbol]} alt=\"\" className={cn('size-4 shrink-0 rounded-full', className)} />\n}\n\nfunction CryptoPanel({ children, className }: { children: React.ReactNode; className?: string }) {\n  return (\n    <Card\n      className={cn(\n        'gap-0 overflow-hidden rounded-2xl border-0 bg-background p-0 shadow-md ring-1 ring-inset ring-border',\n        className,\n      )}\n    >\n      {children}\n    </Card>\n  )\n}\n\nfunction CryptoNotice({ message }: { message: string }) {\n  return message ? (\n    <p role=\"status\" className=\"px-4 py-2 text-xs text-status-success-text\">\n      {message}\n    </p>\n  ) : null\n}\n\nfunction CryptoNavigationItem({\n  state = 'default',\n  size = 28,\n  label,\n  onClick,\n  pressed,\n}: {\n  state?: CryptoPreviewState\n  size?: 24 | 28\n  label?: string\n  onClick?: () => void\n  pressed?: boolean\n}) {\n  const cryptoLabel = useCryptoLabels()\n  const [selected, setSelected] = React.useState(state === 'active')\n  return (\n    <Button\n      type=\"button\"\n      variant=\"ghost\"\n      size=\"2xs\"\n      aria-pressed={pressed ?? selected}\n      onClick={() => {\n        setSelected(!selected)\n        onClick?.()\n      }}\n      className={cn(\n        pill,\n        'px-3 py-0.5 font-medium',\n        size === 24 ? 'h-6 text-compact' : 'h-7 text-sm',\n        previewSurface(state),\n        (pressed ?? selected) && 'bg-muted text-foreground',\n      )}\n    >\n      {label ?? cryptoLabel('overview')}\n    </Button>\n  )\n}\n\nfunction CryptoSegments({\n  type = 'chart',\n  initialValue,\n  size = 24,\n  itemOnly = false,\n  state = 'default',\n}: {\n  type?: 'chart' | 'table'\n  initialValue?: string\n  size?: 24 | 28\n  itemOnly?: boolean\n  state?: CryptoPreviewState\n}) {\n  const cryptoLabel = useCryptoLabels()\n  const values = type === 'chart' ? ['1D', '1W', '1M', '3M', '1Y'] : ['compact', 'detailed']\n  const [value, setValue] = React.useState(initialValue ?? (itemOnly && state !== 'active' ? '' : values[0]))\n  return (\n    <SegmentedControl\n      size=\"sm\"\n      value={value}\n      onValueChange={setValue}\n      aria-label={cryptoLabel(type === 'chart' ? 'chartRange' : 'tableDensity')}\n      className={cn(\n        'border-0 bg-muted',\n        type === 'chart' ? 'h-6 p-0.75' : 'p-0',\n        type === 'table' && (size === 28 ? 'h-7' : 'h-6'),\n        itemOnly && 'h-auto p-0',\n      )}\n    >\n      {(itemOnly ? [values[0]] : values).map((option) => (\n        <SegmentedControlItem\n          key={option}\n          value={option}\n          className={cn(\n            'px-0 text-xs leading-4 font-medium data-[state=checked]:font-medium',\n            type === 'chart' ? 'h-4.5 w-10' : size === 28 ? 'h-7 w-20' : 'h-6 w-20',\n            previewSurface(state),\n          )}\n        >\n          {type === 'chart' ? option : cryptoLabel(option)}\n        </SegmentedControlItem>\n      ))}\n    </SegmentedControl>\n  )\n}\n\nfunction CryptoTokenList({\n  onSelect,\n  favorites,\n  onFavorite,\n  showPrices = false,\n  query = '',\n  limit = 10,\n}: {\n  onSelect?: (token: CryptoToken) => void\n  favorites?: readonly string[]\n  onFavorite?: (token: CryptoToken) => void\n  showPrices?: boolean\n  query?: string\n  limit?: number\n}) {\n  const cryptoLabel = useCryptoLabels()\n  const matches = tokenFixtures\n    .slice(0, limit)\n    .filter((token) => `${token.name} ${token.symbol}`.toLowerCase().includes(query.toLowerCase()))\n  return (\n    <div className=\"min-h-0 overflow-auto p-2\" data-slot=\"crypto-token-list\">\n      {matches.length === 0 ? (\n        <div className=\"p-6 text-center text-sm text-muted-foreground\">{cryptoLabel('noTokens')}</div>\n      ) : (\n        matches.map((token) => (\n          <div key={token.symbol} className=\"flex items-center gap-1 rounded-xl hover:bg-muted\">\n            <Button\n              type=\"button\"\n              variant=\"ghost\"\n              size=\"sm\"\n              onClick={() => onSelect?.(token.symbol)}\n              className=\"h-10 min-w-0 flex-1 justify-start gap-2 rounded-xl px-2 text-compact font-medium\"\n              aria-label={token.name}\n            >\n              <TokenIcon symbol={token.symbol} className=\"size-4.5\" />\n              <span className=\"truncate\">\n                {token.name}{' '}\n                <span className=\"font-mono text-xs text-muted-foreground\">{`{${token.symbol.toUpperCase()}}`}</span>\n              </span>\n              {showPrices && (\n                <span className=\"ml-auto flex shrink-0 items-center gap-2\">\n                  <span className=\"font-mono text-sm\">${formatAmount(token.price)}</span>\n                  <span\n                    className={cn(\n                      'text-xs',\n                      token.change < 0\n                        ? 'text-status-error-text'\n                        : token.change > 0\n                          ? 'text-status-success-text'\n                          : 'text-muted-foreground',\n                    )}\n                  >\n                    {token.change > 0 ? '+' : ''}\n                    {token.change}%\n                  </span>\n                </span>\n              )}\n            </Button>\n            {onFavorite && (\n              <Button\n                type=\"button\"\n                variant=\"ghost\"\n                size=\"2xs\"\n                className=\"size-7 rounded-full p-1\"\n                aria-label={cryptoLabel(favorites?.includes(token.symbol) ? 'removeFavorite' : 'addFavorite', {\n                  token: token.name,\n                })}\n                aria-pressed={favorites?.includes(token.symbol)}\n                onClick={() => onFavorite(token.symbol)}\n              >\n                <Star\n                  className={cn(\n                    'size-4',\n                    favorites?.includes(token.symbol)\n                      ? 'fill-status-warning-icon text-status-warning-icon'\n                      : 'text-muted-foreground',\n                  )}\n                />\n              </Button>\n            )}\n          </div>\n        ))\n      )}\n    </div>\n  )\n}\n\nfunction CryptoTokenPicker({\n  value = 'btc',\n  onValueChange,\n  appearance = 'lighter',\n  state = 'default',\n  disabled,\n}: {\n  value?: CryptoToken\n  onValueChange?: (token: CryptoToken) => void\n  appearance?: string\n  state?: CryptoPreviewState\n  disabled?: boolean\n}) {\n  const cryptoLabel = useCryptoLabels()\n  const [selection, setSelection] = React.useState(value)\n  const [open, setOpen] = React.useState(false)\n  const [query, setQuery] = React.useState('')\n  React.useEffect(() => setSelection(value), [value])\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger asChild>\n        <Button\n          type=\"button\"\n          variant=\"ghost\"\n          size=\"2xs\"\n          disabled={disabled}\n          aria-label={cryptoLabel('selectToken')}\n          className={cn(\n            pill,\n            'h-7 gap-1 px-1.5 font-mono text-sm',\n            appearance === 'stroke' ? 'border border-border bg-background' : 'bg-muted',\n            previewSurface(state),\n          )}\n        >\n          <TokenIcon symbol={selection} />\n          {selection.toUpperCase()}\n          <ChevronDown className={cn('size-4 transition-transform', open && 'rotate-180')} />\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent className=\"w-70 min-w-0 overflow-hidden rounded-2xl\" align=\"end\">\n        <SearchInput\n          aria-label={cryptoLabel('searchTokens')}\n          placeholder={cryptoLabel('searchTokens')}\n          value={query}\n          onChange={setQuery}\n          className=\"h-10 rounded-none border-0 border-b shadow-none\"\n          inputClassName=\"text-compact\"\n        />\n        <div className=\"max-h-68 overflow-auto\">\n          <CryptoTokenList\n            query={query}\n            onSelect={(token) => {\n              setSelection(token)\n              onValueChange?.(token)\n              setOpen(false)\n            }}\n            limit={12}\n          />\n        </div>\n      </PopoverContent>\n    </Popover>\n  )\n}\n\nfunction CryptoSearch({\n  state = 'default',\n  inputOnly = false,\n  onSelect,\n}: {\n  state?: CryptoPreviewState\n  inputOnly?: boolean\n  onSelect?: (token: CryptoToken) => void\n}) {\n  const cryptoLabel = useCryptoLabels()\n  const [query, setQuery] = React.useState(\n    state === 'empty' ? 'unlisted token' : state === 'searching' || state === 'active' ? 'Ethereum' : '',\n  )\n  const [selected, setSelected] = React.useState('')\n  const [tab, setTab] = React.useState('tokens')\n  const searchTokens = query.toLowerCase().includes('ethereum')\n    ? [\n        { ...tokenFixtures[1], name: 'Ethereum' },\n        { ...tokenFixtures[1], name: 'Arbitrum ETH', price: 123.08, change: -0.2 },\n        { ...tokenFixtures[1], name: 'Optimistic ETH', price: 98.04, change: 0.9 },\n        { ...tokenFixtures[1], name: 'Base ETH', price: 456.18, change: -2.3 },\n      ]\n    : tokenFixtures.slice(0, 10)\n  return (\n    <CryptoPanel\n      className={cn(\n        'w-120 max-w-full',\n        !inputOnly && (query ? 'h-99' : 'h-137'),\n        inputOnly && 'rounded-none border-0 shadow-none',\n      )}\n    >\n      <Command\n        shouldFilter={!query.toLowerCase().includes('ethereum')}\n        className=\"flex min-h-0 flex-1 flex-col\"\n        label={cryptoLabel('searchTokens')}\n      >\n        <CommandMenuInput\n          value={query}\n          onValueChange={setQuery}\n          showShortcut={false}\n          showClear\n          appearance=\"source\"\n          placeholder={cryptoLabel('searchPairs')}\n          aria-label={cryptoLabel('searchPairs')}\n          className=\"text-compact\"\n          wrapperClassName=\"h-12 shrink-0 px-4 py-3.5 [&>svg]:size-4.5 focus-within:[&>svg]:text-status-success-icon\"\n        />\n        {!inputOnly && (\n          <>\n            {!query && (\n              <div\n                className=\"flex h-9 shrink-0 items-center gap-5 border-b border-border px-5\"\n                role=\"tablist\"\n                aria-label={cryptoLabel('searchCategory')}\n              >\n                {['tokens', 'trade', 'rewards'].map((option) => (\n                  <Button\n                    type=\"button\"\n                    role=\"tab\"\n                    aria-selected={tab === option}\n                    key={option}\n                    variant=\"ghost\"\n                    size=\"2xs\"\n                    onClick={() => setTab(option)}\n                    className={cn(\n                      'h-10 rounded-none border-b px-0 font-mono text-xs uppercase',\n                      tab === option\n                        ? 'border-status-success-icon text-foreground'\n                        : 'border-transparent text-muted-foreground',\n                    )}\n                  >\n                    {cryptoLabel(option)}\n                  </Button>\n                ))}\n              </div>\n            )}\n            {query && (\n              <div className=\"flex h-9 shrink-0 items-end px-5 pb-1 font-mono text-overline text-muted-foreground\">\n                {cryptoLabel('results')}\n              </div>\n            )}\n            <CommandMenuList className=\"min-h-0 max-h-none flex-1 p-2\">\n              <CommandMenuEmpty className=\"flex h-full flex-col items-center justify-center gap-3 p-8 text-center\">\n                <span className=\"flex size-20 items-center justify-center rounded-full bg-muted\">\n                  <img src={cryptoArtwork.sadFace} alt=\"\" className=\"size-8\" />\n                </span>\n                <strong className=\"text-compact font-medium text-foreground\">{cryptoLabel('noTokens')}</strong>\n                <span className=\"text-xs\">{cryptoLabel('tryAnotherSearch')}</span>\n              </CommandMenuEmpty>\n              {searchTokens.map((token) => (\n                <CommandMenuItem\n                  key={token.name}\n                  value={token.name}\n                  keywords={[token.symbol]}\n                  onSelect={() => {\n                    setSelected(cryptoLabel('selectedToken', { token: token.name }))\n                    onSelect?.(token.symbol)\n                  }}\n                  hideChevron\n                  className=\"h-10 gap-2 rounded-xl px-2 py-2 text-compact [&_[data-slot=command-menu-item-text]>div>span]:text-compact\"\n                  leading={<TokenIcon symbol={token.symbol} />}\n                  sublabel={`{${token.symbol.toUpperCase()}}`}\n                  shortcut={\n                    <span className=\"flex items-center gap-2\">\n                      <span className=\"font-mono text-sm\">${formatAmount(token.price)}</span>\n                      <span\n                        className={cn(\n                          'text-xs',\n                          token.change < 0 ? 'text-status-error-text' : 'text-status-success-text',\n                        )}\n                      >\n                        {token.change > 0 ? '+' : ''}\n                        {token.change}%\n                      </span>\n                    </span>\n                  }\n                >\n                  {token.name}\n                </CommandMenuItem>\n              ))}\n            </CommandMenuList>\n            <CommandMenuFooter className=\"h-12 shrink-0 border-t border-border px-4 font-mono text-overline uppercase [&_kbd]:rounded-full\" />\n          </>\n        )}\n      </Command>\n      <CryptoNotice message={selected} />\n    </CryptoPanel>\n  )\n}\n\nfunction CryptoNavigationSearch({ state = 'default' }: { state?: CryptoPreviewState }) {\n  const cryptoLabel = useCryptoLabels()\n  const [open, setOpen] = React.useState(false)\n  React.useEffect(() => {\n    const onKey = (event: KeyboardEvent) => {\n      if (event.defaultPrevented || (event.target instanceof HTMLElement && event.target.isContentEditable)) return\n      if (\n        ((event.ctrlKey || event.metaKey) && event.key === 'k') ||\n        (event.key === '/' &&\n          !(event.target instanceof HTMLInputElement) &&\n          !(event.target instanceof HTMLTextAreaElement))\n      ) {\n        event.preventDefault()\n        setOpen(true)\n      }\n    }\n    window.addEventListener('keydown', onKey)\n    return () => window.removeEventListener('keydown', onKey)\n  }, [])\n  return (\n    <>\n      <Button\n        type=\"button\"\n        variant=\"ghost\"\n        size=\"sm\"\n        onClick={() => setOpen(true)}\n        className={cn(\n          'h-8 w-91 max-w-full justify-start gap-2 rounded-full bg-muted py-1.5 pl-2 pr-1.5 text-compact text-muted-foreground',\n          previewSurface(state),\n        )}\n      >\n        <Search className=\"size-4\" />\n        {cryptoLabel('searchPairs')}\n        <span className=\"ml-auto flex size-5 items-center justify-center rounded-full bg-background text-xs\">/</span>\n      </Button>\n      <Dialog open={open} onOpenChange={setOpen}>\n        <DialogContent className=\"w-120 max-w-full border-0 bg-transparent p-0 shadow-none [&>button]:hidden\">\n          <DialogTitle className=\"sr-only\">{cryptoLabel('searchTokens')}</DialogTitle>\n          <DialogDescription className=\"sr-only\">{cryptoLabel('chooseToken')}</DialogDescription>\n          <CryptoSearch onSelect={() => setOpen(false)} />\n        </DialogContent>\n      </Dialog>\n    </>\n  )\n}\n\nfunction CryptoSwapInput({\n  type = 'selling',\n  state = 'default',\n  value: controlledValue,\n  onValueChange,\n  token: controlledToken,\n  onTokenChange,\n  available = 0.0095,\n}: {\n  type?: string\n  state?: CryptoPreviewState\n  value?: string\n  onValueChange?: (value: string) => void\n  token?: CryptoToken\n  onTokenChange?: (token: CryptoToken) => void\n  available?: number\n}) {\n  const cryptoLabel = useCryptoLabels()\n  const [inputValue, setInputValue] = React.useState(\n    ['active', 'filled', 'error'].includes(state) ? (type === 'receive' ? '1050.64' : '0.0095') : '',\n  )\n  const [token, setToken] = React.useState<CryptoToken>(type === 'receive' ? 'usdc' : 'btc')\n  const value = controlledValue ?? inputValue\n  const activeToken = controlledToken ?? token\n  const error =\n    state === 'error' ||\n    (type !== 'receive' &&\n      value !== '' &&\n      (!Number.isFinite(Number(value)) || Number(value) < 0 || Number(value) > available))\n  const tokenValue = tokenBySymbol(activeToken)\n  return (\n    <div\n      data-slot=\"crypto-swap-input\"\n      className=\"relative flex h-32 w-94 max-w-full gap-4 bg-background px-6 pt-6 pb-5\"\n    >\n      <div\n        className={cn(\n          'min-w-0 flex-1 border-b border-border pb-4 focus-within:border-status-success-icon',\n          error && 'border-status-error-icon focus-within:border-status-error-icon',\n          state === 'active' && 'border-status-success-icon',\n        )}\n      >\n        <div className=\"flex items-start justify-between gap-2\">\n          <label className=\"min-w-0 flex-1 text-compact text-muted-foreground\">\n            {cryptoLabel(type === 'receive' ? 'receiving' : 'selling')}\n            <Input\n              aria-label={cryptoLabel(type === 'receive' ? 'receiving' : 'selling')}\n              type=\"text\"\n              inputMode=\"decimal\"\n              value={value}\n              onChange={(event) => {\n                setInputValue(event.target.value)\n                onValueChange?.(event.target.value)\n              }}\n              placeholder=\"0\"\n              disabled={state === 'disabled'}\n              aria-invalid={error || undefined}\n              className=\"h-10 border-0 bg-transparent p-0 shadow-none hover:bg-transparent focus-within:shadow-none has-[input:disabled]:bg-transparent\"\n              inputClassName={cn('text-title-4 tracking-tight text-foreground', error && 'text-status-error-text')}\n            />\n          </label>\n          <div className=\"flex shrink-0 flex-col items-end gap-4\">\n            <CryptoTokenPicker\n              value={activeToken}\n              onValueChange={(next) => {\n                setToken(next)\n                onTokenChange?.(next)\n              }}\n              disabled={state === 'disabled'}\n            />\n            {type !== 'receive' && value && (\n              <Button\n                type=\"button\"\n                variant=\"ghost\"\n                size=\"2xs\"\n                className=\"h-4 gap-1 px-0 text-xs text-muted-foreground hover:bg-transparent\"\n                disabled={state === 'disabled'}\n                onClick={() => {\n                  const next = String(available)\n                  setInputValue(next)\n                  onValueChange?.(next)\n                }}\n              >\n                <span className=\"hidden sm:inline\">{cryptoLabel('available')}</span>\n                <span className=\"underline\">\n                  {available} {activeToken.toUpperCase()}\n                </span>\n              </Button>\n            )}\n          </div>\n        </div>\n        <p className=\"font-mono text-xs text-muted-foreground\">\n          {money(Number.isFinite(Number(value)) ? Number(value) * tokenValue.price : 0)}\n        </p>\n      </div>\n    </div>\n  )\n}\n\nfunction CryptoSwap({ step = 1 }: { step?: 1 | 2 | 3 }) {\n  const cryptoLabel = useCryptoLabels()\n  const [amount, setAmount] = React.useState(step === 1 ? '' : '0.0095')\n  const [sellingToken, setSellingToken] = React.useState<CryptoToken>('btc')\n  const [receivingToken, setReceivingToken] = React.useState<CryptoToken>('usdc')\n  const [phase, setPhase] = React.useState<'input' | 'quote' | 'ready' | 'confirmed'>(\n    step === 1 ? 'input' : step === 2 ? 'quote' : 'ready',\n  )\n  const [mode, setMode] = React.useState('swap')\n  const [slippage, setSlippage] = React.useState('0.5')\n  const selling = tokenBySymbol(sellingToken)\n  const receiving = tokenBySymbol(receivingToken)\n  const numericAmount = Number(amount)\n  const valid =\n    amount.trim() !== '' &&\n    Number.isFinite(numericAmount) &&\n    numericAmount > 0 &&\n    numericAmount <= selling.balance &&\n    sellingToken !== receivingToken\n  const quote = valid ? (numericAmount * selling.price) / receiving.price : 0\n  const updateAmount = (next: string) => {\n    setAmount(next)\n    setPhase('input')\n  }\n  const submit = () => {\n    if (!valid) return\n    setPhase(phase === 'ready' ? 'confirmed' : 'ready')\n  }\n  return (\n    <div\n      className=\"flex min-h-129 w-94 max-w-full flex-col bg-background\"\n      data-slot=\"crypto-swap\"\n      onKeyDown={(event) => {\n        if ((event.metaKey || event.ctrlKey) && event.key === 'Enter') {\n          event.preventDefault()\n          submit()\n        }\n      }}\n    >\n      <div className=\"flex h-12 items-center justify-between gap-2 border-b border-border px-4\">\n        <SegmentedControl\n          size=\"sm\"\n          value={mode}\n          onValueChange={setMode}\n          className=\"h-6 border-0 bg-transparent p-0\"\n          aria-label={cryptoLabel('transactionMode')}\n        >\n          {['swap', 'send', 'buy'].map((option) => (\n            <SegmentedControlItem\n              key={option}\n              value={option}\n              className=\"h-6 px-3 text-compact data-[state=checked]:bg-muted data-[state=checked]:shadow-none\"\n            >\n              {cryptoLabel(option)}\n            </SegmentedControlItem>\n          ))}\n        </SegmentedControl>\n        <Popover>\n          <PopoverTrigger asChild>\n            <Button\n              type=\"button\"\n              variant=\"ghost\"\n              size=\"2xs\"\n              className=\"size-7 rounded-full p-1\"\n              aria-label={cryptoLabel('swapSettings')}\n            >\n              <Settings className=\"size-4\" />\n            </Button>\n          </PopoverTrigger>\n          <PopoverContent className=\"w-60 min-w-0 p-4\">\n            <label className=\"grid gap-2 text-sm\">\n              {cryptoLabel('slippage')}\n              <Input\n                type=\"number\"\n                min=\"0\"\n                max=\"5\"\n                step=\"0.1\"\n                value={slippage}\n                onChange={(event) => setSlippage(event.target.value)}\n              />\n            </label>\n          </PopoverContent>\n        </Popover>\n      </div>\n      <div className=\"relative flex flex-1 flex-col ring-1 ring-inset ring-border\">\n        <CryptoSwapInput\n          value={amount}\n          onValueChange={updateAmount}\n          token={sellingToken}\n          onTokenChange={(token) => {\n            setSellingToken(token)\n            setAmount('')\n            setPhase('input')\n          }}\n          available={selling.balance}\n        />\n        <Button\n          type=\"button\"\n          variant=\"ghost\"\n          size=\"2xs\"\n          className=\"absolute top-28 left-1/2 z-10 size-9 -translate-x-1/2 rounded-full border-4 border-background bg-muted p-1.5\"\n          aria-label={cryptoLabel('reverseTokens')}\n          onClick={() => {\n            setSellingToken(receivingToken)\n            setReceivingToken(sellingToken)\n            setAmount('')\n            setPhase('input')\n          }}\n        >\n          <ArrowDown className=\"size-4\" />\n        </Button>\n        <CryptoSwapInput\n          type=\"receive\"\n          value={phase === 'ready' || phase === 'confirmed' ? String(Number(quote.toFixed(receivingToken === 'usdc' || receivingToken === 'usdt' ? 2 : 6))) : ''}\n          onValueChange={(next) => {\n            const input = (Number(next) * receiving.price) / selling.price\n            updateAmount(Number.isFinite(input) ? String(input) : '')\n          }}\n          token={receivingToken}\n          onTokenChange={(token) => {\n            setReceivingToken(token)\n            setPhase('input')\n          }}\n        />\n        <div className=\"grid min-h-44 flex-1 gap-3 border-t border-border px-6 py-6\">\n          <div className=\"grid gap-2 text-xs text-muted-foreground\">\n            {['transactionFee', 'serviceFee', 'executionDifference'].map((key, index) => (\n              <div key={key} className=\"flex justify-between\">\n                <span>{cryptoLabel(key)}</span>\n                <span className=\"font-mono\">{index === 0 ? `0 ${receivingToken.toUpperCase()}` : '0%'}</span>\n              </div>\n            ))}\n          </div>\n          <Button\n            type=\"button\"\n            disabled={!valid || phase === 'confirmed'}\n            onClick={submit}\n            className={cn(\n              'w-full rounded-full',\n              phase === 'ready' ? greenButton : 'bg-muted text-foreground hover:bg-muted/70',\n            )}\n          >\n            {phase === 'quote' && (\n              <LoaderCircle aria-hidden=\"true\" className=\"size-4 animate-spin text-status-success-icon\" />\n            )}\n            {cryptoLabel(\n              phase === 'confirmed'\n                ? 'swapConfirmed'\n                : phase === 'ready'\n                  ? 'confirmSwap'\n                  : phase === 'quote'\n                    ? 'finalizingQuote'\n                    : valid\n                      ? 'getQuote'\n                      : 'enterAmount',\n            )}\n          </Button>\n          {amount && !valid && (\n            <p role=\"alert\" className=\"text-xs text-status-error-text\">\n              {cryptoLabel(sellingToken === receivingToken ? 'differentTokens' : 'invalidAmount')}\n            </p>\n          )}\n        </div>\n      </div>\n      <p className=\"flex h-9 shrink-0 items-center justify-center px-6 text-center text-xs text-muted-foreground\">\n        {cryptoLabel('localSimulation')}\n      </p>\n    </div>\n  )\n}\n\nconst filterValues: Record<string, string[]> = {\n  type: ['swap', 'buy', 'send'],\n  date: ['last24Hours', 'last7Days', 'lastMonth', 'lastQuarter', 'lastYear'],\n  status: ['success', 'pending', 'failed', 'cancelled'],\n  token: tokenFixtures.slice(0, 7).map((token) => token.symbol),\n}\n\nfunction CryptoFilterOptions({\n  kind,\n  value,\n  onChange,\n}: {\n  kind: string\n  value: string[]\n  onChange: (value: string[]) => void\n}) {\n  const cryptoLabel = useCryptoLabels()\n  const [query, setQuery] = React.useState('')\n  const options = filterValues[kind] ?? filterValues.type\n  const shown = options.filter((option) =>\n    (kind === 'token' ? tokenBySymbol(option).name : cryptoLabel(option)).toLowerCase().includes(query.toLowerCase()),\n  )\n  const toggle = (option: string) =>\n    onChange(value.includes(option) ? value.filter((item) => item !== option) : [...value, option])\n  const all = options.every((option) => value.includes(option))\n  return (\n    <div className={cn(kind === 'token' ? 'w-93 max-w-full' : 'w-42')} data-slot=\"crypto-filter-options\">\n      {kind === 'token' && (\n        <SearchInput\n          aria-label={cryptoLabel('searchTokens')}\n          placeholder={cryptoLabel('searchTokens')}\n          value={query}\n          onChange={setQuery}\n          className=\"h-10 rounded-none border-0 border-b shadow-none\"\n          inputClassName=\"text-compact\"\n        />\n      )}\n      <div className={cn('overflow-auto p-1', kind === 'token' ? 'max-h-79.5' : 'max-h-80 pb-1.5')}>\n        <label className=\"mx-1 flex h-8 cursor-pointer items-center gap-2 border-b border-border px-1 text-xs\">\n          <Checkbox\n            checked={all ? true : value.length ? 'indeterminate' : false}\n            onCheckedChange={() => onChange(all ? [] : [...options])}\n            className=\"size-3.5 rounded-sm data-[state=checked]:border-status-success-icon data-[state=checked]:bg-status-success-icon data-[state=indeterminate]:bg-status-success-icon data-[state=indeterminate]:border-status-success-icon\"\n          />\n          {cryptoLabel(kind === 'date' ? 'allTime' : 'selectAll')}\n          {kind === 'token' && (\n            <Button\n              type=\"button\"\n              variant=\"ghost\"\n              size=\"2xs\"\n              className=\"ml-auto h-6 px-1 text-xs text-muted-foreground\"\n              onClick={(event) => {\n                event.preventDefault()\n                onChange([])\n              }}\n            >\n              {cryptoLabel('clear')}\n            </Button>\n          )}\n        </label>\n        {shown.map((option) => (\n          <label\n            key={option}\n            className={cn(\n              'flex cursor-pointer items-center gap-2 rounded-lg px-2 text-xs hover:bg-muted',\n              kind === 'token' ? 'h-10' : 'h-7.5',\n            )}\n          >\n            <Checkbox\n              checked={value.includes(option)}\n              onCheckedChange={() => toggle(option)}\n              className=\"size-3.5 rounded-sm data-[state=checked]:border-status-success-icon data-[state=checked]:bg-status-success-icon\"\n            />\n            {kind === 'token' ? (\n              <>\n                <TokenIcon symbol={tokenBySymbol(option).symbol} />\n                {tokenBySymbol(option).name}\n                <span className=\"font-mono text-muted-foreground\">{`{${option.toUpperCase()}}`}</span>\n              </>\n            ) : (\n              cryptoLabel(option)\n            )}\n          </label>\n        ))}\n        {shown.length === 0 && <p className=\"p-4 text-xs text-muted-foreground\">{cryptoLabel('noTokens')}</p>}\n      </div>\n    </div>\n  )\n}\n\nfunction CryptoFilter({\n  kind = 'type',\n  state = 'default',\n  standalone = false,\n}: {\n  kind?: string\n  state?: CryptoPreviewState\n  standalone?: boolean\n}) {\n  const cryptoLabel = useCryptoLabels()\n  const [value, setValue] = React.useState<string[]>(\n    state === 'selected'\n      ? [kind === 'date' ? 'last24Hours' : kind === 'token' ? 'eth' : kind === 'status' ? 'pending' : 'swap']\n      : standalone\n        ? [kind === 'date' ? 'lastMonth' : kind === 'token' ? 'usdt' : kind === 'status' ? 'failed' : 'send']\n        : [],\n  )\n  const [open, setOpen] = React.useState(false)\n  if (standalone)\n    return (\n      <CryptoPanel className=\"w-fit max-w-full\">\n        <CryptoFilterOptions kind={kind} value={value} onChange={setValue} />\n      </CryptoPanel>\n    )\n  const selectedLabel =\n    value.length === 0\n      ? cryptoLabel(kind === 'date' ? 'allTime' : 'all')\n      : value.length === 1\n        ? kind === 'token'\n          ? tokenBySymbol(value[0]).name\n          : cryptoLabel(value[0])\n        : cryptoLabel('selectedCount', { count: value.length })\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger asChild>\n        <Button\n          type=\"button\"\n          variant=\"ghost\"\n          size=\"2xs\"\n          aria-label={cryptoLabel('filterBy', { filter: cryptoLabel(kind) })}\n          className=\"h-6 gap-0 overflow-hidden rounded-full border border-border p-0 text-xs\"\n        >\n          <span className=\"flex h-full items-center border-r border-border px-3 text-muted-foreground\">{cryptoLabel(kind)}</span>\n          <span className={cn('flex h-full items-center gap-1 pr-2 pl-2.5', previewSurface(state))}>\n            {kind === 'token' && value.length === 1 && (\n              <TokenIcon symbol={tokenBySymbol(value[0]).symbol} className=\"size-3.5\" />\n            )}\n            {kind === 'status' && value.length === 1 && (\n              <img src={cryptoArtwork.statusPending} alt=\"\" className=\"size-3\" />\n            )}\n            {selectedLabel}\n            <ChevronDown className={cn('size-4', open && 'rotate-180')} />\n          </span>\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent className=\"w-fit min-w-0 rounded-xl\">\n        <CryptoFilterOptions kind={kind} value={value} onChange={setValue} />\n      </PopoverContent>\n    </Popover>\n  )\n}\n\nfunction CryptoTableTabs({ kind = 'transaction', state = 'default' }: { kind?: string; state?: CryptoPreviewState }) {\n  const cryptoLabel = useCryptoLabels()\n  const [value, setValue] = React.useState(state === 'active' ? kind : '')\n  return (\n    <Tabs variant=\"underline\" value={value} onValueChange={setValue}>\n      <TabsList className=\"h-9 gap-6 border-0 p-0\">\n        {[kind].map((option) => (\n          <TabsTrigger\n            key={option}\n            value={option}\n            leading={\n              <CryptoGlyph\n                name={option === 'transaction' ? 'history' : option === 'open-orders' ? 'clock' : 'rewards'}\n              />\n            }\n            className={cn(\n              'h-9 gap-1.5 rounded-none border-b border-border px-0 pt-0 pb-4 text-sm hover:bg-transparent hover:text-foreground [&_[data-slot=tabs-trigger-leading]]:text-current [&_[data-slot=tabs-trigger-leading]]:group-hover:text-current data-[state=active]:border-status-success-icon data-[state=active]:text-foreground after:hidden',\n              previewSurface(state),\n            )}\n          >\n            {cryptoLabel(option === 'transaction' ? 'transactions' : option === 'open-orders' ? 'openOrders' : 'rewards')}\n          </TabsTrigger>\n        ))}\n      </TabsList>\n      <TabsContent value={kind} className=\"sr-only\">\n        <p className=\"sr-only\">{cryptoLabel('selectedTab')}</p>\n      </TabsContent>\n    </Tabs>\n  )\n}\n\nfunction CryptoTableButton({ kind = 'explorer', state = 'default' }: { kind?: string; state?: CryptoPreviewState }) {\n  const cryptoLabel = useCryptoLabels()\n  return (\n    <Popover>\n      <PopoverTrigger asChild>\n        <Button\n          type=\"button\"\n          variant=\"ghost\"\n          size=\"2xs\"\n          aria-label={cryptoLabel(kind === 'explorer' ? 'explorer' : 'transactionDetails')}\n          className={cn(pill, 'size-7 p-1', previewSurface(state))}\n        >\n          <CryptoGlyph name={kind === 'explorer' ? 'link' : 'more'} className=\"size-5\" />\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent className=\"w-72 p-4\">\n        <h4 className=\"text-sm font-medium\">{cryptoLabel('transactionDetails')}</h4>\n        <dl className=\"mt-3 grid gap-2 text-xs\">\n          <div className=\"flex justify-between\">\n            <dt>{cryptoLabel('type')}</dt>\n            <dd>{cryptoLabel('swap')}</dd>\n          </div>\n          <div className=\"flex justify-between\">\n            <dt>{cryptoLabel('status')}</dt>\n            <dd className=\"text-status-success-text\">{cryptoLabel('success')}</dd>\n          </div>\n          <div className=\"flex justify-between\">\n            <dt>{cryptoLabel('transactionId')}</dt>\n            <dd className=\"font-mono\">0x7a4b\u2026c8f2</dd>\n          </div>\n        </dl>\n        <p className=\"mt-3 text-xs text-muted-foreground\">{cryptoLabel('localSimulation')}</p>\n      </PopoverContent>\n    </Popover>\n  )\n}\n\nfunction CryptoSocialButton({\n  provider = 'phantom',\n  onlyIcon = false,\n  state = 'default',\n  onConnect,\n}: {\n  provider?: string\n  onlyIcon?: boolean\n  state?: CryptoPreviewState\n  onConnect?: (provider: string) => void\n}) {\n  const cryptoLabel = useCryptoLabels()\n  const [connected, setConnected] = React.useState(false)\n  const key = provider === 'walletconnect' ? 'walletconnect' : provider === 'metamask' ? 'metamask' : 'phantom'\n  const name = key === 'walletconnect' ? 'WalletConnect' : key === 'metamask' ? 'MetaMask' : 'Phantom'\n  return (\n    <Button\n      type=\"button\"\n      variant=\"ghost\"\n      aria-label={cryptoLabel(connected ? 'connectedProvider' : 'connectProvider', { provider: name })}\n      onClick={() => {\n        setConnected(true)\n        onConnect?.(name)\n      }}\n      className={cn(\n        'max-w-full gap-3 rounded-full bg-muted text-sm text-foreground hover:bg-accent',\n        onlyIcon ? 'w-30' : 'w-94',\n        state === 'hover' && 'bg-accent',\n      )}\n    >\n      <img src={cryptoArtwork[key]} alt=\"\" className=\"size-5\" />\n      {!onlyIcon && (\n        <span>\n          {connected ? (\n            <>\n              <Check className=\"mr-1 inline size-4\" />\n              {cryptoLabel('connectedProvider', { provider: name })}\n            </>\n          ) : (\n            <>\n              <span className=\"text-muted-foreground\">{cryptoLabel('connect')} </span>\n              {name}\n            </>\n          )}\n        </span>\n      )}\n    </Button>\n  )\n}\n\nfunction CryptoConnectWallet({ onConnect }: { onConnect?: (provider: string) => void }) {\n  const cryptoLabel = useCryptoLabels()\n  const [connected, setConnected] = React.useState('')\n  const [help, setHelp] = React.useState(false)\n  return (\n    <CryptoPanel className=\"w-112 max-w-full rounded-4xl p-9 text-center\">\n      <img src={cryptoArtwork.brand} className=\"mx-auto size-14 rounded-full border border-border p-3\" alt=\"\" />\n      <h3 className=\"mt-4 text-base font-medium\">{cryptoLabel(connected ? 'walletConnected' : 'connectWallet')}</h3>\n      <p className=\"mt-1 text-sm text-muted-foreground\">\n        {connected ? cryptoLabel('connectedProvider', { provider: connected }) : cryptoLabel('chooseWallet')}\n      </p>\n      <div className=\"mt-6 grid gap-2\">\n        {['phantom', 'walletconnect', 'metamask'].map((provider) => (\n          <CryptoSocialButton\n            key={provider}\n            provider={provider}\n            onConnect={(name) => {\n              setConnected(name)\n              onConnect?.(name)\n            }}\n          />\n        ))}\n      </div>\n      <Button\n        type=\"button\"\n        variant=\"link\"\n        size=\"2xs\"\n        onClick={() => setHelp(!help)}\n        className=\"mt-5 h-6 text-status-success-text\"\n      >\n        {cryptoLabel('setUpWallet')}\n        <ArrowUpRight className=\"size-4\" />\n      </Button>\n      {help && (\n        <p role=\"status\" className=\"mt-2 text-xs text-muted-foreground\">\n          {cryptoLabel('walletHelp')}\n        </p>\n      )}\n    </CryptoPanel>\n  )\n}\n\nfunction CryptoFavorites() {\n  const cryptoLabel = useCryptoLabels()\n  const [favorites, setFavorites] = React.useState<string[]>(['btc', 'eth', 'xrp', 'usdt'])\n  const [query, setQuery] = React.useState('')\n  const [selected, setSelected] = React.useState('')\n  return (\n    <CryptoPanel className=\"w-93 max-w-full\">\n      <div className=\"flex h-12 items-center justify-between border-b border-border px-4 text-compact\">\n        <span>{cryptoLabel('favoritesCount', { count: favorites.length })}</span>\n        <Button\n          type=\"button\"\n          variant=\"ghost\"\n          size=\"2xs\"\n          onClick={() => setFavorites([])}\n          className=\"px-0 text-compact text-muted-foreground\"\n        >\n          {cryptoLabel('clear')}\n        </Button>\n      </div>\n      <SearchInput\n        aria-label={cryptoLabel('searchTokens')}\n        placeholder={cryptoLabel('searchTokens')}\n        value={query}\n        onChange={setQuery}\n        className=\"h-11 rounded-none border-0 border-b px-4 shadow-none\"\n        inputClassName=\"text-compact\"\n      />\n      <div className=\"h-99 overflow-auto\">\n        <CryptoTokenList\n          query={query}\n          favorites={favorites}\n          onFavorite={(token) =>\n            setFavorites(favorites.includes(token) ? favorites.filter((item) => item !== token) : [...favorites, token])\n          }\n          onSelect={(token) => setSelected(cryptoLabel('selectedToken', { token: tokenBySymbol(token).name }))}\n        />\n      </div>\n      <CryptoNotice message={selected} />\n    </CryptoPanel>\n  )\n}\n\nfunction CryptoMenu({ profile = false }: { profile?: boolean }) {\n  const cryptoLabel = useCryptoLabels()\n  const [dark, setDark] = React.useState(false)\n  const [message, setMessage] = React.useState('')\n  const items = [\n    { key: profile ? 'accountSettings' : 'settings', Icon: Settings },\n    { key: 'preferences', Icon: SlidersHorizontal },\n    { key: 'helpCenter', Icon: MessageSquare },\n    { key: 'community', Icon: Share2 },\n  ]\n  const divider = (\n    <div className=\"flex h-1 items-center\">\n      <div className=\"h-px w-full bg-border\" />\n    </div>\n  )\n  return (\n    <div className={dark ? 'dark' : undefined} data-slot=\"crypto-menu-theme\">\n      <CryptoPanel className=\"w-74 max-w-full gap-1 p-1.5\">\n        {profile && (\n          <>\n            <div className=\"flex h-14 items-center gap-3 p-2\">\n              <Avatar label=\"Wei Chen\" src={cryptoArtwork.wei} size={40} />\n              <div>\n                <strong className=\"block text-sm font-medium\">Wei Chen</strong>\n                <span className=\"text-sm text-muted-foreground\">wei@example.com</span>\n              </div>\n            </div>\n            {divider}\n          </>\n        )}\n        <label className=\"flex h-9 cursor-pointer items-center gap-2 px-2.5 text-sm\">\n          <Moon className=\"size-5 text-muted-foreground\" />\n          {cryptoLabel('darkMode')}\n          <Switch checked={dark} onCheckedChange={setDark} className=\"ml-auto\" />\n        </label>\n        {divider}\n        {items.map(({ key, Icon }, index) => (\n          <React.Fragment key={key}>\n            {index === 3 && !profile && divider}\n            <Button\n              type=\"button\"\n              variant=\"ghost\"\n              size=\"sm\"\n              className=\"h-9 w-full justify-start rounded-xl px-2.5 text-sm font-normal\"\n              onClick={() => setMessage(cryptoLabel('openedPanel', { panel: cryptoLabel(key) }))}\n            >\n              <Icon className=\"size-5 text-muted-foreground\" />\n              {cryptoLabel(key)}\n              {key === 'preferences' && <ChevronRight className=\"ml-auto size-5\" />}\n            </Button>\n          </React.Fragment>\n        ))}\n        {profile && (\n          <>\n            {divider}\n            <Button\n              type=\"button\"\n              variant=\"ghost\"\n              size=\"sm\"\n              className=\"h-9 justify-start px-2.5 text-sm font-normal\"\n              onClick={() => setMessage(cryptoLabel('signedOut'))}\n            >\n              <LogOut className=\"size-5 text-status-error-icon\" />\n              {cryptoLabel('signOut')}\n            </Button>\n          </>\n        )}\n        <p className=\"flex h-8 items-center px-2.5 text-xs text-muted-foreground\">{cryptoLabel('demoTerms')}</p>\n        <CryptoNotice message={message} />\n      </CryptoPanel>\n    </div>\n  )\n}\n\nfunction CryptoWallet() {\n  const cryptoLabel = useCryptoLabels()\n  const [copied, setCopied] = React.useState(false)\n  const [connected, setConnected] = React.useState(true)\n  const [verified, setVerified] = React.useState(false)\n  const [all, setAll] = React.useState(false)\n  const [action, setAction] = React.useState('')\n  const copy = async () => {\n    try {\n      await navigator.clipboard.writeText('0x1cf2000000000000000000000000000000009a56')\n      setCopied(true)\n    } catch {\n      setAction(cryptoLabel('copyUnavailable'))\n    }\n  }\n  return (\n    <CryptoPanel className=\"w-91 max-w-full\">\n      <div className=\"flex h-18 items-center gap-3 border-b border-border px-4\">\n        <span className=\"flex size-10 items-center justify-center rounded-full bg-muted\">\n          <CryptoGlyph name=\"crown\" className=\"size-5 text-status-success-icon\" />\n        </span>\n        <div className=\"min-w-0\">\n          <p className=\"text-sm\">0x1cf2\u20269a56</p>\n          <p className={cn('text-compact', connected ? 'text-status-success-text' : 'text-muted-foreground')}>\n            {cryptoLabel(connected ? 'connected' : 'disconnected')}\n          </p>\n        </div>\n        <Button\n          type=\"button\"\n          variant=\"ghost\"\n          size=\"2xs\"\n          onClick={copy}\n          className=\"ml-auto h-6 rounded-full bg-muted text-xs\"\n        >\n          <Copy className=\"size-3\" />\n          {cryptoLabel(copied ? 'copied' : 'copy')}\n        </Button>\n      </div>\n      <div className=\"grid min-h-33 gap-4 border-b border-border p-4\">\n        <div className=\"flex items-start justify-between\">\n          <div>\n            <p className=\"text-xs text-muted-foreground\">{cryptoLabel('totalBalance')}</p>\n            <p className=\"mt-1 text-2xl font-medium tracking-tight\">$460,890.02</p>\n          </div>\n          <CryptoTokenPicker value=\"eth\" appearance=\"stroke\" />\n        </div>\n        <div className=\"flex gap-2\">\n          {['swap', 'buy', 'send'].map((mode) => (\n            <Button\n              type=\"button\"\n              key={mode}\n              variant=\"ghost\"\n              size=\"2xs\"\n              disabled={!connected}\n              className=\"rounded-full bg-muted px-3 text-sm\"\n              onClick={() => setAction(mode)}\n            >\n              <ArrowDownUp className=\"size-4 text-status-success-icon\" />\n              {cryptoLabel(mode)}\n            </Button>\n          ))}\n        </div>\n      </div>\n      <div className=\"flex flex-col gap-1 p-2\">\n        <div className=\"flex h-7.5 items-center justify-between px-2 text-xs uppercase text-muted-foreground\">\n          <span>{cryptoLabel('topAssets')}</span>\n          <Button\n            type=\"button\"\n            variant=\"ghost\"\n            size=\"2xs\"\n            className=\"px-0 font-mono text-xs text-status-success-text\"\n            onClick={() => setAll(!all)}\n          >\n            {cryptoLabel(all ? 'showLess' : 'viewAll')}\n          </Button>\n        </div>\n        <div className=\"flex h-1 items-center\">\n          <div className=\"h-px w-full bg-border\" />\n        </div>\n        {tokenFixtures.slice(0, all ? 10 : 4).map((token) => (\n          <div key={token.symbol} className=\"flex h-9 items-center gap-2 rounded-xl px-2 hover:bg-muted\">\n            <TokenIcon symbol={token.symbol} />\n            <span className=\"text-compact\">\n              {token.name} <span className=\"font-mono text-xs text-muted-foreground\">{token.symbol.toUpperCase()}</span>\n            </span>\n            <span className=\"ml-auto font-mono text-xs\">{formatAmount(token.balance, 6)}</span>\n          </div>\n        ))}\n      </div>\n      <div className=\"flex h-18 items-center gap-3 border-y border-border px-4\">\n        <div>\n          <p className=\"text-sm\">{cryptoLabel('verify2FA')}</p>\n          <p className=\"text-compact text-muted-foreground\">{cryptoLabel('securityHint')}</p>\n        </div>\n        <Button\n          type=\"button\"\n          variant=\"ghost\"\n          size=\"2xs\"\n          className=\"ml-auto rounded-full bg-status-success-bg px-4 text-status-success-text\"\n          onClick={() => setVerified(!verified)}\n        >\n          {cryptoLabel(verified ? 'verified' : 'verify')}\n        </Button>\n      </div>\n      <div className=\"grid gap-2 p-2\">\n        <Button\n          type=\"button\"\n          variant=\"ghost\"\n          size=\"sm\"\n          className=\"h-9 justify-start text-sm font-normal\"\n          onClick={() => setAction('settings')}\n        >\n          <Settings className=\"size-4.5 text-muted-foreground\" />\n          {cryptoLabel('walletSettings')}\n        </Button>\n        <Button\n          type=\"button\"\n          variant=\"ghost\"\n          size=\"sm\"\n          className=\"h-9 justify-start text-sm font-normal\"\n          onClick={() => setConnected(!connected)}\n        >\n          <LogOut className=\"size-4.5 text-status-error-icon\" />\n          {cryptoLabel(connected ? 'disconnectWallet' : 'connectWallet')}\n        </Button>\n      </div>\n      <p className=\"px-4 pb-4 text-xs text-muted-foreground\">{cryptoLabel('demoTerms')}</p>\n      {action && (\n        <CryptoNotice\n          message={\n            ['swap', 'buy', 'send', 'settings'].includes(action) ? cryptoLabel('openedPanel', { panel: cryptoLabel(action) }) : action\n          }\n        />\n      )}\n    </CryptoPanel>\n  )\n}\n\nfunction CryptoNotifications() {\n  const cryptoLabel = useCryptoLabels()\n  const [read, setRead] = React.useState<string[]>([])\n  const [viewAll, setViewAll] = React.useState(false)\n  const rows = [\n    {\n      id: 'security',\n      title: 'notificationSecurity',\n      body: 'notificationDevice',\n      time: 'fiveMinutes',\n      Icon: Info,\n      tone: 'text-status-error-icon',\n    },\n    {\n      id: 'swap',\n      title: 'notificationSwap',\n      body: 'notificationSwapBody',\n      time: 'now',\n      Icon: ArrowDownUp,\n      tone: 'text-status-success-icon',\n    },\n    {\n      id: 'reward',\n      title: 'notificationRewards',\n      body: 'notificationRewardsBody',\n      time: 'oneHour',\n      Icon: Gift,\n      tone: 'text-status-success-icon',\n    },\n    {\n      id: 'login',\n      title: 'notificationLogin',\n      body: 'notificationDevice',\n      time: 'tenMinutes',\n      Icon: ShieldCheck,\n      tone: 'text-status-warning-icon',\n    },\n    {\n      id: 'maintenance',\n      title: 'notificationMaintenance',\n      body: 'notificationMaintenanceBody',\n      time: 'yesterday',\n      Icon: Settings,\n      tone: 'text-badge-purple-solid',\n    },\n  ]\n  return (\n    <CryptoPanel className=\"w-100 max-w-full\">\n      <div className=\"flex h-12 items-center justify-between border-b border-border px-4 text-compact\">\n        <span>{cryptoLabel('notifications')}</span>\n        <Button\n          type=\"button\"\n          variant=\"ghost\"\n          size=\"2xs\"\n          className=\"px-0 text-xs text-status-success-text\"\n          onClick={() => setRead(rows.map((row) => row.id))}\n        >\n          {cryptoLabel('markAllRead')}\n        </Button>\n      </div>\n      {rows.map(({ id, title, body, time, Icon, tone }) => (\n        <Button\n          type=\"button\"\n          key={id}\n          variant=\"ghost\"\n          className={cn(\n            'w-full items-start gap-3 rounded-none border-b border-border px-4 py-4 text-left font-normal',\n            !read.includes(id) && ['swap', 'login'].includes(id) && 'bg-muted',\n            ['security', 'reward'].includes(id) ? 'h-18' : 'h-19',\n          )}\n          onClick={() => setRead([...read, id])}\n        >\n          <Icon className={cn('mt-0.5 size-4.5 shrink-0', tone)} />\n          <span className=\"min-w-0 flex-1\">\n            <strong className=\"block whitespace-normal text-compact font-medium\">{cryptoLabel(title)}</strong>\n            <span\n              className={cn(\n                'block whitespace-normal text-compact text-muted-foreground',\n                !['security', 'reward'].includes(id) && 'mt-1',\n              )}\n            >\n              {cryptoLabel(body)}\n            </span>\n          </span>\n          <span className=\"flex shrink-0 items-center gap-2 text-xs text-muted-foreground\">\n            {cryptoLabel(time)}\n            {!read.includes(id) && ['swap', 'login'].includes(id) && (\n              <span className=\"size-1.5 rounded-full bg-status-success-icon\" />\n            )}\n          </span>\n        </Button>\n      ))}\n      <Button\n        type=\"button\"\n        variant=\"ghost\"\n        className=\"h-12 rounded-none text-compact\"\n        onClick={() => setViewAll(!viewAll)}\n      >\n        {cryptoLabel('viewAllNotifications')}\n      </Button>\n      {viewAll && <CryptoNotice message={cryptoLabel('allNotificationsShown', { count: rows.length })} />}\n    </CryptoPanel>\n  )\n}\n\nfunction CryptoWalletTrigger({ state = 'default' }: { state?: CryptoPreviewState }) {\n  const cryptoLabel = useCryptoLabels()\n  return (\n    <Popover>\n      <PopoverTrigger asChild>\n        <Button\n          type=\"button\"\n          variant=\"ghost\"\n          size=\"2xs\"\n          className={cn(pill, 'h-7 gap-1.5 pl-2.5 pr-1.75 text-sm', previewSurface(state))}\n          aria-label={cryptoLabel('wallet')}\n        >\n          <CryptoGlyph name=\"crown\" className=\"size-4 text-status-success-icon\" />\n          0x1cf2\u20269a56\n          <ChevronDown className=\"size-5\" />\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent className=\"w-fit min-w-0 border-0 bg-transparent shadow-none\">\n        <CryptoWallet />\n      </PopoverContent>\n    </Popover>\n  )\n}\n\nfunction CryptoAction({\n  kind = 'favorite',\n  state = 'default',\n  profile = false,\n}: {\n  kind?: string\n  state?: CryptoPreviewState\n  profile?: boolean\n}) {\n  const cryptoLabel = useCryptoLabels()\n  return (\n    <Popover>\n      <PopoverTrigger asChild>\n        <Button\n          type=\"button\"\n          variant=\"ghost\"\n          size=\"2xs\"\n          className={cn(pill, 'relative size-7 p-1.25', previewSurface(state))}\n          aria-label={cryptoLabel(\n            profile\n              ? 'profile'\n              : kind === 'favorite'\n                ? 'favorites'\n                : kind === 'notification'\n                  ? 'notifications'\n                  : 'menu',\n          )}\n        >\n          {profile ? (\n            <Avatar label=\"Wei Chen\" src={cryptoArtwork.wei} size={24} />\n          ) : kind === 'notification' ? (\n            <>\n              <Bell className=\"size-4.5\" />\n              <span className=\"absolute top-1 right-1 size-1 rounded-full bg-status-warning-icon\" />\n            </>\n          ) : (\n            <CryptoGlyph name={kind === 'favorite' ? 'star' : 'menu'} />\n          )}\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent className=\"w-fit min-w-0 border-0 bg-transparent shadow-none\" align=\"end\">\n        {profile ? (\n          <CryptoMenu profile />\n        ) : kind === 'favorite' ? (\n          <CryptoFavorites />\n        ) : kind === 'notification' ? (\n          <CryptoNotifications />\n        ) : (\n          <CryptoMenu />\n        )}\n      </PopoverContent>\n    </Popover>\n  )\n}\n\nfunction CryptoNavigation({ profile = false, mobile = false }: { profile?: boolean; mobile?: boolean }) {\n  const cryptoLabel = useCryptoLabels()\n  const [selected, setSelected] = React.useState('overview')\n  return (\n    <div\n      className={cn(\n        'flex h-16 items-center gap-3 border-y border-border bg-background',\n        mobile ? 'w-97.5 max-w-full px-4' : 'w-full min-w-0 flex-wrap px-4 lg:flex-nowrap lg:px-11',\n      )}\n      data-slot=\"crypto-navigation\"\n    >\n      {mobile && <CryptoAction kind=\"hamburger\" />}\n      <img src={cryptoArtwork.brand} className=\"size-7 shrink-0\" alt={cryptoLabel('cryptoBrand')} />\n      {!mobile && (\n        <div className=\"hidden items-center gap-1 md:flex\">\n          {['overview', 'markets', 'trade', 'rewards'].map((item) => (\n            <CryptoNavigationItem\n              key={item}\n              state={selected === item ? 'active' : 'default'}\n              pressed={selected === item}\n              label={cryptoLabel(item)}\n              onClick={() => setSelected(item)}\n            />\n          ))}\n        </div>\n      )}\n      {!mobile && (\n        <div className=\"mx-auto hidden min-w-0 lg:block\">\n          <CryptoNavigationSearch />\n        </div>\n      )}\n      <div className=\"ml-auto flex items-center gap-2\">\n        {!mobile && (\n          <div className=\"hidden sm:block\">\n            <CryptoWalletTrigger />\n          </div>\n        )}\n        <CryptoAction kind=\"favorite\" />\n        <CryptoAction kind=\"notification\" />\n        {mobile ? (\n          <Popover>\n            <PopoverTrigger asChild>\n              <Button\n                type=\"button\"\n                variant=\"ghost\"\n                size=\"2xs\"\n                aria-label={cryptoLabel('searchTokens')}\n                className=\"size-7 rounded-full p-1\"\n              >\n                <Search className=\"size-4.5\" />\n              </Button>\n            </PopoverTrigger>\n            <PopoverContent className=\"w-fit min-w-0 border-0 bg-transparent shadow-none\" align=\"end\">\n              <CryptoSearch />\n            </PopoverContent>\n          </Popover>\n        ) : (\n          <CryptoAction kind=\"hamburger\" profile={profile} />\n        )}\n        {mobile && (\n          <Popover>\n            <PopoverTrigger asChild>\n              <Button\n                type=\"button\"\n                variant=\"ghost\"\n                size=\"sm\"\n                aria-label={cryptoLabel('wallet')}\n                className=\"size-8 rounded-full bg-status-success-bg p-2\"\n              >\n                <CryptoGlyph name=\"crown\" className=\"size-4 text-status-success-icon\" />\n              </Button>\n            </PopoverTrigger>\n            <PopoverContent className=\"w-fit min-w-0 border-0 bg-transparent shadow-none\" align=\"end\">\n              <CryptoWallet />\n            </PopoverContent>\n          </Popover>\n        )}\n      </div>\n    </div>\n  )\n}\n\nfunction CryptoBanner() {\n  const cryptoLabel = useCryptoLabels()\n  const [visible, setVisible] = React.useState(true)\n  const [claimed, setClaimed] = React.useState(false)\n  return visible ? (\n    <div className=\"flex min-h-9 w-full items-center justify-center gap-2 border-b border-border px-3 py-1 text-xs\">\n      <Gift className=\"size-3.5 shrink-0 text-status-success-icon\" />\n      <span>{cryptoLabel(claimed ? 'bonusClaimed' : 'bonusOffer')}</span>\n      <Button\n        type=\"button\"\n        variant=\"ghost\"\n        size=\"2xs\"\n        disabled={claimed}\n        className=\"h-6 px-1 text-xs text-status-success-text\"\n        onClick={() => setClaimed(true)}\n      >\n        {cryptoLabel('claimNow')}\n        <ArrowUpRight className=\"size-3\" />\n      </Button>\n      <Button\n        type=\"button\"\n        variant=\"ghost\"\n        size=\"2xs\"\n        className=\"ml-auto size-6 p-1 text-muted-foreground\"\n        aria-label={cryptoLabel('dismissBanner')}\n        onClick={() => setVisible(false)}\n      >\n        <X className=\"size-3\" />\n      </Button>\n    </div>\n  ) : (\n    <Button type=\"button\" variant=\"ghost\" size=\"2xs\" onClick={() => setVisible(true)}>\n      {cryptoLabel('showBanner')}\n    </Button>\n  )\n}\n\nfunction CryptoMobileBottom() {\n  const cryptoLabel = useCryptoLabels()\n  const [selected, setSelected] = React.useState('home')\n  const [open, setOpen] = React.useState(false)\n  return (\n    <div className=\"w-97.5 max-w-full bg-background pt-9\">\n      <Button type=\"button\" className={cn(greenButton, 'mb-4 w-full')} onClick={() => setOpen(true)}>\n        {cryptoLabel('swapSendBuy')}\n      </Button>\n      <div className=\"grid h-16 grid-cols-4 border-t border-border\">\n        {[\n          { key: 'home', Icon: House },\n          { key: 'markets', Icon: SlidersHorizontal },\n          { key: 'trade', Icon: ArrowDownUp },\n          { key: 'rewards', Icon: Gift },\n        ].map(({ key, Icon }) => (\n          <Button\n            type=\"button\"\n            variant=\"ghost\"\n            key={key}\n            onClick={() => setSelected(key)}\n            aria-pressed={selected === key}\n            className={cn(\n              'h-16 flex-col gap-1 rounded-none border-t px-1 font-mono text-xs uppercase',\n              selected === key\n                ? 'border-status-success-icon text-status-success-text'\n                : 'border-transparent text-muted-foreground',\n            )}\n          >\n            <Icon className=\"size-4\" />\n            {cryptoLabel(key)}\n          </Button>\n        ))}\n      </div>\n      <Dialog open={open} onOpenChange={setOpen}>\n        <DialogContent className=\"w-94 border-0 p-0 [&>button]:hidden\">\n          <DialogTitle className=\"sr-only\">{cryptoLabel('swapSendBuy')}</DialogTitle>\n          <DialogDescription className=\"sr-only\">{cryptoLabel('localSimulation')}</DialogDescription>\n          <CryptoSwap />\n        </DialogContent>\n      </Dialog>\n    </div>\n  )\n}\n\nexport function CryptocurrencyDemo({\n  part,\n  state = 'default',\n  kind,\n  size = 28,\n  onlyIcon = false,\n  profile = false,\n  step = 1,\n}: CryptocurrencyDemoProps) {\n  const cryptoLabel = useCryptoLabels()\n  let content: React.ReactNode\n  switch (part) {\n    case 'status-icon': {\n      const key =\n        kind === 'pending'\n          ? 'statusPending'\n          : kind === 'warning'\n            ? 'statusWarning'\n            : kind === 'cancelled'\n              ? 'statusCancelled'\n              : 'statusSuccess'\n      content = <img src={cryptoArtwork[key]} alt={cryptoLabel(kind ?? 'success')} className=\"size-3\" />\n      break\n    }\n    case 'token-icon':\n      content = (\n        <img\n          src={cryptoArtwork[tokenBySymbol(kind ?? 'btc').symbol]}\n          alt={tokenBySymbol(kind ?? 'btc').name}\n          className=\"size-6 rounded-full\"\n        />\n      )\n      break\n    case 'navigation-item':\n      content = <CryptoNavigationItem state={state} size={size} />\n      break\n    case 'navigation-search':\n      content = <CryptoNavigationSearch state={state} />\n      break\n    case 'navigation-wallet':\n      content = <CryptoWalletTrigger state={state} />\n      break\n    case 'navigation-action':\n      content = <CryptoAction kind={kind} state={state} />\n      break\n    case 'chart-item':\n      content = <CryptoSegments itemOnly state={state} />\n      break\n    case 'swap-select':\n      content = <CryptoTokenPicker appearance={kind} state={state} />\n      break\n    case 'chart-switch':\n      content = <CryptoSegments initialValue={kind} />\n      break\n    case 'table-button':\n      content = <CryptoTableButton kind={kind} state={state} />\n      break\n    case 'table-switch-item':\n      content = <CryptoSegments type=\"table\" itemOnly size={24} state={state} />\n      break\n    case 'table-tab':\n      content = <CryptoTableTabs kind={kind} state={state} />\n      break\n    case 'table-filter':\n      content = <CryptoFilter kind={kind} state={state} />\n      break\n    case 'table-switch':\n      content = <CryptoSegments type=\"table\" initialValue={kind} size={size} />\n      break\n    case 'swap-input':\n      content = <CryptoSwapInput type={kind} state={state} available={state === 'error' ? 0 : 0.0095} />\n      break\n    case 'swap':\n      content = <CryptoSwap step={step} />\n      break\n    case 'search-modal':\n      content = <CryptoSearch state={state} />\n      break\n    case 'search-input':\n      content = <CryptoSearch state={state} inputOnly />\n      break\n    case 'navigation':\n      content = <CryptoNavigation profile={profile} />\n      break\n    case 'social-button':\n      content = <CryptoSocialButton provider={kind} onlyIcon={onlyIcon} state={state} />\n      break\n    case 'menu-dropdown':\n      content = <CryptoMenu />\n      break\n    case 'favorites-dropdown':\n      content = <CryptoFavorites />\n      break\n    case 'profile-dropdown':\n      content = <CryptoMenu profile />\n      break\n    case 'wallet-dropdown':\n      content = <CryptoWallet />\n      break\n    case 'swap-token-dropdown':\n      content = <CryptoStandaloneTokenList />\n      break\n    case 'notifications-dropdown':\n      content = <CryptoNotifications />\n      break\n    case 'connect-wallet':\n      content = <CryptoConnectWallet />\n      break\n    case 'banner':\n      content = <CryptoBanner />\n      break\n    case 'filter-type':\n    case 'filter-date':\n    case 'filter-status':\n    case 'filter-token':\n      content = <CryptoFilter kind={part.slice(7)} standalone />\n      break\n    case 'mobile-navigation':\n      content = <CryptoNavigation mobile />\n      break\n    case 'mobile-bottom-navigation':\n      content = <CryptoMobileBottom />\n      break\n  }\n  return (\n    <div\n      data-slot=\"crypto-demo\"\n      data-crypto-part={part}\n      data-preview-state={state}\n      className={cn('flex max-w-full text-foreground', part === 'navigation' || part === 'banner' ? 'w-full' : 'w-fit')}\n    >\n      {content}\n    </div>\n  )\n}\n\nfunction CryptoStandaloneTokenList() {\n  const cryptoLabel = useCryptoLabels()\n  const [query, setQuery] = React.useState('')\n  const [selected, setSelected] = React.useState('')\n  return (\n    <CryptoPanel className=\"w-70 max-w-full\">\n      <SearchInput\n        aria-label={cryptoLabel('searchTokens')}\n        placeholder={cryptoLabel('searchTokens')}\n        value={query}\n        onChange={setQuery}\n        className=\"h-10 rounded-none border-0 border-b shadow-none\"\n        inputClassName=\"text-compact\"\n      />\n      <div className=\"h-68.5 overflow-auto\">\n        <CryptoTokenList\n          query={query}\n          limit={12}\n          onSelect={(token) => setSelected(cryptoLabel('selectedToken', { token: tokenBySymbol(token).name }))}\n        />\n      </div>\n      <CryptoNotice message={selected} />\n    </CryptoPanel>\n  )\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/modules/design_system/gallery/demos/feeds-code.generated.js

@@ -0,0 +1,92 @@
+const source = `import * as React from 'react'
+import { FileText, ListFilter, MoreHorizontal, RotateCcw } from 'lucide-react'
+import { useT } from '@open-mercato/shared/lib/i18n/context'
+import { ActivityFeed, ActivityFeedComment, ActivityFeedFileChip, ActivityFeedItem, ActivityFeedStatusChip } from '@open-mercato/ui/primitives/activity-feed'
+import { Avatar, AvatarStack } from '@open-mercato/ui/primitives/avatar'
+import { Button } from '@open-mercato/ui/primitives/button'
+import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from '@open-mercato/ui/primitives/dialog'
+import { NotificationFeed, NotificationFeedFooter, NotificationFeedHeader, NotificationFeedItem, NotificationFeedList } from '@open-mercato/ui/primitives/notification-feed'
+import { Popover, PopoverClose, PopoverContent, PopoverTrigger } from '@open-mercato/ui/primitives/popover'
+import { Tabs, TabsContent, TabsList, TabsTrigger } from '@open-mercato/ui/primitives/tabs'
+import { Textarea } from '@open-mercato/ui/primitives/textarea'
+
+const feedKinds = ['basic', 'file', 'comment', 'avatars', 'tasks'] as const
+type FeedKind = typeof feedKinds[number]
+const people: Record<FeedKind, string> = { basic: 'Wei Chen', file: 'Omar Haddad', comment: 'Laura Perez', avatars: 'Ines Kowalska', tasks: 'Ravi Patel' }
+
+function LocalFilePreview({ open, onOpenChange }: { open: boolean; onOpenChange: (open: boolean) => void }) {
+  const t = useT()
+  return <Dialog open={open} onOpenChange={onOpenChange}><DialogContent>
+    <DialogHeader><DialogTitle>apex-report.pdf</DialogTitle><DialogDescription>{t('design_system.gallery.samples.feeds.filePreview')}</DialogDescription></DialogHeader>
+    <p className="text-sm text-muted-foreground">{t('design_system.gallery.samples.feeds.fileBody')}</p>
+  </DialogContent></Dialog>
+}
+
+export function ActivityFeedExample() {
+  const t = useT()
+  const [filter, setFilter] = React.useState<'all' | 'file' | 'comment'>('all')
+  const [hidden, setHidden] = React.useState<FeedKind[]>([])
+  const [fileOpen, setFileOpen] = React.useState(false)
+  const [replyOpen, setReplyOpen] = React.useState(false)
+  const [draft, setDraft] = React.useState('')
+  const [reply, setReply] = React.useState('')
+  const visible = feedKinds.filter(kind => !hidden.includes(kind) && (filter === 'all' || filter === kind))
+  const title = (kind: FeedKind) => <>{people[kind]} <span className="font-normal text-muted-foreground">{t(\`design_system.gallery.samples.feeds.\${kind}Action\`)}</span></>
+  return <div className="w-full max-w-2xl space-y-5">
+    <div className="flex flex-wrap items-center gap-1" role="group" aria-label={t('design_system.gallery.samples.feeds.filter')}>
+      {(['all', 'file', 'comment'] as const).map(value => <Button key={value} size="2xs" variant="ghost" aria-pressed={filter === value} onClick={() => setFilter(value)} className="gap-1.5 px-2.5 aria-pressed:bg-status-info-bg aria-pressed:text-status-info-text">
+        {value === 'all' ? <ListFilter className="size-[18px]" /> : value === 'file' ? <FileText className="size-[18px]" /> : null}{t(\`design_system.gallery.samples.feeds.\${value}\`)}
+      </Button>)}
+      {hidden.length ? <Button variant="ghost" size="2xs" onClick={() => setHidden([])}><RotateCcw />{t('design_system.gallery.samples.feeds.restore')}</Button> : null}
+    </div>
+    <ActivityFeed className="gap-5">
+      {visible.map(kind => <ActivityFeedItem key={kind} className="gap-4 [&_[data-slot=activity-feed-item-title]]:leading-5 [&_[data-slot=activity-feed-item-title]>span:first-child]:font-medium" avatar={<Avatar size={32} label={people[kind]} />} title={title(kind)} timestamp={t('design_system.gallery.samples.feeds.time')}
+        actions={<Popover><PopoverTrigger asChild><Button variant="ghost" size="icon" className="size-6" aria-label={t('design_system.gallery.samples.feeds.actions', { name: people[kind] })}><MoreHorizontal /></Button></PopoverTrigger><PopoverContent align="end" className="w-auto p-1"><PopoverClose asChild><Button variant="ghost" size="sm" onClick={() => setHidden(items => [...items, kind])}>{t('design_system.gallery.samples.feeds.hide')}</Button></PopoverClose></PopoverContent></Popover>}>
+        {kind === 'file' ? <ActivityFeedFileChip name="apex-report.pdf" size="4 MB" onDownload={() => setFileOpen(true)} downloadAriaLabel={t('design_system.gallery.samples.feeds.openFile')} /> : null}
+        {kind === 'comment' ? <div className="w-full space-y-2"><ActivityFeedComment className="[&_[data-slot=activity-feed-comment-body]]:whitespace-normal [&_[data-slot=activity-feed-comment-body]]:break-words" onReply={() => setReplyOpen(value => !value)} replyLabel={t('design_system.gallery.samples.feeds.reply')}>{t('design_system.gallery.samples.feeds.commentBody')}</ActivityFeedComment>
+          {replyOpen ? <form className="space-y-2" onSubmit={event => { event.preventDefault(); if (draft.trim()) { setReply(draft.trim()); setDraft(''); setReplyOpen(false) } }}><Textarea aria-label={t('design_system.gallery.samples.feeds.reply')} value={draft} onChange={event => setDraft(event.target.value)} /><Button size="sm" type="submit" disabled={!draft.trim()}>{t('design_system.gallery.samples.feeds.saveReply')}</Button></form> : null}
+          {reply ? <p className="rounded-md bg-muted p-3 text-sm" role="status">{reply}</p> : null}
+        </div> : null}
+        {kind === 'avatars' ? <div className="inline-flex items-center gap-1.5 rounded-full border border-border bg-background py-0.5 pl-0.5 pr-2 shadow-xs"><AvatarStack size={24} max={3}><Avatar size={24} label="Wei Chen" /><Avatar size={24} label="Laura Perez" /><Avatar size={24} label="Omar Haddad" /></AvatarStack><span className="text-xs text-muted-foreground">+4</span></div> : null}
+        {kind === 'tasks' ? <><ActivityFeedStatusChip status="success">{t('design_system.gallery.samples.feeds.approved')}</ActivityFeedStatusChip><ActivityFeedStatusChip status="warning">{t('design_system.gallery.samples.feeds.review')}</ActivityFeedStatusChip><ActivityFeedStatusChip status="pending">{t('design_system.gallery.samples.feeds.pending')}</ActivityFeedStatusChip><ActivityFeedStatusChip status="error">{t('design_system.gallery.samples.feeds.blocked')}</ActivityFeedStatusChip></> : null}
+      </ActivityFeedItem>)}
+    </ActivityFeed>
+    {!visible.length ? <p className="text-sm text-muted-foreground" role="status">{t('design_system.gallery.samples.feeds.empty')}</p> : null}
+    <LocalFilePreview open={fileOpen} onOpenChange={setFileOpen} />
+  </div>
+}
+
+const notificationKinds = ['basic', 'button', 'file', 'message'] as const
+export function NotificationFeedExample({ tabs = 4 }: { tabs?: 2 | 3 | 4 }) {
+  const t = useT()
+  const [filter, setFilter] = React.useState('all')
+  const [archived, setArchived] = React.useState(false)
+  const [read, setRead] = React.useState(false)
+  const [decision, setDecision] = React.useState<'approved' | 'denied' | null>(null)
+  const [fileOpen, setFileOpen] = React.useState(false)
+  const filters = ['all', 'unread', 'file', 'message'].slice(0, tabs)
+  const visible = archived || (filter === 'unread' && read) ? [] : notificationKinds.filter(kind => !['file', 'message'].includes(filter) || kind === filter)
+  return <div className="w-full max-w-xl space-y-3"><NotificationFeed>
+    <NotificationFeedHeader className="flex-wrap" title={t('design_system.gallery.samples.feeds.notifications')}><Button size="2xs" variant="ghost" onClick={() => setRead(true)} disabled={read || archived}>{t('design_system.gallery.samples.feeds.markRead')}</Button></NotificationFeedHeader>
+    <Tabs value={filter} onValueChange={setFilter} variant="underline"><TabsList aria-label={t('design_system.gallery.samples.feeds.filter')} className="w-full px-3">{filters.map(value => <TabsTrigger key={value} value={value}>{t(\`design_system.gallery.samples.feeds.\${value}\`)}</TabsTrigger>)}</TabsList><TabsContent value={filter} className="mt-0">
+    <NotificationFeedList className="gap-1 divide-y-0 p-2">
+      {visible.map(kind => <NotificationFeedItem key={kind} className="rounded-lg p-3 hover:bg-muted/40 [&_[data-slot=notification-feed-item-title]]:font-medium" icon={<Avatar size={40} label="Wei Chen" />} title={t(\`design_system.gallery.samples.feeds.notification\${kind}\`)} timestamp={<>{t('design_system.gallery.samples.feeds.time')} \xB7 Apex</>} unread={!read}>
+        {kind === 'button' ? decision ? <p className="text-sm" role="status">{t(\`design_system.gallery.samples.feeds.\${decision}\`)}</p> : <><Button variant="outline" size="sm" onClick={() => setDecision('denied')}>{t('design_system.gallery.samples.feeds.deny')}</Button><Button variant="primary-filled" size="sm" onClick={() => setDecision('approved')}>{t('design_system.gallery.samples.feeds.approve')}</Button></> : null}
+        {kind === 'file' ? <ActivityFeedFileChip name="apex-report.pdf" size="4 MB" onDownload={() => setFileOpen(true)} downloadAriaLabel={t('design_system.gallery.samples.feeds.openFile')} /> : null}
+        {kind === 'message' ? <p className="rounded-md rounded-tl-sm border border-border bg-background px-3 py-2 text-sm text-muted-foreground shadow-xs">{t('design_system.gallery.samples.feeds.messageBody')}</p> : null}
+      </NotificationFeedItem>)}
+    </NotificationFeedList>
+    {!visible.length ? <p className="p-5 text-center text-sm text-muted-foreground" role="status">{t('design_system.gallery.samples.feeds.empty')}</p> : null}
+    <NotificationFeedFooter><Button variant="outline" size="sm" className="w-full" onClick={() => setArchived(true)} disabled={archived}>{t('design_system.gallery.samples.feeds.archive')}</Button></NotificationFeedFooter></TabsContent></Tabs>
+  </NotificationFeed><Button variant="ghost" size="sm" onClick={() => { setArchived(false); setRead(false); setDecision(null); setFilter('all') }}><RotateCcw />{t('design_system.gallery.samples.feeds.restore')}</Button><LocalFilePreview open={fileOpen} onOpenChange={setFileOpen} /></div>
+}
+`;
+const activityFeedExampleCode = source + "\n<ActivityFeedExample />\n";
+const notificationFeedExampleCode = (tabs) => source + `
+<NotificationFeedExample tabs={${tabs}} />
+`;
+export {
+  activityFeedExampleCode,
+  notificationFeedExampleCode
+};
+//# sourceMappingURL=feeds-code.generated.js.map

package/dist/modules/design_system/gallery/demos/feeds-code.generated.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/modules/design_system/gallery/demos/feeds-code.generated.ts"],
+  "sourcesContent": ["// Generated by yarn storybook:generate from feeds.tsx.\nconst source = \"import * as React from 'react'\\nimport { FileText, ListFilter, MoreHorizontal, RotateCcw } from 'lucide-react'\\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\\nimport { ActivityFeed, ActivityFeedComment, ActivityFeedFileChip, ActivityFeedItem, ActivityFeedStatusChip } from '@open-mercato/ui/primitives/activity-feed'\\nimport { Avatar, AvatarStack } from '@open-mercato/ui/primitives/avatar'\\nimport { Button } from '@open-mercato/ui/primitives/button'\\nimport { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from '@open-mercato/ui/primitives/dialog'\\nimport { NotificationFeed, NotificationFeedFooter, NotificationFeedHeader, NotificationFeedItem, NotificationFeedList } from '@open-mercato/ui/primitives/notification-feed'\\nimport { Popover, PopoverClose, PopoverContent, PopoverTrigger } from '@open-mercato/ui/primitives/popover'\\nimport { Tabs, TabsContent, TabsList, TabsTrigger } from '@open-mercato/ui/primitives/tabs'\\nimport { Textarea } from '@open-mercato/ui/primitives/textarea'\\n\\nconst feedKinds = ['basic', 'file', 'comment', 'avatars', 'tasks'] as const\\ntype FeedKind = typeof feedKinds[number]\\nconst people: Record<FeedKind, string> = { basic: 'Wei Chen', file: 'Omar Haddad', comment: 'Laura Perez', avatars: 'Ines Kowalska', tasks: 'Ravi Patel' }\\n\\nfunction LocalFilePreview({ open, onOpenChange }: { open: boolean; onOpenChange: (open: boolean) => void }) {\\n  const t = useT()\\n  return <Dialog open={open} onOpenChange={onOpenChange}><DialogContent>\\n    <DialogHeader><DialogTitle>apex-report.pdf</DialogTitle><DialogDescription>{t('design_system.gallery.samples.feeds.filePreview')}</DialogDescription></DialogHeader>\\n    <p className=\\\"text-sm text-muted-foreground\\\">{t('design_system.gallery.samples.feeds.fileBody')}</p>\\n  </DialogContent></Dialog>\\n}\\n\\nexport function ActivityFeedExample() {\\n  const t = useT()\\n  const [filter, setFilter] = React.useState<'all' | 'file' | 'comment'>('all')\\n  const [hidden, setHidden] = React.useState<FeedKind[]>([])\\n  const [fileOpen, setFileOpen] = React.useState(false)\\n  const [replyOpen, setReplyOpen] = React.useState(false)\\n  const [draft, setDraft] = React.useState('')\\n  const [reply, setReply] = React.useState('')\\n  const visible = feedKinds.filter(kind => !hidden.includes(kind) && (filter === 'all' || filter === kind))\\n  const title = (kind: FeedKind) => <>{people[kind]} <span className=\\\"font-normal text-muted-foreground\\\">{t(`design_system.gallery.samples.feeds.${kind}Action`)}</span></>\\n  return <div className=\\\"w-full max-w-2xl space-y-5\\\">\\n    <div className=\\\"flex flex-wrap items-center gap-1\\\" role=\\\"group\\\" aria-label={t('design_system.gallery.samples.feeds.filter')}>\\n      {(['all', 'file', 'comment'] as const).map(value => <Button key={value} size=\\\"2xs\\\" variant=\\\"ghost\\\" aria-pressed={filter === value} onClick={() => setFilter(value)} className=\\\"gap-1.5 px-2.5 aria-pressed:bg-status-info-bg aria-pressed:text-status-info-text\\\">\\n        {value === 'all' ? <ListFilter className=\\\"size-[18px]\\\" /> : value === 'file' ? <FileText className=\\\"size-[18px]\\\" /> : null}{t(`design_system.gallery.samples.feeds.${value}`)}\\n      </Button>)}\\n      {hidden.length ? <Button variant=\\\"ghost\\\" size=\\\"2xs\\\" onClick={() => setHidden([])}><RotateCcw />{t('design_system.gallery.samples.feeds.restore')}</Button> : null}\\n    </div>\\n    <ActivityFeed className=\\\"gap-5\\\">\\n      {visible.map(kind => <ActivityFeedItem key={kind} className=\\\"gap-4 [&_[data-slot=activity-feed-item-title]]:leading-5 [&_[data-slot=activity-feed-item-title]>span:first-child]:font-medium\\\" avatar={<Avatar size={32} label={people[kind]} />} title={title(kind)} timestamp={t('design_system.gallery.samples.feeds.time')}\\n        actions={<Popover><PopoverTrigger asChild><Button variant=\\\"ghost\\\" size=\\\"icon\\\" className=\\\"size-6\\\" aria-label={t('design_system.gallery.samples.feeds.actions', { name: people[kind] })}><MoreHorizontal /></Button></PopoverTrigger><PopoverContent align=\\\"end\\\" className=\\\"w-auto p-1\\\"><PopoverClose asChild><Button variant=\\\"ghost\\\" size=\\\"sm\\\" onClick={() => setHidden(items => [...items, kind])}>{t('design_system.gallery.samples.feeds.hide')}</Button></PopoverClose></PopoverContent></Popover>}>\\n        {kind === 'file' ? <ActivityFeedFileChip name=\\\"apex-report.pdf\\\" size=\\\"4 MB\\\" onDownload={() => setFileOpen(true)} downloadAriaLabel={t('design_system.gallery.samples.feeds.openFile')} /> : null}\\n        {kind === 'comment' ? <div className=\\\"w-full space-y-2\\\"><ActivityFeedComment className=\\\"[&_[data-slot=activity-feed-comment-body]]:whitespace-normal [&_[data-slot=activity-feed-comment-body]]:break-words\\\" onReply={() => setReplyOpen(value => !value)} replyLabel={t('design_system.gallery.samples.feeds.reply')}>{t('design_system.gallery.samples.feeds.commentBody')}</ActivityFeedComment>\\n          {replyOpen ? <form className=\\\"space-y-2\\\" onSubmit={event => { event.preventDefault(); if (draft.trim()) { setReply(draft.trim()); setDraft(''); setReplyOpen(false) } }}><Textarea aria-label={t('design_system.gallery.samples.feeds.reply')} value={draft} onChange={event => setDraft(event.target.value)} /><Button size=\\\"sm\\\" type=\\\"submit\\\" disabled={!draft.trim()}>{t('design_system.gallery.samples.feeds.saveReply')}</Button></form> : null}\\n          {reply ? <p className=\\\"rounded-md bg-muted p-3 text-sm\\\" role=\\\"status\\\">{reply}</p> : null}\\n        </div> : null}\\n        {kind === 'avatars' ? <div className=\\\"inline-flex items-center gap-1.5 rounded-full border border-border bg-background py-0.5 pl-0.5 pr-2 shadow-xs\\\"><AvatarStack size={24} max={3}><Avatar size={24} label=\\\"Wei Chen\\\" /><Avatar size={24} label=\\\"Laura Perez\\\" /><Avatar size={24} label=\\\"Omar Haddad\\\" /></AvatarStack><span className=\\\"text-xs text-muted-foreground\\\">+4</span></div> : null}\\n        {kind === 'tasks' ? <><ActivityFeedStatusChip status=\\\"success\\\">{t('design_system.gallery.samples.feeds.approved')}</ActivityFeedStatusChip><ActivityFeedStatusChip status=\\\"warning\\\">{t('design_system.gallery.samples.feeds.review')}</ActivityFeedStatusChip><ActivityFeedStatusChip status=\\\"pending\\\">{t('design_system.gallery.samples.feeds.pending')}</ActivityFeedStatusChip><ActivityFeedStatusChip status=\\\"error\\\">{t('design_system.gallery.samples.feeds.blocked')}</ActivityFeedStatusChip></> : null}\\n      </ActivityFeedItem>)}\\n    </ActivityFeed>\\n    {!visible.length ? <p className=\\\"text-sm text-muted-foreground\\\" role=\\\"status\\\">{t('design_system.gallery.samples.feeds.empty')}</p> : null}\\n    <LocalFilePreview open={fileOpen} onOpenChange={setFileOpen} />\\n  </div>\\n}\\n\\nconst notificationKinds = ['basic', 'button', 'file', 'message'] as const\\nexport function NotificationFeedExample({ tabs = 4 }: { tabs?: 2 | 3 | 4 }) {\\n  const t = useT()\\n  const [filter, setFilter] = React.useState('all')\\n  const [archived, setArchived] = React.useState(false)\\n  const [read, setRead] = React.useState(false)\\n  const [decision, setDecision] = React.useState<'approved' | 'denied' | null>(null)\\n  const [fileOpen, setFileOpen] = React.useState(false)\\n  const filters = ['all', 'unread', 'file', 'message'].slice(0, tabs)\\n  const visible = archived || (filter === 'unread' && read) ? [] : notificationKinds.filter(kind => !['file', 'message'].includes(filter) || kind === filter)\\n  return <div className=\\\"w-full max-w-xl space-y-3\\\"><NotificationFeed>\\n    <NotificationFeedHeader className=\\\"flex-wrap\\\" title={t('design_system.gallery.samples.feeds.notifications')}><Button size=\\\"2xs\\\" variant=\\\"ghost\\\" onClick={() => setRead(true)} disabled={read || archived}>{t('design_system.gallery.samples.feeds.markRead')}</Button></NotificationFeedHeader>\\n    <Tabs value={filter} onValueChange={setFilter} variant=\\\"underline\\\"><TabsList aria-label={t('design_system.gallery.samples.feeds.filter')} className=\\\"w-full px-3\\\">{filters.map(value => <TabsTrigger key={value} value={value}>{t(`design_system.gallery.samples.feeds.${value}`)}</TabsTrigger>)}</TabsList><TabsContent value={filter} className=\\\"mt-0\\\">\\n    <NotificationFeedList className=\\\"gap-1 divide-y-0 p-2\\\">\\n      {visible.map(kind => <NotificationFeedItem key={kind} className=\\\"rounded-lg p-3 hover:bg-muted/40 [&_[data-slot=notification-feed-item-title]]:font-medium\\\" icon={<Avatar size={40} label=\\\"Wei Chen\\\" />} title={t(`design_system.gallery.samples.feeds.notification${kind}`)} timestamp={<>{t('design_system.gallery.samples.feeds.time')} \u00B7 Apex</>} unread={!read}>\\n        {kind === 'button' ? decision ? <p className=\\\"text-sm\\\" role=\\\"status\\\">{t(`design_system.gallery.samples.feeds.${decision}`)}</p> : <><Button variant=\\\"outline\\\" size=\\\"sm\\\" onClick={() => setDecision('denied')}>{t('design_system.gallery.samples.feeds.deny')}</Button><Button variant=\\\"primary-filled\\\" size=\\\"sm\\\" onClick={() => setDecision('approved')}>{t('design_system.gallery.samples.feeds.approve')}</Button></> : null}\\n        {kind === 'file' ? <ActivityFeedFileChip name=\\\"apex-report.pdf\\\" size=\\\"4 MB\\\" onDownload={() => setFileOpen(true)} downloadAriaLabel={t('design_system.gallery.samples.feeds.openFile')} /> : null}\\n        {kind === 'message' ? <p className=\\\"rounded-md rounded-tl-sm border border-border bg-background px-3 py-2 text-sm text-muted-foreground shadow-xs\\\">{t('design_system.gallery.samples.feeds.messageBody')}</p> : null}\\n      </NotificationFeedItem>)}\\n    </NotificationFeedList>\\n    {!visible.length ? <p className=\\\"p-5 text-center text-sm text-muted-foreground\\\" role=\\\"status\\\">{t('design_system.gallery.samples.feeds.empty')}</p> : null}\\n    <NotificationFeedFooter><Button variant=\\\"outline\\\" size=\\\"sm\\\" className=\\\"w-full\\\" onClick={() => setArchived(true)} disabled={archived}>{t('design_system.gallery.samples.feeds.archive')}</Button></NotificationFeedFooter></TabsContent></Tabs>\\n  </NotificationFeed><Button variant=\\\"ghost\\\" size=\\\"sm\\\" onClick={() => { setArchived(false); setRead(false); setDecision(null); setFilter('all') }}><RotateCcw />{t('design_system.gallery.samples.feeds.restore')}</Button><LocalFilePreview open={fileOpen} onOpenChange={setFileOpen} /></div>\\n}\\n\"\nexport const activityFeedExampleCode = source + \"\\n<ActivityFeedExample />\\n\"\nexport const notificationFeedExampleCode = (tabs: 2 | 3 | 4) => source + `\\n<NotificationFeedExample tabs={${tabs}} />\\n`\n"],
+  "mappings": "AACA,MAAM,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACR,MAAM,0BAA0B,SAAS;AACzC,MAAM,8BAA8B,CAAC,SAAoB,SAAS;AAAA,iCAAoC,IAAI;AAAA;",
+  "names": []
+}

package/dist/modules/design_system/gallery/demos/feeds.js

@@ -0,0 +1,148 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { FileText, ListFilter, MoreHorizontal, RotateCcw } from "lucide-react";
+import { useT } from "@open-mercato/shared/lib/i18n/context";
+import { ActivityFeed, ActivityFeedComment, ActivityFeedFileChip, ActivityFeedItem, ActivityFeedStatusChip } from "@open-mercato/ui/primitives/activity-feed";
+import { Avatar, AvatarStack } from "@open-mercato/ui/primitives/avatar";
+import { Button } from "@open-mercato/ui/primitives/button";
+import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from "@open-mercato/ui/primitives/dialog";
+import { NotificationFeed, NotificationFeedFooter, NotificationFeedHeader, NotificationFeedItem, NotificationFeedList } from "@open-mercato/ui/primitives/notification-feed";
+import { Popover, PopoverClose, PopoverContent, PopoverTrigger } from "@open-mercato/ui/primitives/popover";
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "@open-mercato/ui/primitives/tabs";
+import { Textarea } from "@open-mercato/ui/primitives/textarea";
+const feedKinds = ["basic", "file", "comment", "avatars", "tasks"];
+const people = { basic: "Wei Chen", file: "Omar Haddad", comment: "Laura Perez", avatars: "Ines Kowalska", tasks: "Ravi Patel" };
+function LocalFilePreview({ open, onOpenChange }) {
+  const t = useT();
+  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs(DialogContent, { children: [
+    /* @__PURE__ */ jsxs(DialogHeader, { children: [
+      /* @__PURE__ */ jsx(DialogTitle, { children: "apex-report.pdf" }),
+      /* @__PURE__ */ jsx(DialogDescription, { children: t("design_system.gallery.samples.feeds.filePreview") })
+    ] }),
+    /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: t("design_system.gallery.samples.feeds.fileBody") })
+  ] }) });
+}
+function ActivityFeedExample() {
+  const t = useT();
+  const [filter, setFilter] = React.useState("all");
+  const [hidden, setHidden] = React.useState([]);
+  const [fileOpen, setFileOpen] = React.useState(false);
+  const [replyOpen, setReplyOpen] = React.useState(false);
+  const [draft, setDraft] = React.useState("");
+  const [reply, setReply] = React.useState("");
+  const visible = feedKinds.filter((kind) => !hidden.includes(kind) && (filter === "all" || filter === kind));
+  const title = (kind) => /* @__PURE__ */ jsxs(Fragment, { children: [
+    people[kind],
+    " ",
+    /* @__PURE__ */ jsx("span", { className: "font-normal text-muted-foreground", children: t(`design_system.gallery.samples.feeds.${kind}Action`) })
+  ] });
+  return /* @__PURE__ */ jsxs("div", { className: "w-full max-w-2xl space-y-5", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-1", role: "group", "aria-label": t("design_system.gallery.samples.feeds.filter"), children: [
+      ["all", "file", "comment"].map((value) => /* @__PURE__ */ jsxs(Button, { size: "2xs", variant: "ghost", "aria-pressed": filter === value, onClick: () => setFilter(value), className: "gap-1.5 px-2.5 aria-pressed:bg-status-info-bg aria-pressed:text-status-info-text", children: [
+        value === "all" ? /* @__PURE__ */ jsx(ListFilter, { className: "size-[18px]" }) : value === "file" ? /* @__PURE__ */ jsx(FileText, { className: "size-[18px]" }) : null,
+        t(`design_system.gallery.samples.feeds.${value}`)
+      ] }, value)),
+      hidden.length ? /* @__PURE__ */ jsxs(Button, { variant: "ghost", size: "2xs", onClick: () => setHidden([]), children: [
+        /* @__PURE__ */ jsx(RotateCcw, {}),
+        t("design_system.gallery.samples.feeds.restore")
+      ] }) : null
+    ] }),
+    /* @__PURE__ */ jsx(ActivityFeed, { className: "gap-5", children: visible.map((kind) => /* @__PURE__ */ jsxs(
+      ActivityFeedItem,
+      {
+        className: "gap-4 [&_[data-slot=activity-feed-item-title]]:leading-5 [&_[data-slot=activity-feed-item-title]>span:first-child]:font-medium",
+        avatar: /* @__PURE__ */ jsx(Avatar, { size: 32, label: people[kind] }),
+        title: title(kind),
+        timestamp: t("design_system.gallery.samples.feeds.time"),
+        actions: /* @__PURE__ */ jsxs(Popover, { children: [
+          /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "icon", className: "size-6", "aria-label": t("design_system.gallery.samples.feeds.actions", { name: people[kind] }), children: /* @__PURE__ */ jsx(MoreHorizontal, {}) }) }),
+          /* @__PURE__ */ jsx(PopoverContent, { align: "end", className: "w-auto p-1", children: /* @__PURE__ */ jsx(PopoverClose, { asChild: true, children: /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", onClick: () => setHidden((items) => [...items, kind]), children: t("design_system.gallery.samples.feeds.hide") }) }) })
+        ] }),
+        children: [
+          kind === "file" ? /* @__PURE__ */ jsx(ActivityFeedFileChip, { name: "apex-report.pdf", size: "4 MB", onDownload: () => setFileOpen(true), downloadAriaLabel: t("design_system.gallery.samples.feeds.openFile") }) : null,
+          kind === "comment" ? /* @__PURE__ */ jsxs("div", { className: "w-full space-y-2", children: [
+            /* @__PURE__ */ jsx(ActivityFeedComment, { className: "[&_[data-slot=activity-feed-comment-body]]:whitespace-normal [&_[data-slot=activity-feed-comment-body]]:break-words", onReply: () => setReplyOpen((value) => !value), replyLabel: t("design_system.gallery.samples.feeds.reply"), children: t("design_system.gallery.samples.feeds.commentBody") }),
+            replyOpen ? /* @__PURE__ */ jsxs("form", { className: "space-y-2", onSubmit: (event) => {
+              event.preventDefault();
+              if (draft.trim()) {
+                setReply(draft.trim());
+                setDraft("");
+                setReplyOpen(false);
+              }
+            }, children: [
+              /* @__PURE__ */ jsx(Textarea, { "aria-label": t("design_system.gallery.samples.feeds.reply"), value: draft, onChange: (event) => setDraft(event.target.value) }),
+              /* @__PURE__ */ jsx(Button, { size: "sm", type: "submit", disabled: !draft.trim(), children: t("design_system.gallery.samples.feeds.saveReply") })
+            ] }) : null,
+            reply ? /* @__PURE__ */ jsx("p", { className: "rounded-md bg-muted p-3 text-sm", role: "status", children: reply }) : null
+          ] }) : null,
+          kind === "avatars" ? /* @__PURE__ */ jsxs("div", { className: "inline-flex items-center gap-1.5 rounded-full border border-border bg-background py-0.5 pl-0.5 pr-2 shadow-xs", children: [
+            /* @__PURE__ */ jsxs(AvatarStack, { size: 24, max: 3, children: [
+              /* @__PURE__ */ jsx(Avatar, { size: 24, label: "Wei Chen" }),
+              /* @__PURE__ */ jsx(Avatar, { size: 24, label: "Laura Perez" }),
+              /* @__PURE__ */ jsx(Avatar, { size: 24, label: "Omar Haddad" })
+            ] }),
+            /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: "+4" })
+          ] }) : null,
+          kind === "tasks" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(ActivityFeedStatusChip, { status: "success", children: t("design_system.gallery.samples.feeds.approved") }),
+            /* @__PURE__ */ jsx(ActivityFeedStatusChip, { status: "warning", children: t("design_system.gallery.samples.feeds.review") }),
+            /* @__PURE__ */ jsx(ActivityFeedStatusChip, { status: "pending", children: t("design_system.gallery.samples.feeds.pending") }),
+            /* @__PURE__ */ jsx(ActivityFeedStatusChip, { status: "error", children: t("design_system.gallery.samples.feeds.blocked") })
+          ] }) : null
+        ]
+      },
+      kind
+    )) }),
+    !visible.length ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", role: "status", children: t("design_system.gallery.samples.feeds.empty") }) : null,
+    /* @__PURE__ */ jsx(LocalFilePreview, { open: fileOpen, onOpenChange: setFileOpen })
+  ] });
+}
+const notificationKinds = ["basic", "button", "file", "message"];
+function NotificationFeedExample({ tabs = 4 }) {
+  const t = useT();
+  const [filter, setFilter] = React.useState("all");
+  const [archived, setArchived] = React.useState(false);
+  const [read, setRead] = React.useState(false);
+  const [decision, setDecision] = React.useState(null);
+  const [fileOpen, setFileOpen] = React.useState(false);
+  const filters = ["all", "unread", "file", "message"].slice(0, tabs);
+  const visible = archived || filter === "unread" && read ? [] : notificationKinds.filter((kind) => !["file", "message"].includes(filter) || kind === filter);
+  return /* @__PURE__ */ jsxs("div", { className: "w-full max-w-xl space-y-3", children: [
+    /* @__PURE__ */ jsxs(NotificationFeed, { children: [
+      /* @__PURE__ */ jsx(NotificationFeedHeader, { className: "flex-wrap", title: t("design_system.gallery.samples.feeds.notifications"), children: /* @__PURE__ */ jsx(Button, { size: "2xs", variant: "ghost", onClick: () => setRead(true), disabled: read || archived, children: t("design_system.gallery.samples.feeds.markRead") }) }),
+      /* @__PURE__ */ jsxs(Tabs, { value: filter, onValueChange: setFilter, variant: "underline", children: [
+        /* @__PURE__ */ jsx(TabsList, { "aria-label": t("design_system.gallery.samples.feeds.filter"), className: "w-full px-3", children: filters.map((value) => /* @__PURE__ */ jsx(TabsTrigger, { value, children: t(`design_system.gallery.samples.feeds.${value}`) }, value)) }),
+        /* @__PURE__ */ jsxs(TabsContent, { value: filter, className: "mt-0", children: [
+          /* @__PURE__ */ jsx(NotificationFeedList, { className: "gap-1 divide-y-0 p-2", children: visible.map((kind) => /* @__PURE__ */ jsxs(NotificationFeedItem, { className: "rounded-lg p-3 hover:bg-muted/40 [&_[data-slot=notification-feed-item-title]]:font-medium", icon: /* @__PURE__ */ jsx(Avatar, { size: 40, label: "Wei Chen" }), title: t(`design_system.gallery.samples.feeds.notification${kind}`), timestamp: /* @__PURE__ */ jsxs(Fragment, { children: [
+            t("design_system.gallery.samples.feeds.time"),
+            " \xB7 Apex"
+          ] }), unread: !read, children: [
+            kind === "button" ? decision ? /* @__PURE__ */ jsx("p", { className: "text-sm", role: "status", children: t(`design_system.gallery.samples.feeds.${decision}`) }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(Button, { variant: "outline", size: "sm", onClick: () => setDecision("denied"), children: t("design_system.gallery.samples.feeds.deny") }),
+              /* @__PURE__ */ jsx(Button, { variant: "primary-filled", size: "sm", onClick: () => setDecision("approved"), children: t("design_system.gallery.samples.feeds.approve") })
+            ] }) : null,
+            kind === "file" ? /* @__PURE__ */ jsx(ActivityFeedFileChip, { name: "apex-report.pdf", size: "4 MB", onDownload: () => setFileOpen(true), downloadAriaLabel: t("design_system.gallery.samples.feeds.openFile") }) : null,
+            kind === "message" ? /* @__PURE__ */ jsx("p", { className: "rounded-md rounded-tl-sm border border-border bg-background px-3 py-2 text-sm text-muted-foreground shadow-xs", children: t("design_system.gallery.samples.feeds.messageBody") }) : null
+          ] }, kind)) }),
+          !visible.length ? /* @__PURE__ */ jsx("p", { className: "p-5 text-center text-sm text-muted-foreground", role: "status", children: t("design_system.gallery.samples.feeds.empty") }) : null,
+          /* @__PURE__ */ jsx(NotificationFeedFooter, { children: /* @__PURE__ */ jsx(Button, { variant: "outline", size: "sm", className: "w-full", onClick: () => setArchived(true), disabled: archived, children: t("design_system.gallery.samples.feeds.archive") }) })
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs(Button, { variant: "ghost", size: "sm", onClick: () => {
+      setArchived(false);
+      setRead(false);
+      setDecision(null);
+      setFilter("all");
+    }, children: [
+      /* @__PURE__ */ jsx(RotateCcw, {}),
+      t("design_system.gallery.samples.feeds.restore")
+    ] }),
+    /* @__PURE__ */ jsx(LocalFilePreview, { open: fileOpen, onOpenChange: setFileOpen })
+  ] });
+}
+export {
+  ActivityFeedExample,
+  NotificationFeedExample
+};
+//# sourceMappingURL=feeds.js.map