{"version":3,"file":"modal.mjs","names":[],"sources":["../../../../src/web-components/catalog/basic/modal.ts"],"sourcesContent":["import { html, nothing } from \"lit\";\nimport { styleMap } from \"lit/directives/style-map.js\";\nimport { ModalApi } from \"@a2ui/web_core/v0_9/basic_catalog\";\nimport { createLitComponent } from \"../../adapter\";\n\nexport const Modal = createLitComponent(\n  ModalApi,\n  ({ props, buildChild, state, requestUpdate }) => {\n    const local = state as { isOpen: boolean };\n    return html`\n      <div\n        @click=${() => {\n          local.isOpen = true;\n          requestUpdate();\n        }}\n        style=\"display: inline-block;\"\n      >\n        ${props.trigger ? buildChild(props.trigger) : nothing}\n      </div>\n      ${\n        local.isOpen\n          ? html`\n            <div\n              style=${styleMap({\n                position: \"fixed\",\n                top: \"0\",\n                left: \"0\",\n                right: \"0\",\n                bottom: \"0\",\n                backgroundColor: \"rgba(0,0,0,0.5)\",\n                display: \"flex\",\n                alignItems: \"center\",\n                justifyContent: \"center\",\n                zIndex: \"1000\",\n              })}\n              @click=${() => {\n                local.isOpen = false;\n                requestUpdate();\n              }}\n            >\n              <div\n                style=${styleMap({\n                  backgroundColor: \"#fff\",\n                  padding: \"24px\",\n                  borderRadius: \"8px\",\n                  maxWidth: \"90%\",\n                  maxHeight: \"90%\",\n                  overflow: \"auto\",\n                  display: \"flex\",\n                  flexDirection: \"column\",\n                })}\n                @click=${(e: Event) => e.stopPropagation()}\n              >\n                <div style=\"display: flex; justify-content: flex-end;\">\n                  <button\n                    type=\"button\"\n                    @click=${() => {\n                      local.isOpen = false;\n                      requestUpdate();\n                    }}\n                    style=${styleMap({\n                      border: \"none\",\n                      background: \"none\",\n                      fontSize: \"20px\",\n                      cursor: \"pointer\",\n                      padding: \"4px\",\n                    })}\n                  >\n                    &times;\n                  </button>\n                </div>\n                <div style=\"flex: 1;\">\n                  ${props.content ? buildChild(props.content) : nothing}\n                </div>\n              </div>\n            </div>\n          `\n          : nothing\n      }\n    `;\n  },\n  () => ({ isOpen: false }),\n);\n"],"mappings":";;;;;;AAKA,MAAa,QAAQ,mBACnB,WACC,EAAE,OAAO,YAAY,OAAO,oBAAoB;CAC/C,MAAM,QAAQ;AACd,QAAO,IAAI;;uBAEQ;AACb,QAAM,SAAS;AACf,iBAAe;GACf;;;UAGA,MAAM,UAAU,WAAW,MAAM,QAAQ,GAAG,QAAQ;;QAGtD,MAAM,SACF,IAAI;;sBAEM,SAAS;EACf,UAAU;EACV,KAAK;EACL,MAAM;EACN,OAAO;EACP,QAAQ;EACR,iBAAiB;EACjB,SAAS;EACT,YAAY;EACZ,gBAAgB;EAChB,QAAQ;EACT,CAAC,CAAC;6BACY;AACb,QAAM,SAAS;AACf,iBAAe;GACf;;;wBAGQ,SAAS;EACf,iBAAiB;EACjB,SAAS;EACT,cAAc;EACd,UAAU;EACV,WAAW;EACX,UAAU;EACV,SAAS;EACT,eAAe;EAChB,CAAC,CAAC;0BACO,MAAa,EAAE,iBAAiB,CAAC;;;;;mCAKxB;AACb,QAAM,SAAS;AACf,iBAAe;GACf;4BACM,SAAS;EACf,QAAQ;EACR,YAAY;EACZ,UAAU;EACV,QAAQ;EACR,SAAS;EACV,CAAC,CAAC;;;;;;oBAMH,MAAM,UAAU,WAAW,MAAM,QAAQ,GAAG,QAAQ;;;;cAK5D,QACL;;UAGE,EAAE,QAAQ,OAAO,EACzB"}