{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "pinned-site",
  "title": "Pinned site section",
  "description": "Pinned sites shown within SitecoreAI.",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "https://blok.sitecore.com/r/theme.json",
    "https://blok.sitecore.com/r/button.json",
    "https://blok.sitecore.com/r/all-site.json",
    "https://blok.sitecore.com/r/site-card.json"
  ],
  "files": [
    {
      "path": "src/components/bloks/pinned-sites-section.tsx",
      "content": "\"use client\";\n\nimport { SiteCard } from \"@/components/bloks/site-card\";\nimport { Button } from \"@/components/ui/button\";\nimport EmptyPin from \"@/lib/empty-pin.svg\";\nimport type { ComponentProps } from \"react\";\n\nconst getSvgUrl = (svg: unknown): string => {\n  if (typeof svg === \"string\") {\n    return svg;\n  }\n  if (svg && typeof svg === \"object\") {\n    const svgObj = svg as Record<string, unknown>;\n    return (svgObj.src as string) || (svgObj.default as string) || String(svg);\n  }\n  return String(svg || \"\");\n};\n\ninterface SiteData {\n  id: string;\n  name: string;\n  displayName: string;\n  collectionName?: string;\n  thumbnail: {\n    url: string;\n  };\n  permissions: {\n    canRename?: boolean;\n    canCreate?: boolean;\n  };\n  hosts: Array<{\n    targetHostname?: string;\n  }>;\n  collectionId: string;\n}\n\ninterface FooterButton {\n  icon: React.ReactNode;\n  label: string;\n  onClick: () => void;\n}\n\ninterface DropdownAction {\n  icon: React.ReactNode;\n  label: string;\n  onClick: () => void;\n  show?: boolean;\n}\n\ninterface PinnedSitesProps<T extends SiteData> {\n  allSites?: T[];\n  pinnedSiteIds?: string[];\n  onUnpin?: (siteId: string) => void;\n  getFooterButtons: (site: T) => FooterButton[];\n  getDropdownActions?: (site: T) => DropdownAction[];\n}\n\nexport function PinnedSitesSection<T extends SiteData>({\n  allSites = [],\n  pinnedSiteIds = [],\n  onUnpin,\n  getFooterButtons,\n  getDropdownActions,\n  ...props\n}: PinnedSitesProps<T> & ComponentProps<\"div\">) {\n  const pinnedSiteIdsSet = new Set(pinnedSiteIds);\n  const pinnedSites = allSites.filter((site) => pinnedSiteIdsSet.has(site.id));\n\n  return (\n    <div className=\"w-full space-y-6\" {...props}>\n      {/* Pinned Sites Section */}\n      <section className=\"w-full bg-subtle-bg rounded-lg p-6\">\n        {/* Header */}\n        <div className=\"mb-4\">\n          <h2 className=\"text-lg font-semibold\">Pinned Sites</h2>\n        </div>\n\n        {/* Horizontal scrollable container */}\n        {pinnedSites.length > 0 ? (\n          <div className=\"overflow-x-auto -mx-6 px-6\">\n            <div className=\"flex gap-4 pb-4\">\n              {pinnedSites.map((site) => (\n                <div key={site.id}>\n                  <SiteCard\n                    site={site}\n                    onUnpin={onUnpin}\n                    showDropdownMenu={!!getDropdownActions}\n                    footerButtons={getFooterButtons(site)}\n                    dropdownActions={getDropdownActions?.(site) || []}\n                  />\n                </div>\n              ))}\n            </div>\n          </div>\n        ) : (\n          <div className=\"flex flex-col items-center justify-center py-12 px-6\">\n            <div className=\"w-16 h-16 rounded-full bg-muted flex items-center justify-center mb-4\">\n              <img\n                src={getSvgUrl(EmptyPin)}\n                alt=\"Pin icon\"\n                width={80}\n                height={80}\n                className=\"object-contain\"\n              />\n            </div>\n            <h3 className=\"text-base font-semibold text-foreground mb-2\">\n              Keep what matters close\n            </h3>\n            <p className=\"text-sm text-muted-foreground text-center mb-4\">\n              Pin the sites you work on most to keep them front and center,\n              making it easier to switch, manage, and stay productive\n            </p>\n            <Button variant=\"link\" className=\"text-sm font-semibold\">\n              Start pinning sites\n            </Button>\n          </div>\n        )}\n      </section>\n    </div>\n  );\n}\n",
      "type": "registry:ui",
      "target": "src/components/bloks/pinned-sites-section.tsx"
    },
    {
      "path": "src/lib/empty-pin.svg",
      "content": "<svg width=\"64\" height=\"64\" viewBox=\"0 0 64 64\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<g clip-path=\"url(#clip0_10848_100094)\">\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M33.3592 5.80939C39.8425 6.34939 46.8011 4.50994 51.9432 8.46041C57.5795 12.7905 59.9756 19.8566 60.7844 26.8788C61.7167 34.9732 62.4293 44.1706 56.7327 50.044C50.9847 55.9703 41.4341 57.0332 33.3592 55.1552C26.5524 53.5721 23.9658 45.9834 18.8707 41.2382C13.4437 36.1839 4.4985 34.1082 2.9978 26.8788C1.35458 18.9629 4.68525 9.71601 11.365 5.0806C17.6116 0.745678 25.7602 5.17646 33.3592 5.80939Z\" fill=\"white\" fill-opacity=\"0.66\"/>\n<g clip-path=\"url(#clip1_10848_100094)\" filter=\"url(#filter0_dd_10848_100094)\">\n<path d=\"M46.1752 14.4994L45.4343 18.7013L24.4251 14.9968L25.166 10.7949L46.1752 14.4994Z\" fill=\"url(#paint0_linear_10848_100094)\"/>\n<path d=\"M26.5805 54.3692L28.8032 41.7637L32.1647 42.3564L29.942 54.9619L27.8908 56.7665L26.5805 54.3692Z\" fill=\"url(#paint1_linear_10848_100094)\"/>\n<path d=\"M43.3335 18.3314L40.3699 35.1388L43.8308 40.0816L43.0899 44.2834L17.8788 39.838L18.6197 35.6362L23.5625 32.1752L26.5261 15.3679L43.3335 18.3314Z\" fill=\"url(#paint2_linear_10848_100094)\"/>\n</g>\n</g>\n<defs>\n<filter id=\"filter0_dd_10848_100094\" x=\"-7.29043\" y=\"2.4\" width=\"78.513\" height=\"78.5125\" filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\n<feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\"/>\n<feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\" result=\"hardAlpha\"/>\n<feMorphology radius=\"1.6\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect1_dropShadow_10848_100094\"/>\n<feOffset dy=\"3.2\"/>\n<feGaussianBlur stdDeviation=\"2.4\"/>\n<feColorMatrix type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.05 0\"/>\n<feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_10848_100094\"/>\n<feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\" result=\"hardAlpha\"/>\n<feMorphology radius=\"2.4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect2_dropShadow_10848_100094\"/>\n<feOffset dy=\"8\"/>\n<feGaussianBlur stdDeviation=\"6\"/>\n<feColorMatrix type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0\"/>\n<feBlend mode=\"normal\" in2=\"effect1_dropShadow_10848_100094\" result=\"effect2_dropShadow_10848_100094\"/>\n<feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect2_dropShadow_10848_100094\" result=\"shape\"/>\n</filter>\n<linearGradient id=\"paint0_linear_10848_100094\" x1=\"43.5491\" y1=\"14.0364\" x2=\"41.3336\" y2=\"21.241\" gradientUnits=\"userSpaceOnUse\">\n<stop offset=\"0.0995246\" stop-color=\"#D92739\"/>\n<stop offset=\"0.778846\" stop-color=\"#730019\"/>\n</linearGradient>\n<linearGradient id=\"paint1_linear_10848_100094\" x1=\"37.8372\" y1=\"43.3566\" x2=\"26.1603\" y2=\"54.2951\" gradientUnits=\"userSpaceOnUse\">\n<stop stop-color=\"#DADADA\"/>\n<stop offset=\"1\" stop-color=\"#6F6F6F\"/>\n</linearGradient>\n<linearGradient id=\"paint2_linear_10848_100094\" x1=\"44.3839\" y1=\"18.5167\" x2=\"18.5473\" y2=\"47.324\" gradientUnits=\"userSpaceOnUse\">\n<stop offset=\"0.0995246\" stop-color=\"#D92739\"/>\n<stop offset=\"0.778846\" stop-color=\"#730019\"/>\n</linearGradient>\n<clipPath id=\"clip0_10848_100094\">\n<rect width=\"64\" height=\"64\" fill=\"white\"/>\n</clipPath>\n<clipPath id=\"clip1_10848_100094\">\n<rect width=\"51.2\" height=\"51.2\" fill=\"white\" transform=\"translate(11.2002 4) rotate(10)\"/>\n</clipPath>\n</defs>\n</svg>\n",
      "type": "registry:lib"
    }
  ],
  "type": "registry:block"
}