{"version":3,"file":"skeleton.mjs","sources":["../../../src/utils/skeleton.tsx"],"sourcesContent":["import { keyframes } from '@emotion/css';\nimport * as React from 'react';\n\nconst fadeIn = keyframes({\n  '0%': {\n    opacity: 0,\n  },\n  '100%': {\n    opacity: 1,\n  },\n});\n\nexport const skeletonAnimation = {\n  animationName: fadeIn,\n  animationDelay: '100ms',\n  animationTimingFunction: 'ease-in',\n  animationDuration: '100ms',\n  animationFillMode: 'backwards',\n};\n\ninterface SkeletonProps {\n  /**\n   * Spread these props at the root of your skeleton to handle animation logic\n   */\n  rootProps: {\n    style: React.CSSProperties;\n  };\n}\n\nexport type SkeletonComponent<P = {}> = React.ComponentType<P & SkeletonProps>;\n\n/**\n * Use this to attach a skeleton as a static property on the component.\n * e.g. if you render a component with `<Component />`, you can render the skeleton with `<Component.Skeleton />`.\n * @param Component   A functional or class component\n * @param Skeleton    A functional or class skeleton component\n * @returns           A wrapped component with a static skeleton property\n */\nexport const attachSkeleton = <C extends object, P>(Component: C, Skeleton: SkeletonComponent<P>) => {\n  const skeletonWrapper = (props: P) => {\n    return (\n      <Skeleton\n        {...props}\n        rootProps={{\n          style: skeletonAnimation,\n        }}\n      />\n    );\n  };\n  return Object.assign(Component, { Skeleton: skeletonWrapper });\n};\n"],"names":[],"mappings":";;;AAGA,MAAM,SAAS,SAAU,CAAA;AAAA,EACvB,IAAM,EAAA;AAAA,IACJ,OAAS,EAAA;AAAA,GACX;AAAA,EACA,MAAQ,EAAA;AAAA,IACN,OAAS,EAAA;AAAA;AAEb,CAAC,CAAA;AAEM,MAAM,iBAAoB,GAAA;AAAA,EAC/B,aAAe,EAAA,MAAA;AAAA,EACf,cAAgB,EAAA,OAAA;AAAA,EAChB,uBAAyB,EAAA,SAAA;AAAA,EACzB,iBAAmB,EAAA,OAAA;AAAA,EACnB,iBAAmB,EAAA;AACrB;AAoBa,MAAA,cAAA,GAAiB,CAAsB,SAAA,EAAc,QAAmC,KAAA;AACnG,EAAM,MAAA,eAAA,GAAkB,CAAC,KAAa,KAAA;AACpC,IACE,uBAAA,GAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACE,GAAG,KAAA;AAAA,QACJ,SAAW,EAAA;AAAA,UACT,KAAO,EAAA;AAAA;AACT;AAAA,KACF;AAAA,GAEJ;AACA,EAAA,OAAO,OAAO,MAAO,CAAA,SAAA,EAAW,EAAE,QAAA,EAAU,iBAAiB,CAAA;AAC/D;;;;"}