{"version":3,"file":"ColorCommunication.D0QB8eVi.mjs","names":["React.useState"],"sources":["https:/framerusercontent.com/modules/FChrx97mshorX9TO2b64/YaVRTjhniUkcg7MDznwI/ColorCommunication.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import*as React from\"react\";const signals=[{name:\"Red\",color:\"#D8483D\",message:\"Not safe to share right now.\"},{name:\"Orange\",color:\"#E47B3D\",message:\"I need company.\"},{name:\"Yellow\",color:\"#F4D34E\",message:\"I need help.\"},{name:\"Green\",color:\"#5EA870\",message:\"I’m good. Focused right now.\"},{name:\"Blue\",color:\"#4996D0\",message:\"I’m in a challenging mental state.\"},{name:\"Purple\",color:\"#9365B6\",message:\"I’m overwhelmed. Give me some time.\"},{name:\"Brown\",color:\"#7A513B\",message:\"I feel dismissed.\"},{name:\"Black\",color:\"#1B1B1B\",message:\"That hurt. I need time to process.\"},{name:\"White\",color:\"#F6F2E7\",message:\"I’m ready to talk.\"}];/**\n * @framerSupportedLayoutWidth any-prefer-fixed\n * @framerSupportedLayoutHeight any-prefer-fixed\n */export default function ColorCommunication(props){const[selectedIndex,setSelectedIndex]=React.useState(null);const selected=selectedIndex===null?null:signals[selectedIndex];return /*#__PURE__*/_jsxs(\"section\",{\"aria-label\":\"Color communication signals\",style:{...props.style,width:\"100%\",color:\"#E3F3FF\",fontFamily:\"Geist, Arial, sans-serif\"},children:[/*#__PURE__*/_jsx(\"style\",{children:`\n                .color-communication-grid {\n                    display: grid;\n                    grid-template-columns: repeat(3, minmax(0, 1fr));\n                    gap: clamp(12px, 2vw, 24px);\n                    max-width: 660px;\n                    margin: 0 auto;\n                }\n                .color-signal {\n                    appearance: none;\n                    width: 100%;\n                    aspect-ratio: 1;\n                    min-width: 56px;\n                    border-radius: 999px;\n                    border: 1px solid rgba(227, 243, 255, 0.28);\n                    cursor: pointer;\n                    transition: transform 180ms ease, outline-color 180ms ease, outline-offset 180ms ease;\n                }\n                .color-signal:hover { transform: scale(1.035); }\n                .color-signal:focus-visible {\n                    outline: 3px solid #E3F3FF;\n                    outline-offset: 5px;\n                }\n                .color-signal[data-selected=\"true\"] {\n                    outline: 2px solid #E3F3FF;\n                    outline-offset: 6px;\n                    transform: scale(1.04);\n                }\n                .color-signal:active { transform: scale(0.98); }\n                .color-communication-detail {\n                    min-height: 112px;\n                    margin: clamp(28px, 4vw, 48px) auto 0;\n                    max-width: 660px;\n                    border-top: 1px solid rgba(227, 243, 255, 0.28);\n                    padding-top: 18px;\n                }\n                .color-communication-kicker {\n                    margin: 0 0 10px;\n                    color: rgba(227, 243, 255, 0.72);\n                    font-family: \"Geist Mono\", monospace;\n                    font-size: 11px;\n                    font-weight: 600;\n                    letter-spacing: 0.11em;\n                    line-height: 1.45;\n                    text-transform: uppercase;\n                }\n                .color-communication-message {\n                    margin: 0;\n                    font-size: clamp(22px, 3vw, 34px);\n                    font-weight: 400;\n                    letter-spacing: -0.02em;\n                    line-height: 1.15;\n                }\n                @media (max-width: 809px) {\n                    .color-communication-grid { gap: 14px; }\n                    .color-communication-detail { min-height: 128px; }\n                }\n                @media (prefers-reduced-motion: reduce) {\n                    .color-signal { transition: none; }\n                }\n            `}),/*#__PURE__*/_jsx(\"div\",{className:\"color-communication-grid\",role:\"group\",\"aria-label\":\"Select a color signal\",children:signals.map((signal,index)=>{const isSelected=selectedIndex===index;return /*#__PURE__*/_jsx(\"button\",{type:\"button\",className:\"color-signal\",\"data-selected\":isSelected,\"aria-pressed\":isSelected,\"aria-label\":signal.name+\": \"+signal.message,title:signal.name+\": \"+signal.message,onClick:()=>setSelectedIndex(index),style:{background:signal.color}},signal.name);})}),/*#__PURE__*/_jsxs(\"div\",{className:\"color-communication-detail\",\"aria-live\":\"polite\",\"aria-atomic\":\"true\",children:[/*#__PURE__*/_jsx(\"p\",{className:\"color-communication-kicker\",children:selected?selected.name+\" signal\":\"Choose a signal\"}),/*#__PURE__*/_jsx(\"p\",{className:\"color-communication-message\",children:selected?selected.message:\"Select a color to reveal what it communicates.\"})]})]});}\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"ColorCommunication\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\",\"framerSupportedLayoutHeight\":\"any-prefer-fixed\",\"framerSupportedLayoutWidth\":\"any-prefer-fixed\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./ColorCommunication.map"],"mappings":"yHAGG,SAAwB,EAAmB,EAAM,CAAC,GAAK,CAAC,EAAc,GAAkBA,EAAe,IAAI,EAAQ,EAAS,IAAgB,KAAK,KAAK,EAAQ,GAAe,OAAoB,EAAM,UAAU,CAAC,aAAa,8BAA8B,MAAM,CAAC,GAAG,EAAM,MAAM,MAAM,OAAO,MAAM,UAAU,WAAW,0BAA0B,EAAE,SAAS,CAAc,EAAK,QAAQ,CAAC,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;aA4D3X,CAAC,EAAe,EAAK,MAAM,CAAC,UAAU,2BAA2B,KAAK,QAAQ,aAAa,wBAAwB,SAAS,EAAQ,KAAK,EAAO,IAAQ,CAAC,IAAM,EAAW,IAAgB,EAAM,OAAoB,EAAK,SAAS,CAAC,KAAK,SAAS,UAAU,eAAe,gBAAgB,EAAW,eAAe,EAAW,aAAa,EAAO,KAAK,KAAK,EAAO,QAAQ,MAAM,EAAO,KAAK,KAAK,EAAO,QAAQ,YAAY,EAAiB,CAAK,EAAE,MAAM,CAAC,WAAW,EAAO,KAAK,CAAC,EAAE,EAAO,IAAI,CAAE,CAAC,CAAC,CAAC,EAAe,EAAM,MAAM,CAAC,UAAU,6BAA6B,YAAY,SAAS,cAAc,OAAO,SAAS,CAAc,EAAK,IAAI,CAAC,UAAU,6BAA6B,SAAS,EAAS,EAAS,KAAK,UAAU,iBAAiB,CAAC,EAAe,EAAK,IAAI,CAAC,UAAU,8BAA8B,SAAS,EAAS,EAAS,QAAQ,gDAAgD,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAE,mBA/D10B,IAA4B,EAAO,EAAQ,CAAC,CAAC,KAAK,MAAM,MAAM,UAAU,QAAQ,8BAA8B,EAAE,CAAC,KAAK,SAAS,MAAM,UAAU,QAAQ,iBAAiB,EAAE,CAAC,KAAK,SAAS,MAAM,UAAU,QAAQ,cAAc,EAAE,CAAC,KAAK,QAAQ,MAAM,UAAU,QAAQ,8BAA8B,EAAE,CAAC,KAAK,OAAO,MAAM,UAAU,QAAQ,oCAAoC,EAAE,CAAC,KAAK,SAAS,MAAM,UAAU,QAAQ,qCAAqC,EAAE,CAAC,KAAK,QAAQ,MAAM,UAAU,QAAQ,mBAAmB,EAAE,CAAC,KAAK,QAAQ,MAAM,UAAU,QAAQ,oCAAoC,EAAE,CAAC,KAAK,QAAQ,MAAM,UAAU,QAAQ,oBAAoB,CAAC"}