@lobehub/ui/es/base-ui/Accordion/style.mjs.map

Lobe UI is an open-source UI component library for building AIGC web apps

{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Accordion/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  action: css`\n    display: flex;\n    flex-shrink: 0;\n    gap: 4px;\n    align-items: center;\n\n    opacity: 0;\n\n    transition: opacity 150ms ${cssVar.motionEaseOut};\n  `,\n  actionAlwaysVisible: css`\n    opacity: 1;\n  `,\n  actionBorderless: css`\n    padding-inline-end: var(--accordion-hover-inset, 8px);\n  `,\n  actionOutlined: css`\n    padding-inline-end: 16px;\n  `,\n  content: css`\n    font-size: 14px;\n    line-height: 1.6;\n  `,\n  contentBorderless: css`\n    padding-block: 0 12px;\n  `,\n  contentIndent: css`\n    padding-inline-start: 24px;\n  `,\n  contentIndentOutlined: css`\n    padding-inline-start: 40px;\n  `,\n  contentOutlined: css`\n    padding-block: 0 14px;\n    padding-inline: 16px;\n  `,\n  header: css`\n    position: relative;\n\n    display: flex;\n    align-items: center;\n\n    margin: 0;\n\n    font-size: inherit;\n    font-weight: inherit;\n\n    transition: background 150ms ${cssVar.motionEaseOut};\n\n    &:hover:not(:has([data-disabled])) {\n      background: ${cssVar.colorFillTertiary};\n    }\n\n    &:hover .accordion-action,\n    &:focus-within .accordion-action {\n      opacity: 1;\n    }\n  `,\n  headerBorderless: css`\n    margin-inline: calc(var(--accordion-hover-inset, 8px) * -1);\n    border-radius: ${cssVar.borderRadius};\n  `,\n  indicator: css`\n    display: flex;\n    flex-shrink: 0;\n    align-items: center;\n\n    color: ${cssVar.colorTextDescription};\n\n    transition: transform 200ms ${cssVar.motionEaseOut};\n\n    @media (prefers-reduced-motion: reduce) {\n      transition-duration: 0s;\n    }\n  `,\n  indicatorEnd: css`\n    margin-inline-start: auto;\n\n    [data-panel-open] & {\n      transform: rotate(180deg);\n    }\n  `,\n  indicatorStart: css`\n    [data-panel-open] & {\n      transform: rotate(90deg);\n    }\n  `,\n  item: css`\n    display: flex;\n    flex-direction: column;\n  `,\n  itemOutlined: css`\n    & + & {\n      border-block-start: 1px solid ${cssVar.colorBorderSecondary};\n    }\n  `,\n  panel: css`\n    overflow: hidden;\n    height: var(--accordion-panel-height);\n    transition: height 200ms ${cssVar.motionEaseOut};\n\n    &[data-starting-style],\n    &[data-ending-style] {\n      height: 0;\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      transition-duration: 0s;\n    }\n  `,\n  root: css`\n    display: flex;\n    flex-direction: column;\n    width: 100%;\n  `,\n  rootOutlined: css`\n    overflow: hidden;\n    border: 1px solid ${cssVar.colorBorderSecondary};\n    border-radius: ${cssVar.borderRadiusLG};\n  `,\n  trigger: css`\n    cursor: pointer;\n    user-select: none;\n\n    display: flex;\n    flex: 1;\n    gap: 8px;\n    align-items: center;\n\n    min-width: 0;\n    border: 0;\n    border-radius: inherit;\n\n    font: inherit;\n    font-size: 14px;\n    font-weight: 500;\n    color: ${cssVar.colorText};\n    text-align: start;\n\n    background: none;\n    outline: none;\n\n    &:focus-visible {\n      outline: 2px solid ${cssVar.colorPrimaryBorder};\n      outline-offset: -2px;\n    }\n\n    &[data-disabled] {\n      cursor: not-allowed;\n      color: ${cssVar.colorTextDisabled};\n    }\n  `,\n  triggerBorderless: css`\n    padding-block: 8px;\n    padding-inline: var(--accordion-hover-inset, 8px);\n  `,\n  triggerOutlined: css`\n    padding-block: 12px;\n    padding-inline: 16px;\n  `,\n}));\n\nexport const rootVariants = cva(styles.root, {\n  defaultVariants: { variant: 'borderless' },\n  variants: {\n    variant: {\n      borderless: null,\n      outlined: styles.rootOutlined,\n    },\n  },\n});\n\nexport const itemVariants = cva(styles.item, {\n  defaultVariants: { variant: 'borderless' },\n  variants: {\n    variant: {\n      borderless: null,\n      outlined: styles.itemOutlined,\n    },\n  },\n});\n\nexport const headerVariants = cva(styles.header, {\n  defaultVariants: { variant: 'borderless' },\n  variants: {\n    variant: {\n      borderless: styles.headerBorderless,\n      outlined: null,\n    },\n  },\n});\n\nexport const triggerVariants = cva(styles.trigger, {\n  defaultVariants: { variant: 'borderless' },\n  variants: {\n    variant: {\n      borderless: styles.triggerBorderless,\n      outlined: styles.triggerOutlined,\n    },\n  },\n});\n\nexport const indicatorVariants = cva(styles.indicator, {\n  defaultVariants: { placement: 'start' },\n  variants: {\n    placement: {\n      end: styles.indicatorEnd,\n      start: styles.indicatorStart,\n    },\n  },\n});\n\nexport const contentVariants = cva(styles.content, {\n  compoundVariants: [\n    {\n      class: styles.contentIndent,\n      indent: true,\n      variant: 'borderless',\n    },\n    {\n      class: styles.contentIndentOutlined,\n      indent: true,\n      variant: 'outlined',\n    },\n  ],\n  defaultVariants: { indent: true, variant: 'borderless' },\n  variants: {\n    indent: {\n      false: null,\n      true: null,\n    },\n    variant: {\n      borderless: styles.contentBorderless,\n      outlined: styles.contentOutlined,\n    },\n  },\n});\n\nexport const actionVariants = cva(styles.action, {\n  defaultVariants: { alwaysVisible: false, variant: 'borderless' },\n  variants: {\n    alwaysVisible: {\n      false: null,\n      true: styles.actionAlwaysVisible,\n    },\n    variant: {\n      borderless: styles.actionBorderless,\n      outlined: styles.actionOutlined,\n    },\n  },\n});\n"],"mappings":";;;AAGA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,QAAQ,GAAG;;;;;;;;gCAQmB,OAAO,cAAc;;CAEnD,qBAAqB,GAAG;;;CAGxB,kBAAkB,GAAG;;;CAGrB,gBAAgB,GAAG;;;CAGnB,SAAS,GAAG;;;;CAIZ,mBAAmB,GAAG;;;CAGtB,eAAe,GAAG;;;CAGlB,uBAAuB,GAAG;;;CAG1B,iBAAiB,GAAG;;;;CAIpB,QAAQ,GAAG;;;;;;;;;;;mCAWsB,OAAO,cAAc;;;oBAGpC,OAAO,kBAAkB;;;;;;;;CAQ3C,kBAAkB,GAAG;;qBAEF,OAAO,aAAa;;CAEvC,WAAW,GAAG;;;;;aAKH,OAAO,qBAAqB;;kCAEP,OAAO,cAAc;;;;;;CAMrD,cAAc,GAAG;;;;;;;CAOjB,gBAAgB,GAAG;;;;;CAKnB,MAAM,GAAG;;;;CAIT,cAAc,GAAG;;sCAEmB,OAAO,qBAAqB;;;CAGhE,OAAO,GAAG;;;+BAGmB,OAAO,cAAc;;;;;;;;;;;CAWlD,MAAM,GAAG;;;;;CAKT,cAAc,GAAG;;wBAEK,OAAO,qBAAqB;qBAC/B,OAAO,eAAe;;CAEzC,SAAS,GAAG;;;;;;;;;;;;;;;;aAgBD,OAAO,UAAU;;;;;;;2BAOH,OAAO,mBAAmB;;;;;;eAMtC,OAAO,kBAAkB;;;CAGtC,mBAAmB,GAAG;;;;CAItB,iBAAiB,GAAG;;;;AAItB,EAAE;AAEF,MAAa,eAAe,IAAI,OAAO,MAAM;CAC3C,iBAAiB,EAAE,SAAS,aAAa;CACzC,UAAU,EACR,SAAS;EACP,YAAY;EACZ,UAAU,OAAO;CACnB,EACF;AACF,CAAC;AAED,MAAa,eAAe,IAAI,OAAO,MAAM;CAC3C,iBAAiB,EAAE,SAAS,aAAa;CACzC,UAAU,EACR,SAAS;EACP,YAAY;EACZ,UAAU,OAAO;CACnB,EACF;AACF,CAAC;AAED,MAAa,iBAAiB,IAAI,OAAO,QAAQ;CAC/C,iBAAiB,EAAE,SAAS,aAAa;CACzC,UAAU,EACR,SAAS;EACP,YAAY,OAAO;EACnB,UAAU;CACZ,EACF;AACF,CAAC;AAED,MAAa,kBAAkB,IAAI,OAAO,SAAS;CACjD,iBAAiB,EAAE,SAAS,aAAa;CACzC,UAAU,EACR,SAAS;EACP,YAAY,OAAO;EACnB,UAAU,OAAO;CACnB,EACF;AACF,CAAC;AAED,MAAa,oBAAoB,IAAI,OAAO,WAAW;CACrD,iBAAiB,EAAE,WAAW,QAAQ;CACtC,UAAU,EACR,WAAW;EACT,KAAK,OAAO;EACZ,OAAO,OAAO;CAChB,EACF;AACF,CAAC;AAED,MAAa,kBAAkB,IAAI,OAAO,SAAS;CACjD,kBAAkB,CAChB;EACE,OAAO,OAAO;EACd,QAAQ;EACR,SAAS;CACX,GACA;EACE,OAAO,OAAO;EACd,QAAQ;EACR,SAAS;CACX,CACF;CACA,iBAAiB;EAAE,QAAQ;EAAM,SAAS;CAAa;CACvD,UAAU;EACR,QAAQ;GACN,OAAO;GACP,MAAM;EACR;EACA,SAAS;GACP,YAAY,OAAO;GACnB,UAAU,OAAO;EACnB;CACF;AACF,CAAC;AAED,MAAa,iBAAiB,IAAI,OAAO,QAAQ;CAC/C,iBAAiB;EAAE,eAAe;EAAO,SAAS;CAAa;CAC/D,UAAU;EACR,eAAe;GACb,OAAO;GACP,MAAM,OAAO;EACf;EACA,SAAS;GACP,YAAY,OAAO;GACnB,UAAU,OAAO;EACnB;CACF;AACF,CAAC"}