[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"header-nav":3,"footer-description":155,"footer-primary":157,"footer-secondary":234,"header-nav-data":260,"github-stars":262,"8f849cd0-a47b-4e32-bb19-b478973c90f7":366,"74634853-196b-4ce3-b256-4534c054838f":372,"dfd79d2b-7af5-4cdb-aa94-3f73de97ebd8":401,"site-banner":408,"358b0659-1f05-4427-bd1c-4bc03a43c182":412,"@directus-labs/card-select-interfaces":419,"1b444c23-b593-4391-9410-4ca5d2c7a7cb":464,"9df3f40e-6272-4ec6-a0d7-cc29265e087c":468},{"items":4},[5,74,136,141,148],{"id":6,"title":7,"url":8,"callout":9,"callout_title":10,"children_title":11,"page":8,"children":12},"62c04c6c-5793-4702-8ed1-73dd563fd605","Product",null,"8f849cd0-a47b-4e32-bb19-b478973c90f7","Project Showcase","Use Cases and Features",[13,21,29,37,43,51,59,67],{"id":14,"title":15,"url":16,"description":17,"image":8,"icon":18,"page":19},"e7d7d5ed-89b1-4455-8b4a-8ae92c70e3a0","Headless CMS","/solutions/headless-cms/","Manage and deliver content with ease","code_blocks",{"permalink":20},"/solutions/headless-cms",{"id":22,"title":23,"url":24,"description":25,"image":8,"icon":26,"page":27},"60bdefd9-95e6-45a3-9f81-4748d07c59d3","Backend-as-a-Service","/solutions/backend-as-a-service/","Build and ship applications faster","speed",{"permalink":28},"/solutions/backend-as-a-service",{"id":30,"title":31,"url":32,"description":33,"image":8,"icon":34,"page":35},"5f9aebeb-4f89-445e-9850-5b1261a2743c","Headless Commerce","/solutions/product-information-management/","A single source of truth for products","shopping_cart_checkout",{"permalink":36},"/solutions/product-information-management",{"id":38,"title":39,"url":40,"description":41,"image":8,"icon":42,"page":8},"49e46134-80be-470e-8c73-afb1417fa9b6","100+ More Use Cases","https://directus.io/blog/100-tools-apps-and-platforms-you-can-build-with-directus","Build anything (or everything)","lightbulb",{"id":44,"title":45,"url":46,"description":47,"image":8,"icon":48,"page":49},"a589ac77-a5ce-45c5-a054-e43111e19158","Instant APIs","/products/connect/","Connect a database, get REST + GraphQL APIs","api",{"permalink":50},"/toolkit/connect",{"id":52,"title":53,"url":54,"description":55,"image":8,"icon":56,"page":57},"4a0f129a-c546-4493-b0a9-306e51692e90","Granular Policy-Based Auth","/products/auth/","Provide secure, autonomous data access","lock_person",{"permalink":58},"/toolkit/auth",{"id":60,"title":61,"url":62,"description":63,"image":8,"icon":64,"page":65},"f9250f2c-93a4-4108-80db-011bbe391ecf","Visual Automation Builder","/products/automate/","Automate content and data workflows with ease","build",{"permalink":66},"/toolkit/automate",{"id":68,"title":69,"url":8,"description":70,"image":8,"icon":71,"page":72},"f1ae4e40-5b05-42a4-9cd3-33dda35cc939","50+ More Features","Get everything you need out-of-the-box","auto_fix",{"permalink":73},"/features",{"id":75,"title":76,"url":8,"callout":77,"callout_title":78,"children_title":79,"page":8,"children":80},"2f6ad0d1-6dd3-4f17-b5c8-9f2abf71409a","Resources","dfd79d2b-7af5-4cdb-aa94-3f73de97ebd8","Watch Directus TV","Learn More",[81,88,96,102,109,116,122,129],{"id":82,"title":83,"url":84,"description":85,"image":8,"icon":86,"page":87},"0a3bf9f5-1ef2-43f4-bc09-7ff7488241c5","Blog","/blog","Read our latest articles and guides","library_books",{"permalink":84},{"id":89,"title":90,"url":91,"description":92,"image":8,"icon":93,"page":94},"165e3dc2-e51b-4456-8382-99c5775b0412","Case Studies","#","Case studies and success stories","magic_button",{"permalink":95},"/case-studies",{"id":97,"title":98,"url":99,"description":100,"image":8,"icon":101,"page":8},"5ae324b6-bf44-4c21-95ad-e6dc0c1c1f40","Community Forum","https://community.directus.io/","Questions and conversations","comment",{"id":103,"title":104,"url":91,"description":105,"image":8,"icon":106,"page":107},"b1db03f0-e537-490e-8c0f-c61c401d1024","Agency Directory","Browse our list of agency partners ","handshake",{"permalink":108},"/agency-directory",{"id":110,"title":111,"url":112,"description":113,"image":8,"icon":114,"page":115},"991731c8-eb40-4eec-85a5-6e977bcd7ec9","About Us","/about","Learn more about Directus and the team","supervised_user_circle",{"permalink":112},{"id":117,"title":118,"url":119,"description":120,"image":8,"icon":121,"page":8},"52aebf38-b3ad-4a27-807d-ce52398cd509","Wall of Love","https://testimonial.to/directus/all","See what others are saying about us","heart_plus",{"id":123,"title":124,"url":91,"description":125,"image":8,"icon":126,"page":127},"a86eca65-d5ae-4263-b7d9-4f1a1c50a0b1","Contact","Have a general inquiry or question for us?","mark_email_unread",{"permalink":128},"/contact",{"id":130,"title":131,"url":8,"description":132,"image":8,"icon":133,"page":134},"28225825-8d41-4809-9032-192fbf5c6e5d","Support","Reach out to Directus support","support",{"permalink":135},"/support",{"id":137,"title":138,"url":139,"callout":8,"callout_title":8,"children_title":8,"page":8,"children":140},"a3f1275d-b088-4b11-99bf-143fcbf39104","Developers","/docs",[],{"id":142,"title":143,"url":144,"callout":8,"callout_title":8,"children_title":8,"page":145,"children":147},"fae8fded-d2e2-468e-a68b-82abec7a7225","Enterprise","/solutions/enterprise/",{"permalink":146},"/solutions/enterprise",[],{"id":149,"title":150,"url":151,"callout":8,"callout_title":8,"children_title":8,"page":152,"children":154},"5c5e2fbc-49fd-4e41-a71e-e4f8db2b00cf","Pricing","/pricing/",{"permalink":153},"/pricing/self-hosted",[],{"description":156},"\u003Cp>A composable backend to build your Headless CMS, BaaS, and more. \u003C/p>",{"items":158},[159,176,195,214],{"id":160,"title":161,"url":8,"page":8,"children":162},"522e608a-77b0-4333-820d-d4f44be2ade1","Solutions",[163,166,169,173],{"id":164,"title":15,"url":8,"page":165},"fcafe85a-a798-4710-9e7a-776fe413aae5",{"permalink":20},{"id":167,"title":23,"url":8,"page":168},"79972923-93cf-4777-9e32-5c9b0315fc10",{"permalink":28},{"id":170,"title":171,"url":8,"page":172},"0fa8d0c1-7b64-4f6f-939d-d7fdb99fc407","Product Information",{"permalink":36},{"id":174,"title":175,"url":40,"page":8},"63946d54-6052-4780-8ff4-91f5a9931dcc","100+ Things to Build",{"id":177,"title":76,"url":8,"page":8,"children":178},"8ab4f9b1-f3e2-44d6-919b-011d91fe072f",[179,183,187,191],{"id":180,"title":181,"url":182,"page":8},"f951fb84-8777-4b84-9e91-996fe9d25483","Documentation","https://docs.directus.io",{"id":184,"title":185,"url":186,"page":8},"366febc7-a538-4c08-a326-e6204957f1e3","Guides","https://docs.directus.io/guides/",{"id":188,"title":189,"url":190,"page":8},"aeb9128e-1c5f-417f-863c-2449416433cd","Community","https://directus.chat",{"id":192,"title":193,"url":194,"page":8},"da1c2ed8-0a77-49b0-a903-49c56cb07de5","Release Notes","https://github.com/directus/directus/releases",{"id":196,"title":131,"url":8,"page":8,"children":197},"d61fae8c-7502-494a-822f-19ecff3d0256",[198,202,206,210],{"id":199,"title":200,"url":201,"page":8},"8c43c781-7ebd-475f-a931-747e293c0a88","Issue Tracker","https://github.com/directus/directus/issues",{"id":203,"title":204,"url":205,"page":8},"d77bb78e-cf7b-4e01-932a-514414ba49d3","Feature Requests","https://github.com/directus/directus/discussions?discussions_q=is:open+sort:top",{"id":207,"title":208,"url":209,"page":8},"4346be2b-2c53-476e-b53b-becacec626a6","Community Chat","https://discord.com/channels/725371605378924594/741317677397704757",{"id":211,"title":212,"url":213,"page":8},"26c115d2-49f7-4edc-935e-d37d427fb89d","Cloud Dashboard","https://directus.cloud",{"id":215,"title":216,"url":8,"page":8,"children":217},"49141403-4f20-44ac-8453-25ace1265812","Organization",[218,222,227,231],{"id":219,"title":220,"url":112,"page":221},"1f36ea92-8a5e-47c8-914c-9822a8b9538a","About",{"permalink":112},{"id":223,"title":224,"url":91,"page":225},"b84bf525-5471-4b14-a93c-225f6c386005","Careers",{"permalink":226},"/careers",{"id":228,"title":229,"url":230,"page":8},"86aabc3a-433d-434b-9efa-ad1d34be0a34","Brand Assets","https://drive.google.com/drive/folders/1lBOTba4RaA5ikqOn8Ewo4RYzD0XcymG9?usp=sharing",{"id":232,"title":124,"url":8,"page":233},"8d2fa1e3-198e-4405-81e1-2ceb858bc237",{"permalink":128},{"items":235},[236,242,248,254],{"id":237,"title":238,"url":8,"page":239,"children":241},"8a1b7bfa-429d-4ffc-a650-2a5fdcf356da","Cloud Policies",{"permalink":240},"/cloud-policies",[],{"id":243,"title":244,"url":91,"page":245,"children":247},"bea848ef-828f-4306-8017-6b00ec5d4a0c","License",{"permalink":246},"/bsl",[],{"id":249,"title":250,"url":91,"page":251,"children":253},"4e914f47-4bee-42b7-b445-3119ee4196ef","Terms",{"permalink":252},"/terms",[],{"id":255,"title":256,"url":91,"page":257,"children":259},"ea69eda6-d317-4981-8421-fcabb1826bfd","Privacy",{"permalink":258},"/privacy",[],{"header_cta_buttons":261},"74634853-196b-4ce3-b256-4534c054838f",{"id":263,"node_id":264,"name":265,"full_name":266,"private":267,"owner":268,"html_url":285,"description":286,"fork":267,"url":287,"forks_url":288,"keys_url":289,"collaborators_url":290,"teams_url":291,"hooks_url":292,"issue_events_url":293,"events_url":294,"assignees_url":295,"branches_url":296,"tags_url":297,"blobs_url":298,"git_tags_url":299,"git_refs_url":300,"trees_url":301,"statuses_url":302,"languages_url":303,"stargazers_url":304,"contributors_url":305,"subscribers_url":306,"subscription_url":307,"commits_url":308,"git_commits_url":309,"comments_url":310,"issue_comment_url":311,"contents_url":312,"compare_url":313,"merges_url":314,"archive_url":315,"downloads_url":316,"issues_url":317,"pulls_url":318,"milestones_url":319,"notifications_url":320,"labels_url":321,"releases_url":322,"deployments_url":323,"created_at":324,"updated_at":325,"pushed_at":326,"git_url":327,"ssh_url":328,"clone_url":329,"svn_url":285,"homepage":330,"size":331,"stargazers_count":332,"watchers_count":332,"language":333,"has_issues":334,"has_projects":334,"has_downloads":334,"has_wiki":267,"has_pages":267,"has_discussions":334,"forks_count":335,"mirror_url":8,"archived":267,"disabled":267,"open_issues_count":336,"license":337,"allow_forking":334,"is_template":267,"web_commit_signoff_required":267,"has_pull_requests":334,"pull_request_creation_policy":342,"topics":343,"visibility":284,"forks":335,"open_issues":336,"watchers":332,"default_branch":362,"temp_clone_token":8,"custom_properties":363,"organization":364,"network_count":335,"subscribers_count":365},7122594,"MDEwOlJlcG9zaXRvcnk3MTIyNTk0","directus","directus/directus",false,{"login":265,"id":269,"node_id":270,"avatar_url":271,"gravatar_id":272,"url":273,"html_url":274,"followers_url":275,"following_url":276,"gists_url":277,"starred_url":278,"subscriptions_url":279,"organizations_url":280,"repos_url":281,"events_url":282,"received_events_url":283,"type":216,"user_view_type":284,"site_admin":267},15967950,"MDEyOk9yZ2FuaXphdGlvbjE1OTY3OTUw","https://avatars.githubusercontent.com/u/15967950?v=4","","https://api.github.com/users/directus","https://github.com/directus","https://api.github.com/users/directus/followers","https://api.github.com/users/directus/following{/other_user}","https://api.github.com/users/directus/gists{/gist_id}","https://api.github.com/users/directus/starred{/owner}{/repo}","https://api.github.com/users/directus/subscriptions","https://api.github.com/users/directus/orgs","https://api.github.com/users/directus/repos","https://api.github.com/users/directus/events{/privacy}","https://api.github.com/users/directus/received_events","public","https://github.com/directus/directus","The flexible backend for all your projects 🐰 Turn your DB into a headless CMS, admin panels, or apps with a custom UI, instant APIs, auth & more.","https://api.github.com/repos/directus/directus","https://api.github.com/repos/directus/directus/forks","https://api.github.com/repos/directus/directus/keys{/key_id}","https://api.github.com/repos/directus/directus/collaborators{/collaborator}","https://api.github.com/repos/directus/directus/teams","https://api.github.com/repos/directus/directus/hooks","https://api.github.com/repos/directus/directus/issues/events{/number}","https://api.github.com/repos/directus/directus/events","https://api.github.com/repos/directus/directus/assignees{/user}","https://api.github.com/repos/directus/directus/branches{/branch}","https://api.github.com/repos/directus/directus/tags","https://api.github.com/repos/directus/directus/git/blobs{/sha}","https://api.github.com/repos/directus/directus/git/tags{/sha}","https://api.github.com/repos/directus/directus/git/refs{/sha}","https://api.github.com/repos/directus/directus/git/trees{/sha}","https://api.github.com/repos/directus/directus/statuses/{sha}","https://api.github.com/repos/directus/directus/languages","https://api.github.com/repos/directus/directus/stargazers","https://api.github.com/repos/directus/directus/contributors","https://api.github.com/repos/directus/directus/subscribers","https://api.github.com/repos/directus/directus/subscription","https://api.github.com/repos/directus/directus/commits{/sha}","https://api.github.com/repos/directus/directus/git/commits{/sha}","https://api.github.com/repos/directus/directus/comments{/number}","https://api.github.com/repos/directus/directus/issues/comments{/number}","https://api.github.com/repos/directus/directus/contents/{+path}","https://api.github.com/repos/directus/directus/compare/{base}...{head}","https://api.github.com/repos/directus/directus/merges","https://api.github.com/repos/directus/directus/{archive_format}{/ref}","https://api.github.com/repos/directus/directus/downloads","https://api.github.com/repos/directus/directus/issues{/number}","https://api.github.com/repos/directus/directus/pulls{/number}","https://api.github.com/repos/directus/directus/milestones{/number}","https://api.github.com/repos/directus/directus/notifications{?since,all,participating}","https://api.github.com/repos/directus/directus/labels{/name}","https://api.github.com/repos/directus/directus/releases{/id}","https://api.github.com/repos/directus/directus/deployments","2012-12-12T01:35:36Z","2026-04-15T04:20:19Z","2026-04-14T21:58:02Z","git://github.com/directus/directus.git","git@github.com:directus/directus.git","https://github.com/directus/directus.git","https://directus.io",439603,34792,"TypeScript",true,4701,387,{"key":338,"name":339,"spdx_id":340,"url":8,"node_id":341},"other","Other","NOASSERTION","MDc6TGljZW5zZTA=","all",[48,344,345,346,347,348,265,349,350,351,352,353,354,355,356,357,358,359,360,361],"app","cms","composable","data-visualization","database","graphql","headless-cms","javascript","mariadb","mssql","mysql","no-code","node","postgresql","sql","sqlite","typescript","vue","main",{},{"login":265,"id":269,"node_id":270,"avatar_url":271,"gravatar_id":272,"url":273,"html_url":274,"followers_url":275,"following_url":276,"gists_url":277,"starred_url":278,"subscriptions_url":279,"organizations_url":280,"repos_url":281,"events_url":282,"received_events_url":283,"type":216,"user_view_type":284,"site_admin":267},327,{"id":9,"title":367,"description":368,"image":369,"external_url":8,"icon":8,"badge":8,"page":370,"resource":8},"Built With Directus","See what everyone's been building with Directus","e658de72-fb08-4ed2-8029-215c712c789e",{"permalink":371},"/built-with-directus",{"alignment":373,"style":374,"experiment_enabled":267,"experiment":8,"experiment_variant":375,"buttons":378,"variants":388},"center","default",{"id":376,"key":377,"experiment":8},"8c4951b4-a6f9-4c06-9f71-fd39a3bdad1e","control",[379,382,385],{"id":380,"block_button_id":381},15,"358b0659-1f05-4427-bd1c-4bc03a43c182",{"id":383,"block_button_id":384},16,"9df3f40e-6272-4ec6-a0d7-cc29265e087c",{"id":386,"block_button_id":387},232,"1b444c23-b593-4391-9410-4ca5d2c7a7cb",[389],{"id":390,"alignment":373,"style":374,"buttons":391,"experiment_variant":398},"e1885d45-3119-41a3-8294-3cd796ea6f02",[392,395],{"id":393,"block_button_id":394},203,"ade37731-147d-48c4-864a-cec007576362",{"id":396,"block_button_id":397},202,"1cb4e89f-f7de-4b46-bbb8-080191517a72",{"id":399,"key":400},"66d2be4f-2492-4944-8060-039c15515918","variant",{"id":77,"title":402,"description":403,"image":404,"external_url":405,"icon":406,"badge":407,"page":8,"resource":8},"Directus TV","Go down the rabbit hole with hours of original video content from our team. ","ab70faf5-fc28-4608-a7e7-74fd4f020a9d","/tv","connected_tv","Video",{"id":409,"icon":406,"content":410,"link":411},"812bf73d-ebfb-4246-9538-937a09a0c795","Learn more about our native MCP","https://directus.io/mcp",{"id":381,"external_url":8,"label":413,"color":414,"outline":267,"icon":8,"size":415,"target":416,"ph_event":8,"page":417,"resource":8},"Book a Demo","primary","medium","_self",{"permalink":418},"/demo",{"name":420,"description":421,"verified":267,"id":422,"readme":423,"type":424,"last_updated":425,"host_version":426,"downloads":427,"total_downloads":428,"sandbox":334,"license":429,"publisher":430,"versions":439,"formatted_name":457,"formatted_readme":458,"formatted_description":421,"featured_image":459,"images":460,"repository_url":443,"recent_downloads_7_days":463,"recent_downloads_30_days":463},"@directus-labs/card-select-interfaces","A bundle of card-based selection interfaces for Directus","af053cdb-242e-4142-a053-e3e23d7658e5","# Card Select Interfaces\n\n![Screenshot of the Card Select interfaces in a form](https://raw.githubusercontent.com/directus-labs/extensions/main/packages/card-select-interfaces/docs/card-select-interfaces.png)\n\nA bundle of card-based interfaces for Directus that provides selection options for both radio (single select) and checkbox (multiple select) inputs.\n\nThis bundle includes:\n- Radio Cards Interface\n- Checkbox Cards Interface\n\n## Installation\n\nTo install the extension, follow the [Official Guide](https://docs.directus.io/extensions/installing-extensions.html) for installing extensions from the Marketplace or manually.\n\n## Interfaces\n\n### Radio Cards Interface\n\nA card-based single selection interface that replaces the standard radio button input with visually appealing cards. Perfect for when you want to provide users with rich visual choices. Supports single selection.\n\nField Types: String, Integer, Float, Decimal, Big Integer\n\n![Radio Cards Interface Example](https://raw.githubusercontent.com/directus-labs/extensions/main/packages/card-select-interfaces/docs/radio-cards-interface.png)\n\n![Radio Cards Interface Config](https://raw.githubusercontent.com/directus-labs/extensions/main/packages/card-select-interfaces/docs/radio-cards-config.png)\n\n### Checkbox Cards Interface\n\nA card-based multiple selection interface that replaces standard checkboxes with interactive cards. Ideal for allowing users to select multiple options in a more engaging way. Supports multiple selections.\n\nField Types: JSON, CSV\n\n![Checkbox Cards Interface Example](https://raw.githubusercontent.com/directus-labs/extensions/main/packages/card-select-interfaces/docs/checkbox-cards-interface.png)\n\n![Checkbox Cards Interface Config](https://raw.githubusercontent.com/directus-labs/extensions/main/packages/card-select-interfaces/docs/checkbox-cards-config.png)\n\n## Configuration Options\n\n- **Choices** - A list of card options with the following properties for each:\n  - Text - Label to show in the studio interface\n  - Value - Value to be stored in the database\n  - Description - Optional description to display below the text label\n  - Icon Type - Choose between:\n    - Icon - Use a Directus system icon\n    - SVG - Use custom SVG markup\n    - Image - Use an uploaded image\n  - Icon/SVG/Image - The actual icon content based on selected type\n- **Grid Size** - Number of columns in the grid layout (2-6 columns)\n- **Enable Search** - Toggle search functionality to filter cards by text\n","bundle","2025-01-10T16:13:06.572Z","^10.0.0 || ^11.0.0",[],38001,"MIT",{"username":431,"verified":334,"id":432,"github_username":431,"github_name":433,"github_blog":434,"github_bio":435,"github_location":436,"github_company":437,"github_avatar_url":438},"ukmadlz","74ce2e77-733a-4e9a-b96d-93bf6264f622","Mike Elsmore","http://elsmore.me","(╯°□°）╯︵ TABLEFLIP","UK","@DigitalSpeed","https://avatars.githubusercontent.com/u/804683?v=4",[440],{"version":441,"package":422,"publisher":432,"type":424,"host_version":426,"publish_date":425,"verified":267,"id":442,"url_repository":443,"url_homepage":444,"url_bugs":445,"file_count":446,"unpacked_size":447,"sandbox":334,"sandbox_requested_scopes":8,"license":429,"bundled":448,"maintainers":452},"1.0.0","3f627cf9-4079-4880-b32a-3848829c93dc","https://github.com/directus-labs/extensions.git","https://github.com/directus-labs/extensions#readme","https://github.com/directus-labs/extensions/issues",4,55043,[449,450,451],"0f02abc9-d8a4-478a-8bc4-1e2d546bcd3b","af2c72c0-f042-4a68-8ee2-f4501ca2a83d","e6c52c80-901c-4550-8f98-3f912fbff52e",[453,454,455,456],11807,11808,11809,11810,"Card Select Interfaces","\u003Ch1>Card Select Interfaces\u003C/h1>\n\u003Cp>\u003Cimg src=\"https://raw.githubusercontent.com/directus-labs/extensions/main/packages/card-select-interfaces/docs/card-select-interfaces.png\" alt=\"Screenshot of the Card Select interfaces in a form\">\u003C/p>\n\u003Cp>A bundle of card-based interfaces for Directus that provides selection options for both radio (single select) and checkbox (multiple select) inputs.\u003C/p>\n\u003Cp>This bundle includes:\u003C/p>\n\u003Cul>\n\u003Cli>Radio Cards Interface\u003C/li>\n\u003Cli>Checkbox Cards Interface\u003C/li>\n\u003C/ul>\n\u003Ch2>Installation\u003C/h2>\n\u003Cp>To install the extension, follow the \u003Ca href=\"https://docs.directus.io/extensions/installing-extensions.html\">Official Guide\u003C/a> for installing extensions from the Marketplace or manually.\u003C/p>\n\u003Ch2>Interfaces\u003C/h2>\n\u003Ch3>Radio Cards Interface\u003C/h3>\n\u003Cp>A card-based single selection interface that replaces the standard radio button input with visually appealing cards. Perfect for when you want to provide users with rich visual choices. Supports single selection.\u003C/p>\n\u003Cp>Field Types: String, Integer, Float, Decimal, Big Integer\u003C/p>\n\u003Cp>\u003Cimg src=\"https://raw.githubusercontent.com/directus-labs/extensions/main/packages/card-select-interfaces/docs/radio-cards-interface.png\" alt=\"Radio Cards Interface Example\">\u003C/p>\n\u003Cp>\u003Cimg src=\"https://raw.githubusercontent.com/directus-labs/extensions/main/packages/card-select-interfaces/docs/radio-cards-config.png\" alt=\"Radio Cards Interface Config\">\u003C/p>\n\u003Ch3>Checkbox Cards Interface\u003C/h3>\n\u003Cp>A card-based multiple selection interface that replaces standard checkboxes with interactive cards. Ideal for allowing users to select multiple options in a more engaging way. Supports multiple selections.\u003C/p>\n\u003Cp>Field Types: JSON, CSV\u003C/p>\n\u003Cp>\u003Cimg src=\"https://raw.githubusercontent.com/directus-labs/extensions/main/packages/card-select-interfaces/docs/checkbox-cards-interface.png\" alt=\"Checkbox Cards Interface Example\">\u003C/p>\n\u003Cp>\u003Cimg src=\"https://raw.githubusercontent.com/directus-labs/extensions/main/packages/card-select-interfaces/docs/checkbox-cards-config.png\" alt=\"Checkbox Cards Interface Config\">\u003C/p>\n\u003Ch2>Configuration Options\u003C/h2>\n\u003Cul>\n\u003Cli>\u003Cstrong>Choices\u003C/strong> - A list of card options with the following properties for each:\n\u003Cul>\n\u003Cli>Text - Label to show in the studio interface\u003C/li>\n\u003Cli>Value - Value to be stored in the database\u003C/li>\n\u003Cli>Description - Optional description to display below the text label\u003C/li>\n\u003Cli>Icon Type - Choose between:\n\u003Cul>\n\u003Cli>Icon - Use a Directus system icon\u003C/li>\n\u003Cli>SVG - Use custom SVG markup\u003C/li>\n\u003Cli>Image - Use an uploaded image\u003C/li>\n\u003C/ul>\n\u003C/li>\n\u003Cli>Icon/SVG/Image - The actual icon content based on selected type\u003C/li>\n\u003C/ul>\n\u003C/li>\n\u003Cli>\u003Cstrong>Grid Size\u003C/strong> - Number of columns in the grid layout (2-6 columns)\u003C/li>\n\u003Cli>\u003Cstrong>Enable Search\u003C/strong> - Toggle search functionality to filter cards by text\u003C/li>\n\u003C/ul>\n","https://raw.githubusercontent.com/directus-labs/extensions/main/packages/card-select-interfaces/docs/card-select-interfaces.png",[459,461,462],"https://raw.githubusercontent.com/directus-labs/extensions/main/packages/card-select-interfaces/docs/radio-cards-config.png","https://raw.githubusercontent.com/directus-labs/extensions/main/packages/card-select-interfaces/docs/checkbox-cards-config.png",0,{"id":387,"external_url":213,"label":465,"color":466,"outline":334,"icon":467,"size":415,"target":416,"ph_event":8,"page":8,"resource":8},"Log In","secondary","arrow_forward",{"id":384,"external_url":469,"label":470,"color":466,"outline":267,"icon":8,"size":415,"target":416,"ph_event":8,"page":8,"resource":8},"https://directus.cloud/account/register","Get Started"]