UNPKG

@chakra-ui/button

Version:

A React component that is a base button.

1 lines 2.03 kB
{"version":3,"sources":["../src/button-spinner.tsx"],"sourcesContent":["import { Spinner } from \"@chakra-ui/spinner\"\nimport { chakra, HTMLChakraProps, SystemStyleObject } from \"@chakra-ui/system\"\nimport { cx } from \"@chakra-ui/shared-utils\"\nimport { useMemo } from \"react\"\nimport { ButtonSpinnerOptions } from \"./button-types\"\n\ninterface ButtonSpinnerProps\n extends HTMLChakraProps<\"div\">,\n ButtonSpinnerOptions {}\n\nexport function ButtonSpinner(props: ButtonSpinnerProps) {\n const {\n label,\n placement,\n spacing = \"0.5rem\",\n children = <Spinner color=\"currentColor\" width=\"1em\" height=\"1em\" />,\n className,\n __css,\n ...rest\n } = props\n\n const _className = cx(\"chakra-button__spinner\", className)\n\n const marginProp = placement === \"start\" ? \"marginEnd\" : \"marginStart\"\n\n const spinnerStyles: SystemStyleObject = useMemo(\n () => ({\n display: \"flex\",\n alignItems: \"center\",\n position: label ? \"relative\" : \"absolute\",\n [marginProp]: label ? spacing : 0,\n fontSize: \"1em\",\n lineHeight: \"normal\",\n ...__css,\n }),\n [__css, label, marginProp, spacing],\n )\n\n return (\n <chakra.div className={_className} {...rest} __css={spinnerStyles}>\n {children}\n </chakra.div>\n )\n}\nButtonSpinner.displayName = \"ButtonSpinner\"\n"],"mappings":";;;AAAA,SAAS,eAAe;AACxB,SAAS,cAAkD;AAC3D,SAAS,UAAU;AACnB,SAAS,eAAe;AAYT;AALR,SAAS,cAAc,OAA2B;AACvD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,UAAU;AAAA,IACV,WAAW,oBAAC,WAAQ,OAAM,gBAAe,OAAM,OAAM,QAAO,OAAM;AAAA,IAClE;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AAEJ,QAAM,aAAa,GAAG,0BAA0B,SAAS;AAEzD,QAAM,aAAa,cAAc,UAAU,cAAc;AAEzD,QAAM,gBAAmC;AAAA,IACvC,OAAO;AAAA,MACL,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,UAAU,QAAQ,aAAa;AAAA,MAC/B,CAAC,UAAU,GAAG,QAAQ,UAAU;AAAA,MAChC,UAAU;AAAA,MACV,YAAY;AAAA,MACZ,GAAG;AAAA,IACL;AAAA,IACA,CAAC,OAAO,OAAO,YAAY,OAAO;AAAA,EACpC;AAEA,SACE,oBAAC,OAAO,KAAP,EAAW,WAAW,YAAa,GAAG,MAAM,OAAO,eACjD,UACH;AAEJ;AACA,cAAc,cAAc;","names":[]}