@yamada-ui/react/dist/cjs/components/loading/dots.cjs.map

React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion

{"version":3,"file":"dots.cjs","names":["withContext","Icon","styled","initialProps","superProps"],"sources":["../../../../src/components/loading/dots.tsx"],"sourcesContent":["\"use client\"\n\nimport type { LoadingProps } from \"./loading\"\nimport { styled } from \"../../core\"\nimport { isString } from \"../../utils\"\nimport { Icon } from \"../icon\"\nimport { initialProps, superProps, withContext } from \"./loading\"\n\nexport interface DotsProps extends LoadingProps {}\n\n/**\n * `Loading` is a component displayed during waiting times, such as when data is being loaded.\n *\n * @see https://yamada-ui.com/docs/components/feedback/loading\n */\nexport const Dots = withContext<\"svg\", DotsProps>(({ dur = \"1s\", ...rest }) => {\n  dur = isString(dur) ? parseFloat(dur) : dur\n\n  return (\n    <Icon fill=\"currentColor\" viewBox=\"0 0 120 30\" {...rest}>\n      <styled.circle\n        animationDuration={`${dur}s`}\n        animationIterationCount=\"infinite\"\n        animationTimingFunction=\"linear\"\n        cx=\"15px\"\n        cy=\"15px\"\n        r=\"15px\"\n        transformBox=\"fill-box\"\n        transformOrigin=\"center\"\n        _keyframes={{\n          \"0%, 100%\": { opacity: \"1\", transform: \"scale(1)\" },\n          \"50%\": { opacity: \"0.5\", transform: `scale(calc(9 / 15))` },\n        }}\n      />\n      <styled.circle\n        animationDuration={`${dur}s`}\n        animationIterationCount=\"infinite\"\n        animationTimingFunction=\"linear\"\n        cx=\"60px\"\n        cy=\"15px\"\n        fillOpacity=\"1\"\n        r=\"9px\"\n        transformBox=\"fill-box\"\n        transformOrigin=\"center\"\n        _keyframes={{\n          \"0%, 100%\": { opacity: \"0.5\", transform: \"scale(1)\" },\n          \"50%\": { opacity: \"1\", transform: `scale(calc(15 / 9))` },\n        }}\n      />\n      <styled.circle\n        animationDuration={`${dur}s`}\n        animationIterationCount=\"infinite\"\n        animationTimingFunction=\"linear\"\n        cx=\"105px\"\n        cy=\"15px\"\n        r=\"15px\"\n        transformBox=\"fill-box\"\n        transformOrigin=\"center\"\n        _keyframes={{\n          \"0%, 100%\": { opacity: \"1\", transform: \"scale(1)\" },\n          \"50%\": { opacity: \"0.5\", transform: `scale(calc(9 / 15))` },\n        }}\n      />\n    </Icon>\n  )\n})(initialProps, superProps)\n"],"mappings":";;;;;;;;;;;;;;;;;AAeA,MAAa,OAAOA,6BAA+B,EAAE,MAAM,KAAM,GAAG,WAAW;AAC7E,uDAAe,IAAI,GAAG,WAAW,IAAI,GAAG;AAExC,QACE,4CAACC;EAAK,MAAK;EAAe,SAAQ;EAAa,GAAI;;GACjD,2CAACC,uBAAO;IACN,mBAAmB,GAAG,IAAI;IAC1B,yBAAwB;IACxB,yBAAwB;IACxB,IAAG;IACH,IAAG;IACH,GAAE;IACF,cAAa;IACb,iBAAgB;IAChB,YAAY;KACV,YAAY;MAAE,SAAS;MAAK,WAAW;MAAY;KACnD,OAAO;MAAE,SAAS;MAAO,WAAW;MAAuB;KAC5D;KACD;GACF,2CAACA,uBAAO;IACN,mBAAmB,GAAG,IAAI;IAC1B,yBAAwB;IACxB,yBAAwB;IACxB,IAAG;IACH,IAAG;IACH,aAAY;IACZ,GAAE;IACF,cAAa;IACb,iBAAgB;IAChB,YAAY;KACV,YAAY;MAAE,SAAS;MAAO,WAAW;MAAY;KACrD,OAAO;MAAE,SAAS;MAAK,WAAW;MAAuB;KAC1D;KACD;GACF,2CAACA,uBAAO;IACN,mBAAmB,GAAG,IAAI;IAC1B,yBAAwB;IACxB,yBAAwB;IACxB,IAAG;IACH,IAAG;IACH,GAAE;IACF,cAAa;IACb,iBAAgB;IAChB,YAAY;KACV,YAAY;MAAE,SAAS;MAAK,WAAW;MAAY;KACnD,OAAO;MAAE,SAAS;MAAO,WAAW;MAAuB;KAC5D;KACD;;GACG;EAET,CAACC,8BAAcC,2BAAW"}