@lumx/react 3.20.1-alpha.11 → 3.20.1-alpha.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/_internal/{8fcceef3.js → 0420e67b.js} +13 -14
- package/_internal/{8fcceef3.js.map → 0420e67b.js.map} +1 -1
- package/_internal/{7b214f74.js → 0a490b07.js} +29 -24
- package/_internal/{7b214f74.js.map → 0a490b07.js.map} +1 -1
- package/_internal/{4d92e13b.js → 0be1006e.js} +25 -25
- package/_internal/{4d92e13b.js.map → 0be1006e.js.map} +1 -1
- package/_internal/{dd0a245d.js → 0d1a078c.js} +44 -42
- package/_internal/{dd0a245d.js.map → 0d1a078c.js.map} +1 -1
- package/_internal/{1eab656b.js → 15eab19b.js} +25 -25
- package/_internal/{1eab656b.js.map → 15eab19b.js.map} +1 -1
- package/_internal/{87bada02.js → 179a84d1.js} +64 -67
- package/_internal/{87bada02.js.map → 179a84d1.js.map} +1 -1
- package/_internal/{4c5a7b63.js → 193521fa.js} +11 -12
- package/_internal/{4c5a7b63.js.map → 193521fa.js.map} +1 -1
- package/_internal/{f57d4eb8.js → 1a90ea3d.js} +15 -17
- package/_internal/{f57d4eb8.js.map → 1a90ea3d.js.map} +1 -1
- package/_internal/1deba7d7.js +224 -0
- package/_internal/{2d6bde7d.js.map → 1deba7d7.js.map} +1 -1
- package/_internal/{2938a251.js → 1ea72630.js} +16 -17
- package/_internal/{2938a251.js.map → 1ea72630.js.map} +1 -1
- package/_internal/21b83d16.js +137 -0
- package/_internal/{5ba8fae8.js.map → 21b83d16.js.map} +1 -1
- package/_internal/297bed8f.js +457 -0
- package/_internal/{e53b5a39.js.map → 297bed8f.js.map} +1 -1
- package/_internal/{432c85a7.js → 2c2b6a89.js} +9 -7
- package/_internal/{432c85a7.js.map → 2c2b6a89.js.map} +1 -1
- package/_internal/{bba7d4c4.js → 2f1716fa.js} +75 -63
- package/_internal/{bba7d4c4.js.map → 2f1716fa.js.map} +1 -1
- package/_internal/{2c7942af.js → 2f6c7f84.js} +16 -21
- package/_internal/{2c7942af.js.map → 2f6c7f84.js.map} +1 -1
- package/_internal/{64046d7a.js → 329b5f12.js} +10 -12
- package/_internal/{64046d7a.js.map → 329b5f12.js.map} +1 -1
- package/_internal/332e9844.js +2 -0
- package/_internal/332e9844.js.map +1 -0
- package/_internal/{85d992d2.js → 34c59f5b.js} +101 -98
- package/_internal/{85d992d2.js.map → 34c59f5b.js.map} +1 -1
- package/_internal/{30f4c83c.js → 370bdaed.js} +7 -5
- package/_internal/{30f4c83c.js.map → 370bdaed.js.map} +1 -1
- package/_internal/{7c4f4643.js → 37b007a4.js} +2 -2
- package/_internal/{7c4f4643.js.map → 37b007a4.js.map} +1 -1
- package/_internal/{07e0bd90.js → 3a4e4636.js} +51 -36
- package/_internal/{07e0bd90.js.map → 3a4e4636.js.map} +1 -1
- package/_internal/{3683d267.js → 3e653144.js} +8 -11
- package/_internal/{3683d267.js.map → 3e653144.js.map} +1 -1
- package/_internal/{c43d098b.js → 3f86608e.js} +5 -2
- package/_internal/{c43d098b.js.map → 3f86608e.js.map} +1 -1
- package/_internal/{b3bfbe72.js → 478b5c92.js} +2 -2
- package/_internal/{b3bfbe72.js.map → 478b5c92.js.map} +1 -1
- package/_internal/4962be5b.js +121 -0
- package/_internal/{70cf341b.js.map → 4962be5b.js.map} +1 -1
- package/_internal/{407735b4.js → 4cd870a5.js} +2 -2
- package/_internal/{407735b4.js.map → 4cd870a5.js.map} +1 -1
- package/_internal/{e4613195.js → 501f2f9f.js} +8 -9
- package/_internal/{e4613195.js.map → 501f2f9f.js.map} +1 -1
- package/_internal/5e7b90e2.js +2 -0
- package/_internal/5e7b90e2.js.map +1 -0
- package/_internal/{18334f0d.js → 5ec059fe.js} +48 -43
- package/_internal/{18334f0d.js.map → 5ec059fe.js.map} +1 -1
- package/_internal/{fc47f2da.js → 5f8f9454.js} +10 -12
- package/_internal/{fc47f2da.js.map → 5f8f9454.js.map} +1 -1
- package/_internal/{3f3de25e.js → 5fe09341.js} +3 -3
- package/_internal/{3f3de25e.js.map → 5fe09341.js.map} +1 -1
- package/_internal/{714809cc.js → 628468c4.js} +47 -46
- package/_internal/{714809cc.js.map → 628468c4.js.map} +1 -1
- package/_internal/{d3321a86.js → 6589b796.js} +2 -12
- package/_internal/{d3321a86.js.map → 6589b796.js.map} +1 -1
- package/_internal/{2368cb68.js → 65f91970.js} +43 -43
- package/_internal/{2368cb68.js.map → 65f91970.js.map} +1 -1
- package/_internal/66f691d3.js +74 -0
- package/_internal/{1921f348.js.map → 66f691d3.js.map} +1 -1
- package/_internal/{bdd41804.js → 68c10f98.js} +50 -41
- package/_internal/{bdd41804.js.map → 68c10f98.js.map} +1 -1
- package/_internal/{9cfa3e10.js → 690ca33e.js} +36 -35
- package/_internal/{9cfa3e10.js.map → 690ca33e.js.map} +1 -1
- package/_internal/6ca04271.js +108 -0
- package/_internal/{a67f26a8.js.map → 6ca04271.js.map} +1 -1
- package/_internal/{cdc3efab.js → 6da19518.js} +24 -32
- package/_internal/{cdc3efab.js.map → 6da19518.js.map} +1 -1
- package/_internal/{bcce6ceb.js → 7093ba23.js} +6 -4
- package/_internal/{bcce6ceb.js.map → 7093ba23.js.map} +1 -1
- package/_internal/{bc4cb4c0.js → 74a4a214.js} +29 -33
- package/_internal/{bc4cb4c0.js.map → 74a4a214.js.map} +1 -1
- package/_internal/{95a2e851.js → 76be70dd.js} +3 -3
- package/_internal/{95a2e851.js.map → 76be70dd.js.map} +1 -1
- package/_internal/{60f8e509.js → 7f54e947.js} +114 -101
- package/_internal/{60f8e509.js.map → 7f54e947.js.map} +1 -1
- package/_internal/{72407886.js → 84dfe68f.js} +50 -44
- package/_internal/{72407886.js.map → 84dfe68f.js.map} +1 -1
- package/_internal/{e2440593.js → 85e3a5ca.js} +32 -35
- package/_internal/{e2440593.js.map → 85e3a5ca.js.map} +1 -1
- package/_internal/{742d4906.js → 86aa4aa4.js} +60 -54
- package/_internal/{742d4906.js.map → 86aa4aa4.js.map} +1 -1
- package/_internal/{4e1dde79.js → 8ab42752.js} +25 -26
- package/_internal/{4e1dde79.js.map → 8ab42752.js.map} +1 -1
- package/_internal/{0f4b35b2.js → 95cfd814.js} +14 -20
- package/_internal/{0f4b35b2.js.map → 95cfd814.js.map} +1 -1
- package/_internal/{d6b3a3c0.js → 9a4dfad0.js} +48 -39
- package/_internal/{d6b3a3c0.js.map → 9a4dfad0.js.map} +1 -1
- package/_internal/{80e5c950.js → 9c9df5f2.js} +19 -19
- package/_internal/{80e5c950.js.map → 9c9df5f2.js.map} +1 -1
- package/_internal/{21aeb1c7.js → 9d1336a1.js} +6 -6
- package/_internal/{21aeb1c7.js.map → 9d1336a1.js.map} +1 -1
- package/_internal/{ee64ab0d.js → 9fdc715b.js} +37 -34
- package/_internal/{ee64ab0d.js.map → 9fdc715b.js.map} +1 -1
- package/_internal/a003602b.js +116 -0
- package/_internal/{32698205.js.map → a003602b.js.map} +1 -1
- package/_internal/{baa0a23b.js → a34639bd.js} +31 -29
- package/_internal/{baa0a23b.js.map → a34639bd.js.map} +1 -1
- package/_internal/{cb036703.js → a84f4981.js} +35 -26
- package/_internal/{cb036703.js.map → a84f4981.js.map} +1 -1
- package/_internal/{9210e2f3.js → b0a7a999.js} +10 -12
- package/_internal/{9210e2f3.js.map → b0a7a999.js.map} +1 -1
- package/_internal/{3646abc3.js → b0b2e33d.js} +117 -104
- package/_internal/{3646abc3.js.map → b0b2e33d.js.map} +1 -1
- package/_internal/{1aaa0341.js → b1af5979.js} +168 -160
- package/_internal/{1aaa0341.js.map → b1af5979.js.map} +1 -1
- package/_internal/{21cf275f.js → b477da26.js} +63 -57
- package/_internal/{21cf275f.js.map → b477da26.js.map} +1 -1
- package/_internal/{60923026.js → b8667090.js} +2 -2
- package/_internal/{60923026.js.map → b8667090.js.map} +1 -1
- package/_internal/{1e4b7ad5.js → bae266a9.js} +19 -18
- package/_internal/{1e4b7ad5.js.map → bae266a9.js.map} +1 -1
- package/_internal/{9d8130ae.js → be6da9b0.js} +69 -74
- package/_internal/{9d8130ae.js.map → be6da9b0.js.map} +1 -1
- package/_internal/{9452daf7.js → c0414b89.js} +10 -12
- package/_internal/{9452daf7.js.map → c0414b89.js.map} +1 -1
- package/_internal/{e566d502.js → c2388b10.js} +21 -17
- package/_internal/{e566d502.js.map → c2388b10.js.map} +1 -1
- package/_internal/{9cf0d217.js → c459a04d.js} +55 -54
- package/_internal/{9cf0d217.js.map → c459a04d.js.map} +1 -1
- package/_internal/c6ca7494.js +2 -0
- package/_internal/c6ca7494.js.map +1 -0
- package/_internal/{01bc8fcf.js → cdddaed8.js} +20 -18
- package/_internal/{01bc8fcf.js.map → cdddaed8.js.map} +1 -1
- package/_internal/{0361b7fb.js → d45e3f16.js} +2 -2
- package/_internal/{0361b7fb.js.map → d45e3f16.js.map} +1 -1
- package/_internal/{d66c4375.js → d5f316cb.js} +2 -2
- package/_internal/{d66c4375.js.map → d5f316cb.js.map} +1 -1
- package/_internal/{0a31e895.js → db4fdc7b.js} +63 -57
- package/_internal/{0a31e895.js.map → db4fdc7b.js.map} +1 -1
- package/_internal/dbe0cf24.js +75 -0
- package/_internal/{803945f7.js.map → dbe0cf24.js.map} +1 -1
- package/_internal/{4ceaf17c.js → e2afb13f.js} +2 -2
- package/_internal/{4ceaf17c.js.map → e2afb13f.js.map} +1 -1
- package/_internal/{b925072d.js → e52f0d3f.js} +37 -34
- package/_internal/{b925072d.js.map → e52f0d3f.js.map} +1 -1
- package/_internal/{aa8c5d9b.js → e6dd117e.js} +2 -2
- package/_internal/{aa8c5d9b.js.map → e6dd117e.js.map} +1 -1
- package/_internal/{077b7bef.js → ea04260d.js} +6 -6
- package/_internal/{077b7bef.js.map → ea04260d.js.map} +1 -1
- package/_internal/{77eb8ef3.js → eaa8b1d8.js} +39 -38
- package/_internal/{77eb8ef3.js.map → eaa8b1d8.js.map} +1 -1
- package/_internal/{aafcf80e.js → edab29ce.js} +61 -65
- package/_internal/{aafcf80e.js.map → edab29ce.js.map} +1 -1
- package/_internal/{38b3ecf3.js → f0900583.js} +54 -45
- package/_internal/{38b3ecf3.js.map → f0900583.js.map} +1 -1
- package/_internal/{881714a1.js → f23cdf84.js} +45 -51
- package/_internal/{881714a1.js.map → f23cdf84.js.map} +1 -1
- package/_internal/f52e979e.js +3 -0
- package/_internal/f52e979e.js.map +1 -0
- package/_internal/{1ce667fb.js → f5508d3d.js} +53 -51
- package/_internal/{1ce667fb.js.map → f5508d3d.js.map} +1 -1
- package/_internal/{43262bfe.js → f93fe83e.js} +11 -13
- package/_internal/{43262bfe.js.map → f93fe83e.js.map} +1 -1
- package/index.js +63 -63
- package/package.json +3 -11
- package/utils/index.js +3 -3
- package/_internal/1921f348.js +0 -72
- package/_internal/286fc728.js +0 -2
- package/_internal/286fc728.js.map +0 -1
- package/_internal/2d6bde7d.js +0 -209
- package/_internal/32698205.js +0 -107
- package/_internal/5ba8fae8.js +0 -120
- package/_internal/70cf341b.js +0 -117
- package/_internal/803945f7.js +0 -65
- package/_internal/a67f26a8.js +0 -98
- package/_internal/ac3bc511.js +0 -2
- package/_internal/ac3bc511.js.map +0 -1
- package/_internal/cc995526.js +0 -2
- package/_internal/cc995526.js.map +0 -1
- package/_internal/e2122a37.js +0 -3
- package/_internal/e2122a37.js.map +0 -1
- package/_internal/e53b5a39.js +0 -407
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"
|
|
1
|
+
{"version":3,"file":"66f691d3.js","sources":["../../src/components/link/Link.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport { ColorVariant, ColorWithVariants, Icon, Typography } from '@lumx/react';\nimport { GenericProps } from '@lumx/react/utils/type';\nimport {\n getRootClassName,\n getTypographyClassName,\n handleBasicClasses,\n resolveColorWithVariants,\n} from '@lumx/core/js/utils/className';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\nimport { wrapChildrenIconWithSpaces } from '@lumx/react/utils/react/wrapChildrenIconWithSpaces';\nimport { HasAriaDisabled } from '@lumx/react/utils/type/HasAriaDisabled';\nimport { RawClickable } from '@lumx/react/utils/react/RawClickable';\nimport { useDisableStateProps } from '@lumx/react/utils/disabled';\n\ntype HTMLAnchorProps = React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>;\n\n/**\n * Defines the props of the component.\n */\nexport interface LinkProps extends GenericProps, HasAriaDisabled {\n /** Color variant. */\n color?: ColorWithVariants;\n /** Lightened or darkened variant of the selected icon color. */\n colorVariant?: ColorVariant;\n /** Link href. */\n href?: HTMLAnchorProps['href'];\n /** Whether the component is disabled or not. */\n isDisabled?: boolean;\n /**\n * Left icon (SVG path).\n * @deprecated Instead, simply nest `<Icon />` in the children\n */\n leftIcon?: string;\n /** Custom react component for the link (can be used to inject react router Link). */\n linkAs?: 'a' | any;\n /**\n * Right icon (SVG path).\n * @deprecated Instead, simply nest `<Icon />` in the children\n */\n rightIcon?: string;\n /** Link target. */\n target?: HTMLAnchorProps['target'];\n /** Typography variant. */\n typography?: Typography;\n /** Children */\n children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Link';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Link component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Link = forwardRef<LinkProps, HTMLAnchorElement | HTMLButtonElement>((props, ref) => {\n const { disabledStateProps, otherProps } = useDisableStateProps(props);\n const {\n children,\n className,\n color: propColor,\n colorVariant: propColorVariant,\n leftIcon,\n rightIcon,\n typography,\n linkAs,\n ...forwardedProps\n } = otherProps;\n const [color, colorVariant] = resolveColorWithVariants(propColor, propColorVariant);\n\n return (\n <RawClickable\n ref={ref as any}\n as={linkAs || (forwardedProps.href ? 'a' : 'button')}\n {...forwardedProps}\n {...disabledStateProps}\n className={classNames(\n className,\n handleBasicClasses({ prefix: CLASSNAME, color, colorVariant, hasTypography: !!typography }),\n typography && getTypographyClassName(typography),\n )}\n >\n {wrapChildrenIconWithSpaces(\n <>\n {leftIcon && <Icon icon={leftIcon} className={`${CLASSNAME}__left-icon`} />}\n {children && <span className={`${CLASSNAME}__content`}>{children}</span>}\n {rightIcon && <Icon icon={rightIcon} className={`${CLASSNAME}__right-icon`} />}\n </>,\n )}\n </RawClickable>\n );\n});\nLink.displayName = COMPONENT_NAME;\nLink.className = CLASSNAME;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","Link","forwardRef","props","ref","disabledStateProps","otherProps","useDisableStateProps","children","className","color","propColor","colorVariant","propColorVariant","leftIcon","rightIcon","typography","linkAs","forwardedProps","resolveColorWithVariants","_jsx","RawClickable","as","href","classNames","handleBasicClasses","prefix","hasTypography","getTypographyClassName","wrapChildrenIconWithSpaces","_jsxs","_Fragment","Icon","icon","displayName"],"mappings":";;;;;;;;;;AAkDA;AACA;AACA;AACA,MAAMA,cAAc,GAAG,MAAM,CAAA;;AAE7B;AACA;AACA;AACA,MAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,CAAC,CAAA;;AAElD;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMG,IAAI,GAAGC,UAAU,CAAmD,CAACC,KAAK,EAAEC,GAAG,KAAK;EAC7F,MAAM;IAAEC,kBAAkB;AAAEC,IAAAA,UAAAA;AAAW,GAAC,GAAGC,oBAAoB,CAACJ,KAAK,CAAC,CAAA;EACtE,MAAM;IACFK,QAAQ;IACRC,SAAS;AACTC,IAAAA,KAAK,EAAEC,SAAS;AAChBC,IAAAA,YAAY,EAAEC,gBAAgB;IAC9BC,QAAQ;IACRC,SAAS;IACTC,UAAU;IACVC,MAAM;IACN,GAAGC,cAAAA;AACP,GAAC,GAAGZ,UAAU,CAAA;EACd,MAAM,CAACI,KAAK,EAAEE,YAAY,CAAC,GAAGO,wBAAwB,CAACR,SAAS,EAAEE,gBAAgB,CAAC,CAAA;EAEnF,oBACIO,GAAA,CAACC,YAAY,EAAA;AACTjB,IAAAA,GAAG,EAAEA,GAAW;IAChBkB,EAAE,EAAEL,MAAM,KAAKC,cAAc,CAACK,IAAI,GAAG,GAAG,GAAG,QAAQ,CAAE;AAAA,IAAA,GACjDL,cAAc;AAAA,IAAA,GACdb,kBAAkB;AACtBI,IAAAA,SAAS,EAAEe,UAAU,CACjBf,SAAS,EACTgB,kBAAkB,CAAC;AAAEC,MAAAA,MAAM,EAAE3B,SAAS;MAAEW,KAAK;MAAEE,YAAY;MAAEe,aAAa,EAAE,CAAC,CAACX,UAAAA;KAAY,CAAC,EAC3FA,UAAU,IAAIY,sBAAsB,CAACZ,UAAU,CACnD,CAAE;AAAAR,IAAAA,QAAA,EAEDqB,0BAA0B,cACvBC,IAAA,CAAAC,QAAA,EAAA;AAAAvB,MAAAA,QAAA,EACKM,CAAAA,QAAQ,iBAAIM,GAAA,CAACY,IAAI,EAAA;AAACC,QAAAA,IAAI,EAAEnB,QAAS;QAACL,SAAS,EAAE,GAAGV,SAAS,CAAA,WAAA,CAAA;AAAc,OAAE,CAAC,EAC1ES,QAAQ,iBAAIY,GAAA,CAAA,MAAA,EAAA;QAAMX,SAAS,EAAE,CAAGV,EAAAA,SAAS,CAAY,SAAA,CAAA;AAAAS,QAAAA,QAAA,EAAEA,QAAAA;AAAQ,OAAO,CAAC,EACvEO,SAAS,iBAAIK,GAAA,CAACY,IAAI,EAAA;AAACC,QAAAA,IAAI,EAAElB,SAAU;QAACN,SAAS,EAAE,GAAGV,SAAS,CAAA,YAAA,CAAA;AAAe,OAAE,CAAC,CAAA;AAAA,KAChF,CACN,CAAA;AAAC,GACS,CAAC,CAAA;AAEvB,CAAC,EAAC;AACFE,IAAI,CAACiC,WAAW,GAAGpC,cAAc,CAAA;AACjCG,IAAI,CAACQ,SAAS,GAAGV,SAAS;;;;"}
|
|
@@ -1,18 +1,15 @@
|
|
|
1
|
-
import { m as getRootClassName, n as forwardRef, b as Theme, j as ColorPalette, l as classNames, _ as _extends, d as Emphasis } from './d3321a86.js';
|
|
2
1
|
import React__default, { Children, useRef } from 'react';
|
|
2
|
+
import { m as getRootClassName, n as forwardRef, b as Theme, j as ColorPalette, l as classNames, d as Emphasis } from './6589b796.js';
|
|
3
3
|
import isEmpty from 'lodash/isEmpty';
|
|
4
4
|
import { i as isComponent } from './78df9309.js';
|
|
5
|
-
import { h as handleBasicClasses } from './
|
|
5
|
+
import { h as handleBasicClasses } from './e2afb13f.js';
|
|
6
6
|
import { p as partitionMulti } from './4daccdd5.js';
|
|
7
7
|
import { u as useTheme } from './3181f000.js';
|
|
8
|
-
import { I as IS_BROWSER } from './
|
|
8
|
+
import { I as IS_BROWSER } from './478b5c92.js';
|
|
9
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
9
10
|
import { m as mdiChevronUp, a as mdiChevronDown } from './0b9c76cb.js';
|
|
10
|
-
import { DragHandle } from './
|
|
11
|
-
import { I as IconButton } from './
|
|
12
|
-
|
|
13
|
-
/**
|
|
14
|
-
* Defines the props of the component.
|
|
15
|
-
*/
|
|
11
|
+
import { DragHandle } from './1a90ea3d.js';
|
|
12
|
+
import { I as IconButton } from './0a490b07.js';
|
|
16
13
|
|
|
17
14
|
/**
|
|
18
15
|
* Component display name.
|
|
@@ -65,9 +62,10 @@ const ExpansionPanel = forwardRef((props, ref) => {
|
|
|
65
62
|
|
|
66
63
|
// Either take the header in children or create one with the label.
|
|
67
64
|
const headerProps = /*#__PURE__*/React__default.isValidElement(header) ? header.props : {};
|
|
68
|
-
const headerContent = !isEmpty(headerProps.children) ? headerProps.children : /*#__PURE__*/
|
|
69
|
-
className: `${CLASSNAME}__label
|
|
70
|
-
|
|
65
|
+
const headerContent = !isEmpty(headerProps.children) ? headerProps.children : /*#__PURE__*/jsx("span", {
|
|
66
|
+
className: `${CLASSNAME}__label`,
|
|
67
|
+
children: label
|
|
68
|
+
});
|
|
71
69
|
const toggleOpen = event => {
|
|
72
70
|
const shouldOpen = !isOpen;
|
|
73
71
|
if (onOpen && shouldOpen) {
|
|
@@ -120,38 +118,49 @@ const ExpansionPanel = forwardRef((props, ref) => {
|
|
|
120
118
|
wrapper.addEventListener('transitionend', onTransitionEnd);
|
|
121
119
|
return () => wrapper.removeEventListener('transitionend', onTransitionEnd);
|
|
122
120
|
}, [closeMode]);
|
|
123
|
-
return /*#__PURE__*/
|
|
124
|
-
ref: ref
|
|
125
|
-
|
|
126
|
-
className: rootClassName
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
121
|
+
return /*#__PURE__*/jsxs("section", {
|
|
122
|
+
ref: ref,
|
|
123
|
+
...forwardedProps,
|
|
124
|
+
className: rootClassName,
|
|
125
|
+
children: [/*#__PURE__*/jsxs("header", {
|
|
126
|
+
className: `${CLASSNAME}__header`,
|
|
127
|
+
onClick: toggleOpen,
|
|
128
|
+
children: [dragHandle && /*#__PURE__*/jsx("div", {
|
|
129
|
+
className: `${CLASSNAME}__header-drag`,
|
|
130
|
+
children: dragHandle
|
|
131
|
+
}), /*#__PURE__*/jsx("div", {
|
|
132
|
+
...headerProps,
|
|
133
|
+
className: `${CLASSNAME}__header-content`,
|
|
134
|
+
children: headerContent
|
|
135
|
+
}), /*#__PURE__*/jsx("div", {
|
|
136
|
+
className: `${CLASSNAME}__header-toggle`,
|
|
137
|
+
children: /*#__PURE__*/jsx(IconButton, {
|
|
138
|
+
...toggleButtonProps,
|
|
139
|
+
color: color,
|
|
140
|
+
emphasis: Emphasis.low,
|
|
141
|
+
icon: isOpen ? mdiChevronUp : mdiChevronDown,
|
|
142
|
+
"aria-expanded": isOpen || 'false'
|
|
143
|
+
})
|
|
144
|
+
})]
|
|
145
|
+
}), /*#__PURE__*/jsx("div", {
|
|
146
|
+
className: `${CLASSNAME}__wrapper`,
|
|
147
|
+
ref: wrapperRef,
|
|
148
|
+
children: (isOpen || isChildrenVisible) && /*#__PURE__*/jsxs("div", {
|
|
149
|
+
className: `${CLASSNAME}__container`,
|
|
150
|
+
children: [/*#__PURE__*/jsx("div", {
|
|
151
|
+
className: `${CLASSNAME}__content`,
|
|
152
|
+
children: content
|
|
153
|
+
}), footer && /*#__PURE__*/jsx("div", {
|
|
154
|
+
className: `${CLASSNAME}__footer`,
|
|
155
|
+
children: footer
|
|
156
|
+
})]
|
|
157
|
+
})
|
|
158
|
+
})]
|
|
159
|
+
});
|
|
151
160
|
});
|
|
152
161
|
ExpansionPanel.displayName = COMPONENT_NAME;
|
|
153
162
|
ExpansionPanel.className = CLASSNAME;
|
|
154
163
|
ExpansionPanel.defaultProps = DEFAULT_PROPS;
|
|
155
164
|
|
|
156
165
|
export { ExpansionPanel };
|
|
157
|
-
//# sourceMappingURL=
|
|
166
|
+
//# sourceMappingURL=68c10f98.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bdd41804.js","sources":["../../src/components/expansion-panel/ExpansionPanel.tsx"],"sourcesContent":["import React, { Children, PropsWithChildren, ReactNode, useRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport { mdiChevronDown, mdiChevronUp } from '@lumx/icons';\n\nimport isEmpty from 'lodash/isEmpty';\n\nimport { ColorPalette, DragHandle, Emphasis, IconButton, IconButtonProps, Theme } from '@lumx/react';\nimport { GenericProps, HasCloseMode, HasTheme, isComponent } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { partitionMulti } from '@lumx/react/utils/partitionMulti';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\nimport { IS_BROWSER } from '@lumx/react/constants';\n\n/**\n * Defines the props of the component.\n */\nexport interface ExpansionPanelProps extends GenericProps, HasCloseMode, HasTheme {\n /** Whether the expansion panel has a background. */\n hasBackground?: boolean;\n /** Whether the header has a divider. */\n hasHeaderDivider?: boolean;\n /** Whether the component is open or not. */\n isOpen?: boolean;\n /** Label text (overwritten if a `<header>` is provided in the children). */\n label?: string;\n /** On open callback. */\n onOpen?: (event: React.MouseEvent) => void;\n /** On close callback. */\n onClose?: (event: React.MouseEvent) => void;\n /** Props to pass to the toggle button (minus those already set by the ExpansionPanel props). */\n toggleButtonProps: Pick<IconButtonProps, 'label'> &\n Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis' | 'color'>;\n /** On toggle open or close callback. */\n onToggleOpen?(shouldOpen: boolean, event: React.MouseEvent): void;\n /** Children */\n children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'ExpansionPanel';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<ExpansionPanelProps> = {\n closeMode: 'unmount',\n};\n\nconst isDragHandle = isComponent(DragHandle);\nconst isHeader = isComponent('header');\nconst isFooter = isComponent('footer');\n\n/**\n * ExpansionPanel component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const ExpansionPanel = forwardRef<ExpansionPanelProps, HTMLDivElement>((props, ref) => {\n const defaultTheme = useTheme() || Theme.light;\n const {\n className,\n closeMode = DEFAULT_PROPS.closeMode,\n children: anyChildren,\n hasBackground,\n hasHeaderDivider,\n isOpen,\n label,\n onClose,\n onOpen,\n onToggleOpen,\n theme = defaultTheme,\n toggleButtonProps,\n ...forwardedProps\n } = props;\n\n const children: ReactNode[] = Children.toArray(anyChildren);\n\n // Partition children by types.\n const [[dragHandle], [header], [footer], content] = partitionMulti(children, [isDragHandle, isHeader, isFooter]);\n\n // Either take the header in children or create one with the label.\n const headerProps: PropsWithChildren<any> = React.isValidElement(header) ? header.props : {};\n const headerContent = !isEmpty(headerProps.children) ? (\n headerProps.children\n ) : (\n <span className={`${CLASSNAME}__label`}>{label}</span>\n );\n\n const toggleOpen = (event: React.MouseEvent) => {\n const shouldOpen = !isOpen;\n\n if (onOpen && shouldOpen) {\n onOpen(event);\n }\n if (onClose && !shouldOpen) {\n onClose(event);\n }\n if (onToggleOpen) {\n onToggleOpen(shouldOpen, event);\n }\n };\n\n const color = theme === Theme.dark ? ColorPalette.light : ColorPalette.dark;\n\n const rootClassName = classNames(\n className,\n handleBasicClasses({\n hasBackground,\n hasHeader: Boolean(!isEmpty(headerProps.children)),\n hasHeaderDivider,\n isClose: !isOpen,\n isDraggable: Boolean(dragHandle),\n isOpen,\n prefix: CLASSNAME,\n theme,\n }),\n );\n\n const wrapperRef = useRef<HTMLDivElement>(null);\n\n // Children stay visible while the open/close transition is running\n const [isChildrenVisible, setChildrenVisible] = React.useState(isOpen);\n\n const isOpenRef = React.useRef(isOpen);\n React.useEffect(() => {\n if (isOpen || closeMode === 'hide') {\n setChildrenVisible(true);\n } else if (!IS_BROWSER) {\n // Outside a browser we can't wait for the transition\n setChildrenVisible(false);\n }\n isOpenRef.current = isOpen;\n }, [closeMode, isOpen]);\n\n // Change children's visibility on the transition end\n React.useEffect(() => {\n const { current: wrapper } = wrapperRef;\n if (!IS_BROWSER || !wrapper) {\n return undefined;\n }\n const onTransitionEnd = () => {\n setChildrenVisible(isOpenRef.current || closeMode === 'hide');\n };\n wrapper.addEventListener('transitionend', onTransitionEnd);\n return () => wrapper.removeEventListener('transitionend', onTransitionEnd);\n }, [closeMode]);\n\n return (\n <section ref={ref} {...forwardedProps} className={rootClassName}>\n {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions */}\n <header className={`${CLASSNAME}__header`} onClick={toggleOpen}>\n {dragHandle && <div className={`${CLASSNAME}__header-drag`}>{dragHandle}</div>}\n\n <div {...headerProps} className={`${CLASSNAME}__header-content`}>\n {headerContent}\n </div>\n\n <div className={`${CLASSNAME}__header-toggle`}>\n <IconButton\n {...toggleButtonProps}\n color={color}\n emphasis={Emphasis.low}\n icon={isOpen ? mdiChevronUp : mdiChevronDown}\n aria-expanded={isOpen || 'false'}\n />\n </div>\n </header>\n\n <div className={`${CLASSNAME}__wrapper`} ref={wrapperRef}>\n {(isOpen || isChildrenVisible) && (\n <div className={`${CLASSNAME}__container`}>\n <div className={`${CLASSNAME}__content`}>{content}</div>\n\n {footer && <div className={`${CLASSNAME}__footer`}>{footer}</div>}\n </div>\n )}\n </div>\n </section>\n );\n});\nExpansionPanel.displayName = COMPONENT_NAME;\nExpansionPanel.className = CLASSNAME;\nExpansionPanel.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","closeMode","isDragHandle","isComponent","DragHandle","isHeader","isFooter","ExpansionPanel","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","className","children","anyChildren","hasBackground","hasHeaderDivider","isOpen","label","onClose","onOpen","onToggleOpen","theme","toggleButtonProps","forwardedProps","Children","toArray","dragHandle","header","footer","content","partitionMulti","headerProps","React","isValidElement","headerContent","isEmpty","createElement","toggleOpen","event","shouldOpen","color","dark","ColorPalette","rootClassName","classNames","handleBasicClasses","hasHeader","Boolean","isClose","isDraggable","prefix","wrapperRef","useRef","isChildrenVisible","setChildrenVisible","useState","isOpenRef","useEffect","IS_BROWSER","current","wrapper","undefined","onTransitionEnd","addEventListener","removeEventListener","_extends","onClick","IconButton","emphasis","Emphasis","low","icon","mdiChevronUp","mdiChevronDown","displayName","defaultProps"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"68c10f98.js","sources":["../../src/components/expansion-panel/ExpansionPanel.tsx"],"sourcesContent":["import React, { Children, PropsWithChildren, ReactNode, useRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport { mdiChevronDown, mdiChevronUp } from '@lumx/icons';\n\nimport isEmpty from 'lodash/isEmpty';\n\nimport { ColorPalette, DragHandle, Emphasis, IconButton, IconButtonProps, Theme } from '@lumx/react';\nimport { GenericProps, HasCloseMode, HasTheme, isComponent } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { partitionMulti } from '@lumx/react/utils/partitionMulti';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\nimport { IS_BROWSER } from '@lumx/react/constants';\n\n/**\n * Defines the props of the component.\n */\nexport interface ExpansionPanelProps extends GenericProps, HasCloseMode, HasTheme {\n /** Whether the expansion panel has a background. */\n hasBackground?: boolean;\n /** Whether the header has a divider. */\n hasHeaderDivider?: boolean;\n /** Whether the component is open or not. */\n isOpen?: boolean;\n /** Label text (overwritten if a `<header>` is provided in the children). */\n label?: string;\n /** On open callback. */\n onOpen?: (event: React.MouseEvent) => void;\n /** On close callback. */\n onClose?: (event: React.MouseEvent) => void;\n /** Props to pass to the toggle button (minus those already set by the ExpansionPanel props). */\n toggleButtonProps: Pick<IconButtonProps, 'label'> &\n Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis' | 'color'>;\n /** On toggle open or close callback. */\n onToggleOpen?(shouldOpen: boolean, event: React.MouseEvent): void;\n /** Children */\n children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'ExpansionPanel';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<ExpansionPanelProps> = {\n closeMode: 'unmount',\n};\n\nconst isDragHandle = isComponent(DragHandle);\nconst isHeader = isComponent('header');\nconst isFooter = isComponent('footer');\n\n/**\n * ExpansionPanel component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const ExpansionPanel = forwardRef<ExpansionPanelProps, HTMLDivElement>((props, ref) => {\n const defaultTheme = useTheme() || Theme.light;\n const {\n className,\n closeMode = DEFAULT_PROPS.closeMode,\n children: anyChildren,\n hasBackground,\n hasHeaderDivider,\n isOpen,\n label,\n onClose,\n onOpen,\n onToggleOpen,\n theme = defaultTheme,\n toggleButtonProps,\n ...forwardedProps\n } = props;\n\n const children: ReactNode[] = Children.toArray(anyChildren);\n\n // Partition children by types.\n const [[dragHandle], [header], [footer], content] = partitionMulti(children, [isDragHandle, isHeader, isFooter]);\n\n // Either take the header in children or create one with the label.\n const headerProps: PropsWithChildren<any> = React.isValidElement(header) ? header.props : {};\n const headerContent = !isEmpty(headerProps.children) ? (\n headerProps.children\n ) : (\n <span className={`${CLASSNAME}__label`}>{label}</span>\n );\n\n const toggleOpen = (event: React.MouseEvent) => {\n const shouldOpen = !isOpen;\n\n if (onOpen && shouldOpen) {\n onOpen(event);\n }\n if (onClose && !shouldOpen) {\n onClose(event);\n }\n if (onToggleOpen) {\n onToggleOpen(shouldOpen, event);\n }\n };\n\n const color = theme === Theme.dark ? ColorPalette.light : ColorPalette.dark;\n\n const rootClassName = classNames(\n className,\n handleBasicClasses({\n hasBackground,\n hasHeader: Boolean(!isEmpty(headerProps.children)),\n hasHeaderDivider,\n isClose: !isOpen,\n isDraggable: Boolean(dragHandle),\n isOpen,\n prefix: CLASSNAME,\n theme,\n }),\n );\n\n const wrapperRef = useRef<HTMLDivElement>(null);\n\n // Children stay visible while the open/close transition is running\n const [isChildrenVisible, setChildrenVisible] = React.useState(isOpen);\n\n const isOpenRef = React.useRef(isOpen);\n React.useEffect(() => {\n if (isOpen || closeMode === 'hide') {\n setChildrenVisible(true);\n } else if (!IS_BROWSER) {\n // Outside a browser we can't wait for the transition\n setChildrenVisible(false);\n }\n isOpenRef.current = isOpen;\n }, [closeMode, isOpen]);\n\n // Change children's visibility on the transition end\n React.useEffect(() => {\n const { current: wrapper } = wrapperRef;\n if (!IS_BROWSER || !wrapper) {\n return undefined;\n }\n const onTransitionEnd = () => {\n setChildrenVisible(isOpenRef.current || closeMode === 'hide');\n };\n wrapper.addEventListener('transitionend', onTransitionEnd);\n return () => wrapper.removeEventListener('transitionend', onTransitionEnd);\n }, [closeMode]);\n\n return (\n <section ref={ref} {...forwardedProps} className={rootClassName}>\n {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions */}\n <header className={`${CLASSNAME}__header`} onClick={toggleOpen}>\n {dragHandle && <div className={`${CLASSNAME}__header-drag`}>{dragHandle}</div>}\n\n <div {...headerProps} className={`${CLASSNAME}__header-content`}>\n {headerContent}\n </div>\n\n <div className={`${CLASSNAME}__header-toggle`}>\n <IconButton\n {...toggleButtonProps}\n color={color}\n emphasis={Emphasis.low}\n icon={isOpen ? mdiChevronUp : mdiChevronDown}\n aria-expanded={isOpen || 'false'}\n />\n </div>\n </header>\n\n <div className={`${CLASSNAME}__wrapper`} ref={wrapperRef}>\n {(isOpen || isChildrenVisible) && (\n <div className={`${CLASSNAME}__container`}>\n <div className={`${CLASSNAME}__content`}>{content}</div>\n\n {footer && <div className={`${CLASSNAME}__footer`}>{footer}</div>}\n </div>\n )}\n </div>\n </section>\n );\n});\nExpansionPanel.displayName = COMPONENT_NAME;\nExpansionPanel.className = CLASSNAME;\nExpansionPanel.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","closeMode","isDragHandle","isComponent","DragHandle","isHeader","isFooter","ExpansionPanel","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","className","children","anyChildren","hasBackground","hasHeaderDivider","isOpen","label","onClose","onOpen","onToggleOpen","theme","toggleButtonProps","forwardedProps","Children","toArray","dragHandle","header","footer","content","partitionMulti","headerProps","React","isValidElement","headerContent","isEmpty","_jsx","toggleOpen","event","shouldOpen","color","dark","ColorPalette","rootClassName","classNames","handleBasicClasses","hasHeader","Boolean","isClose","isDraggable","prefix","wrapperRef","useRef","isChildrenVisible","setChildrenVisible","useState","isOpenRef","useEffect","IS_BROWSER","current","wrapper","undefined","onTransitionEnd","addEventListener","removeEventListener","_jsxs","onClick","IconButton","emphasis","Emphasis","low","icon","mdiChevronUp","mdiChevronDown","displayName","defaultProps"],"mappings":"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"}
|
|
@@ -1,12 +1,10 @@
|
|
|
1
|
-
import { m as getRootClassName, A as Alignment, n as forwardRef, b as Theme,
|
|
2
|
-
import { h as handleBasicClasses } from './
|
|
1
|
+
import { m as getRootClassName, A as Alignment, n as forwardRef, b as Theme, l as classNames } from './6589b796.js';
|
|
2
|
+
import { h as handleBasicClasses } from './e2afb13f.js';
|
|
3
3
|
import { u as useTheme } from './3181f000.js';
|
|
4
|
-
import { I as ImageCaption } from './
|
|
5
|
-
import {
|
|
4
|
+
import { I as ImageCaption } from './dbe0cf24.js';
|
|
5
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
6
|
+
import { T as Thumbnail } from './628468c4.js';
|
|
6
7
|
|
|
7
|
-
/**
|
|
8
|
-
* Image block variants.
|
|
9
|
-
*/
|
|
10
8
|
const ImageBlockCaptionPosition = {
|
|
11
9
|
below: 'below',
|
|
12
10
|
over: 'over'
|
|
@@ -66,43 +64,46 @@ const ImageBlock = forwardRef((props, ref) => {
|
|
|
66
64
|
titleProps,
|
|
67
65
|
...forwardedProps
|
|
68
66
|
} = props;
|
|
69
|
-
return /*#__PURE__*/
|
|
70
|
-
ref: ref
|
|
71
|
-
|
|
67
|
+
return /*#__PURE__*/jsxs("figure", {
|
|
68
|
+
ref: ref,
|
|
69
|
+
...forwardedProps,
|
|
72
70
|
className: classNames(className, handleBasicClasses({
|
|
73
71
|
prefix: CLASSNAME,
|
|
74
72
|
captionPosition,
|
|
75
73
|
align,
|
|
76
74
|
size,
|
|
77
75
|
theme
|
|
78
|
-
}), fillHeight && `${CLASSNAME}--fill-height`)
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
76
|
+
}), fillHeight && `${CLASSNAME}--fill-height`),
|
|
77
|
+
children: [/*#__PURE__*/jsx(Thumbnail, {
|
|
78
|
+
...thumbnailProps,
|
|
79
|
+
className: classNames(`${CLASSNAME}__image`, thumbnailProps?.className),
|
|
80
|
+
fillHeight: fillHeight,
|
|
81
|
+
align: align,
|
|
82
|
+
image: image,
|
|
83
|
+
size: size,
|
|
84
|
+
theme: theme,
|
|
85
|
+
alt: alt || title
|
|
86
|
+
}), /*#__PURE__*/jsx(ImageCaption, {
|
|
87
|
+
as: "figcaption",
|
|
88
|
+
baseClassName: CLASSNAME,
|
|
89
|
+
theme: theme,
|
|
90
|
+
title: title,
|
|
91
|
+
titleProps: titleProps,
|
|
92
|
+
description: description,
|
|
93
|
+
descriptionProps: descriptionProps,
|
|
94
|
+
tags: tags,
|
|
95
|
+
captionStyle: captionStyle,
|
|
96
|
+
align: align,
|
|
97
|
+
truncate: captionPosition === 'over'
|
|
98
|
+
}), actions && /*#__PURE__*/jsx("div", {
|
|
99
|
+
className: `${CLASSNAME}__actions`,
|
|
100
|
+
children: actions
|
|
101
|
+
})]
|
|
102
|
+
});
|
|
102
103
|
});
|
|
103
104
|
ImageBlock.displayName = COMPONENT_NAME;
|
|
104
105
|
ImageBlock.className = CLASSNAME;
|
|
105
106
|
ImageBlock.defaultProps = DEFAULT_PROPS;
|
|
106
107
|
|
|
107
108
|
export { ImageBlock, ImageBlockCaptionPosition };
|
|
108
|
-
//# sourceMappingURL=
|
|
109
|
+
//# sourceMappingURL=690ca33e.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"
|
|
1
|
+
{"version":3,"file":"690ca33e.js","sources":["../../src/components/image-block/ImageBlock.tsx"],"sourcesContent":["import { ReactNode } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Alignment, HorizontalAlignment, Size, Theme, Thumbnail } from '@lumx/react';\n\nimport { GenericProps, HasTheme, ValueOf } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { ThumbnailProps } from '../thumbnail/Thumbnail';\nimport { ImageCaption, ImageCaptionMetadata } from './ImageCaption';\n\n/**\n * Image block variants.\n */\nexport const ImageBlockCaptionPosition = {\n below: 'below',\n over: 'over',\n} as const;\nexport type ImageBlockCaptionPosition = ValueOf<typeof ImageBlockCaptionPosition>;\n\n/**\n * Image block sizes.\n */\nexport type ImageBlockSize = Extract<Size, 'xl' | 'xxl'>;\n\n/**\n * Defines the props of the component.\n */\nexport interface ImageBlockProps extends GenericProps, HasTheme, ImageCaptionMetadata {\n /** Action toolbar content. */\n actions?: ReactNode;\n /** Alignment. */\n align?: HorizontalAlignment;\n /** Image alternative text. */\n alt: string;\n /** Caption position. */\n captionPosition?: ImageBlockCaptionPosition;\n /** Whether the image has to fill its container height or not. */\n fillHeight?: boolean;\n /** Image URL. */\n image: string;\n /** Size variant. */\n size?: ImageBlockSize;\n /** Props to pass to the thumbnail (minus those already set by the ImageBlock props). */\n thumbnailProps?: Omit<ThumbnailProps, 'image' | 'size' | 'theme' | 'align' | 'fillHeight'>;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'ImageBlock';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<ImageBlockProps> = {\n captionPosition: ImageBlockCaptionPosition.below,\n align: Alignment.left,\n};\n\n/**\n * ImageBlock component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const ImageBlock = forwardRef<ImageBlockProps, HTMLDivElement>((props, ref) => {\n const defaultTheme = useTheme() || Theme.light;\n const {\n actions,\n align = DEFAULT_PROPS.align,\n alt,\n captionPosition = DEFAULT_PROPS.captionPosition,\n captionStyle,\n className,\n description,\n descriptionProps,\n fillHeight,\n image,\n size,\n tags,\n theme = defaultTheme,\n thumbnailProps,\n title,\n titleProps,\n ...forwardedProps\n } = props;\n return (\n <figure\n ref={ref}\n {...forwardedProps}\n className={classNames(\n className,\n handleBasicClasses({\n prefix: CLASSNAME,\n captionPosition,\n align,\n size,\n theme,\n }),\n fillHeight && `${CLASSNAME}--fill-height`,\n )}\n >\n <Thumbnail\n {...thumbnailProps}\n className={classNames(`${CLASSNAME}__image`, thumbnailProps?.className)}\n fillHeight={fillHeight}\n align={align}\n image={image}\n size={size}\n theme={theme}\n alt={(alt || title) as string}\n />\n <ImageCaption\n as=\"figcaption\"\n baseClassName={CLASSNAME}\n theme={theme}\n title={title}\n titleProps={titleProps}\n description={description}\n descriptionProps={descriptionProps}\n tags={tags}\n captionStyle={captionStyle}\n align={align}\n truncate={captionPosition === 'over'}\n />\n {actions && <div className={`${CLASSNAME}__actions`}>{actions}</div>}\n </figure>\n );\n});\nImageBlock.displayName = COMPONENT_NAME;\nImageBlock.className = CLASSNAME;\nImageBlock.defaultProps = DEFAULT_PROPS;\n"],"names":["ImageBlockCaptionPosition","below","over","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","captionPosition","align","Alignment","left","ImageBlock","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","actions","alt","captionStyle","className","description","descriptionProps","fillHeight","image","size","tags","theme","thumbnailProps","title","titleProps","forwardedProps","_jsxs","classNames","handleBasicClasses","prefix","children","_jsx","Thumbnail","ImageCaption","as","baseClassName","truncate","displayName","defaultProps"],"mappings":";;;;;;;AAiBO,MAAMA,yBAAyB,GAAG;AACrCC,EAAAA,KAAK,EAAE,OAAO;AACdC,EAAAA,IAAI,EAAE,MAAA;AACV,EAAU;;AAGV;AACA;AACA;;AAGA;AACA;AACA;;AAoBA;AACA;AACA;AACA,MAAMC,cAAc,GAAG,YAAY,CAAA;;AAEnC;AACA;AACA;AACA,MAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,CAAC,CAAA;;AAElD;AACA;AACA;AACA,MAAMG,aAAuC,GAAG;EAC5CC,eAAe,EAAEP,yBAAyB,CAACC,KAAK;EAChDO,KAAK,EAAEC,SAAS,CAACC,IAAAA;AACrB,CAAC,CAAA;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMC,UAAU,GAAGC,UAAU,CAAkC,CAACC,KAAK,EAAEC,GAAG,KAAK;EAClF,MAAMC,YAAY,GAAGC,QAAQ,EAAE,IAAIC,KAAK,CAACC,KAAK,CAAA;EAC9C,MAAM;IACFC,OAAO;IACPX,KAAK,GAAGF,aAAa,CAACE,KAAK;IAC3BY,GAAG;IACHb,eAAe,GAAGD,aAAa,CAACC,eAAe;IAC/Cc,YAAY;IACZC,SAAS;IACTC,WAAW;IACXC,gBAAgB;IAChBC,UAAU;IACVC,KAAK;IACLC,IAAI;IACJC,IAAI;AACJC,IAAAA,KAAK,GAAGd,YAAY;IACpBe,cAAc;IACdC,KAAK;IACLC,UAAU;IACV,GAAGC,cAAAA;AACP,GAAC,GAAGpB,KAAK,CAAA;AACT,EAAA,oBACIqB,IAAA,CAAA,QAAA,EAAA;AACIpB,IAAAA,GAAG,EAAEA,GAAI;AAAA,IAAA,GACLmB,cAAc;AAClBX,IAAAA,SAAS,EAAEa,UAAU,CACjBb,SAAS,EACTc,kBAAkB,CAAC;AACfC,MAAAA,MAAM,EAAEjC,SAAS;MACjBG,eAAe;MACfC,KAAK;MACLmB,IAAI;AACJE,MAAAA,KAAAA;AACJ,KAAC,CAAC,EACFJ,UAAU,IAAI,CAAGrB,EAAAA,SAAS,eAC9B,CAAE;IAAAkC,QAAA,EAAA,cAEFC,GAAA,CAACC,SAAS,EAAA;AAAA,MAAA,GACFV,cAAc;MAClBR,SAAS,EAAEa,UAAU,CAAC,CAAG/B,EAAAA,SAAS,SAAS,EAAE0B,cAAc,EAAER,SAAS,CAAE;AACxEG,MAAAA,UAAU,EAAEA,UAAW;AACvBjB,MAAAA,KAAK,EAAEA,KAAM;AACbkB,MAAAA,KAAK,EAAEA,KAAM;AACbC,MAAAA,IAAI,EAAEA,IAAK;AACXE,MAAAA,KAAK,EAAEA,KAAM;MACbT,GAAG,EAAGA,GAAG,IAAIW,KAAAA;AAAiB,KACjC,CAAC,eACFQ,GAAA,CAACE,YAAY,EAAA;AACTC,MAAAA,EAAE,EAAC,YAAY;AACfC,MAAAA,aAAa,EAAEvC,SAAU;AACzByB,MAAAA,KAAK,EAAEA,KAAM;AACbE,MAAAA,KAAK,EAAEA,KAAM;AACbC,MAAAA,UAAU,EAAEA,UAAW;AACvBT,MAAAA,WAAW,EAAEA,WAAY;AACzBC,MAAAA,gBAAgB,EAAEA,gBAAiB;AACnCI,MAAAA,IAAI,EAAEA,IAAK;AACXP,MAAAA,YAAY,EAAEA,YAAa;AAC3Bb,MAAAA,KAAK,EAAEA,KAAM;MACboC,QAAQ,EAAErC,eAAe,KAAK,MAAA;AAAO,KACxC,CAAC,EACDY,OAAO,iBAAIoB,GAAA,CAAA,KAAA,EAAA;MAAKjB,SAAS,EAAE,CAAGlB,EAAAA,SAAS,CAAY,SAAA,CAAA;AAAAkC,MAAAA,QAAA,EAAEnB,OAAAA;AAAO,KAAM,CAAC,CAAA;AAAA,GAChE,CAAC,CAAA;AAEjB,CAAC,EAAC;AACFR,UAAU,CAACkC,WAAW,GAAG1C,cAAc,CAAA;AACvCQ,UAAU,CAACW,SAAS,GAAGlB,SAAS,CAAA;AAChCO,UAAU,CAACmC,YAAY,GAAGxC,aAAa;;;;"}
|
|
@@ -0,0 +1,108 @@
|
|
|
1
|
+
import { m as getRootClassName, O as Orientation, n as forwardRef, b as Theme, l as classNames } from './6589b796.js';
|
|
2
|
+
import isObject from 'lodash/isObject';
|
|
3
|
+
import { h as handleBasicClasses } from './e2afb13f.js';
|
|
4
|
+
import { u as useTheme } from './3181f000.js';
|
|
5
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
6
|
+
import { ThumbnailVariant } from './76be70dd.js';
|
|
7
|
+
import { T as Thumbnail } from './628468c4.js';
|
|
8
|
+
|
|
9
|
+
/**
|
|
10
|
+
* Component display name.
|
|
11
|
+
*/
|
|
12
|
+
const COMPONENT_NAME = 'PostBlock';
|
|
13
|
+
|
|
14
|
+
/**
|
|
15
|
+
* Component default class name and class prefix.
|
|
16
|
+
*/
|
|
17
|
+
const CLASSNAME = getRootClassName(COMPONENT_NAME);
|
|
18
|
+
|
|
19
|
+
/**
|
|
20
|
+
* Component default props.
|
|
21
|
+
*/
|
|
22
|
+
const DEFAULT_PROPS = {
|
|
23
|
+
orientation: Orientation.horizontal
|
|
24
|
+
};
|
|
25
|
+
|
|
26
|
+
/**
|
|
27
|
+
* PostBlock component.
|
|
28
|
+
*
|
|
29
|
+
* @param props Component props.
|
|
30
|
+
* @param ref Component ref.
|
|
31
|
+
* @return React element.
|
|
32
|
+
*/
|
|
33
|
+
const PostBlock = forwardRef((props, ref) => {
|
|
34
|
+
const defaultTheme = useTheme() || Theme.light;
|
|
35
|
+
const {
|
|
36
|
+
actions,
|
|
37
|
+
attachments,
|
|
38
|
+
author,
|
|
39
|
+
className,
|
|
40
|
+
meta,
|
|
41
|
+
onClick,
|
|
42
|
+
orientation = DEFAULT_PROPS.orientation,
|
|
43
|
+
tags,
|
|
44
|
+
text,
|
|
45
|
+
theme = defaultTheme,
|
|
46
|
+
thumbnailProps,
|
|
47
|
+
title,
|
|
48
|
+
...forwardedProps
|
|
49
|
+
} = props;
|
|
50
|
+
return /*#__PURE__*/jsxs("div", {
|
|
51
|
+
ref: ref,
|
|
52
|
+
className: classNames(className, handleBasicClasses({
|
|
53
|
+
prefix: CLASSNAME,
|
|
54
|
+
orientation,
|
|
55
|
+
theme
|
|
56
|
+
})),
|
|
57
|
+
...forwardedProps,
|
|
58
|
+
children: [thumbnailProps && /*#__PURE__*/jsx("div", {
|
|
59
|
+
className: `${CLASSNAME}__thumbnail`,
|
|
60
|
+
children: /*#__PURE__*/jsx(Thumbnail, {
|
|
61
|
+
...thumbnailProps,
|
|
62
|
+
theme: theme,
|
|
63
|
+
variant: ThumbnailVariant.rounded
|
|
64
|
+
})
|
|
65
|
+
}), /*#__PURE__*/jsxs("div", {
|
|
66
|
+
className: `${CLASSNAME}__wrapper`,
|
|
67
|
+
children: [author && /*#__PURE__*/jsx("div", {
|
|
68
|
+
className: `${CLASSNAME}__author`,
|
|
69
|
+
children: author
|
|
70
|
+
}), title && /*#__PURE__*/jsx("button", {
|
|
71
|
+
type: "button",
|
|
72
|
+
className: `${CLASSNAME}__title`,
|
|
73
|
+
onClick: onClick,
|
|
74
|
+
children: title
|
|
75
|
+
}), meta && /*#__PURE__*/jsx("span", {
|
|
76
|
+
className: `${CLASSNAME}__meta`,
|
|
77
|
+
children: meta
|
|
78
|
+
}), isObject(text) && text.__html ?
|
|
79
|
+
/*#__PURE__*/
|
|
80
|
+
// eslint-disable-next-line react/no-danger
|
|
81
|
+
jsx("p", {
|
|
82
|
+
dangerouslySetInnerHTML: text,
|
|
83
|
+
className: `${CLASSNAME}__text`
|
|
84
|
+
}) : /*#__PURE__*/jsx("p", {
|
|
85
|
+
className: `${CLASSNAME}__text`,
|
|
86
|
+
children: text
|
|
87
|
+
}), attachments && /*#__PURE__*/jsx("div", {
|
|
88
|
+
className: `${CLASSNAME}__attachments`,
|
|
89
|
+
children: attachments
|
|
90
|
+
}), (tags || actions) && /*#__PURE__*/jsxs("div", {
|
|
91
|
+
className: `${CLASSNAME}__toolbar`,
|
|
92
|
+
children: [tags && /*#__PURE__*/jsx("div", {
|
|
93
|
+
className: `${CLASSNAME}__tags`,
|
|
94
|
+
children: tags
|
|
95
|
+
}), actions && /*#__PURE__*/jsx("div", {
|
|
96
|
+
className: `${CLASSNAME}__actions`,
|
|
97
|
+
children: actions
|
|
98
|
+
})]
|
|
99
|
+
})]
|
|
100
|
+
})]
|
|
101
|
+
});
|
|
102
|
+
});
|
|
103
|
+
PostBlock.displayName = COMPONENT_NAME;
|
|
104
|
+
PostBlock.className = CLASSNAME;
|
|
105
|
+
PostBlock.defaultProps = DEFAULT_PROPS;
|
|
106
|
+
|
|
107
|
+
export { PostBlock };
|
|
108
|
+
//# sourceMappingURL=6ca04271.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"
|
|
1
|
+
{"version":3,"file":"6ca04271.js","sources":["../../src/components/post-block/PostBlock.tsx"],"sourcesContent":["import { ReactNode } from 'react';\n\nimport classNames from 'classnames';\nimport isObject from 'lodash/isObject';\n\nimport { Orientation, Theme, Thumbnail, ThumbnailProps, ThumbnailVariant } from '@lumx/react';\nimport { GenericProps, HasTheme } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\n/**\n * Defines the props of the component.\n */\nexport interface PostBlockProps extends GenericProps, HasTheme {\n /** Action toolbar content. */\n actions?: ReactNode;\n /** Attachment content. */\n attachments?: ReactNode;\n /** Author content. */\n author?: ReactNode;\n /** Metadata content. */\n meta?: ReactNode;\n /** Orientation. */\n orientation?: Orientation;\n /** Tag content. */\n tags?: ReactNode;\n /** Content (string, or sanitized html). */\n text?: string | { __html: string };\n /** Thumbnail. */\n thumbnailProps?: ThumbnailProps;\n /** Title. */\n title: string;\n /** On click callback. */\n onClick?(): void;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'PostBlock';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<PostBlockProps> = {\n orientation: Orientation.horizontal,\n};\n\n/**\n * PostBlock component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const PostBlock = forwardRef<PostBlockProps, HTMLDivElement>((props, ref) => {\n const defaultTheme = useTheme() || Theme.light;\n const {\n actions,\n attachments,\n author,\n className,\n meta,\n onClick,\n orientation = DEFAULT_PROPS.orientation,\n tags,\n text,\n theme = defaultTheme,\n thumbnailProps,\n title,\n ...forwardedProps\n } = props;\n\n return (\n <div\n ref={ref}\n className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, orientation, theme }))}\n {...forwardedProps}\n >\n {thumbnailProps && (\n <div className={`${CLASSNAME}__thumbnail`}>\n <Thumbnail {...thumbnailProps} theme={theme} variant={ThumbnailVariant.rounded} />\n </div>\n )}\n <div className={`${CLASSNAME}__wrapper`}>\n {author && <div className={`${CLASSNAME}__author`}>{author}</div>}\n\n {title && (\n <button type=\"button\" className={`${CLASSNAME}__title`} onClick={onClick}>\n {title}\n </button>\n )}\n\n {meta && <span className={`${CLASSNAME}__meta`}>{meta}</span>}\n\n {isObject(text) && text.__html ? (\n // eslint-disable-next-line react/no-danger\n <p dangerouslySetInnerHTML={text} className={`${CLASSNAME}__text`} />\n ) : (\n <p className={`${CLASSNAME}__text`}>{text}</p>\n )}\n\n {attachments && <div className={`${CLASSNAME}__attachments`}>{attachments}</div>}\n {(tags || actions) && (\n <div className={`${CLASSNAME}__toolbar`}>\n {tags && <div className={`${CLASSNAME}__tags`}>{tags}</div>}\n {actions && <div className={`${CLASSNAME}__actions`}>{actions}</div>}\n </div>\n )}\n </div>\n </div>\n );\n});\nPostBlock.displayName = COMPONENT_NAME;\nPostBlock.className = CLASSNAME;\nPostBlock.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","orientation","Orientation","horizontal","PostBlock","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","actions","attachments","author","className","meta","onClick","tags","text","theme","thumbnailProps","title","forwardedProps","_jsxs","classNames","handleBasicClasses","prefix","children","_jsx","Thumbnail","variant","ThumbnailVariant","rounded","type","isObject","__html","dangerouslySetInnerHTML","displayName","defaultProps"],"mappings":"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"}
|
|
@@ -1,10 +1,7 @@
|
|
|
1
|
-
import { m as getRootClassName, n as forwardRef, b as Theme,
|
|
2
|
-
import { h as handleBasicClasses } from './
|
|
1
|
+
import { m as getRootClassName, n as forwardRef, b as Theme, l as classNames } from './6589b796.js';
|
|
2
|
+
import { h as handleBasicClasses } from './e2afb13f.js';
|
|
3
3
|
import { u as useTheme } from './3181f000.js';
|
|
4
|
-
|
|
5
|
-
/**
|
|
6
|
-
* Defines the props of the component.
|
|
7
|
-
*/
|
|
4
|
+
import { jsx } from 'react/jsx-runtime';
|
|
8
5
|
|
|
9
6
|
const DEFAULT_PROPS$2 = {};
|
|
10
7
|
|
|
@@ -34,24 +31,21 @@ const SkeletonCircle = forwardRef((props, ref) => {
|
|
|
34
31
|
theme = defaultTheme,
|
|
35
32
|
...forwardedProps
|
|
36
33
|
} = props;
|
|
37
|
-
return /*#__PURE__*/
|
|
38
|
-
ref: ref
|
|
39
|
-
|
|
34
|
+
return /*#__PURE__*/jsx("div", {
|
|
35
|
+
ref: ref,
|
|
36
|
+
...forwardedProps,
|
|
40
37
|
className: classNames(className, handleBasicClasses({
|
|
41
38
|
prefix: CLASSNAME$2,
|
|
42
39
|
size,
|
|
43
40
|
color,
|
|
44
41
|
theme
|
|
45
42
|
}))
|
|
46
|
-
})
|
|
43
|
+
});
|
|
47
44
|
});
|
|
48
45
|
SkeletonCircle.displayName = COMPONENT_NAME$2;
|
|
49
46
|
SkeletonCircle.defaultProps = DEFAULT_PROPS$2;
|
|
50
47
|
SkeletonCircle.className = CLASSNAME$2;
|
|
51
48
|
|
|
52
|
-
/**
|
|
53
|
-
* Skeleton variants.
|
|
54
|
-
*/
|
|
55
49
|
const SkeletonRectangleVariant = {
|
|
56
50
|
squared: 'squared',
|
|
57
51
|
rounded: 'rounded',
|
|
@@ -95,9 +89,9 @@ const SkeletonRectangle = forwardRef((props, ref) => {
|
|
|
95
89
|
color,
|
|
96
90
|
...forwardedProps
|
|
97
91
|
} = props;
|
|
98
|
-
return /*#__PURE__*/
|
|
99
|
-
ref: ref
|
|
100
|
-
|
|
92
|
+
return /*#__PURE__*/jsx("div", {
|
|
93
|
+
ref: ref,
|
|
94
|
+
...forwardedProps,
|
|
101
95
|
className: classNames(className, handleBasicClasses({
|
|
102
96
|
prefix: CLASSNAME$1,
|
|
103
97
|
aspectRatio,
|
|
@@ -106,19 +100,16 @@ const SkeletonRectangle = forwardRef((props, ref) => {
|
|
|
106
100
|
variant,
|
|
107
101
|
width,
|
|
108
102
|
color
|
|
109
|
-
}))
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
103
|
+
})),
|
|
104
|
+
children: /*#__PURE__*/jsx("div", {
|
|
105
|
+
className: `${CLASSNAME$1}__inner`
|
|
106
|
+
})
|
|
107
|
+
});
|
|
113
108
|
});
|
|
114
109
|
SkeletonRectangle.displayName = COMPONENT_NAME$1;
|
|
115
110
|
SkeletonRectangle.className = CLASSNAME$1;
|
|
116
111
|
SkeletonRectangle.defaultProps = DEFAULT_PROPS$1;
|
|
117
112
|
|
|
118
|
-
/**
|
|
119
|
-
* Defines the props of the component.
|
|
120
|
-
*/
|
|
121
|
-
|
|
122
113
|
const DEFAULT_PROPS = {};
|
|
123
114
|
|
|
124
115
|
/**
|
|
@@ -148,9 +139,9 @@ const SkeletonTypography = forwardRef((props, ref) => {
|
|
|
148
139
|
color,
|
|
149
140
|
...forwardedProps
|
|
150
141
|
} = props;
|
|
151
|
-
return /*#__PURE__*/
|
|
152
|
-
ref: ref
|
|
153
|
-
|
|
142
|
+
return /*#__PURE__*/jsx("div", {
|
|
143
|
+
ref: ref,
|
|
144
|
+
...forwardedProps,
|
|
154
145
|
className: classNames(className, handleBasicClasses({
|
|
155
146
|
prefix: CLASSNAME,
|
|
156
147
|
theme,
|
|
@@ -160,14 +151,15 @@ const SkeletonTypography = forwardRef((props, ref) => {
|
|
|
160
151
|
style: {
|
|
161
152
|
...forwardedProps.style,
|
|
162
153
|
width
|
|
163
|
-
}
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
154
|
+
},
|
|
155
|
+
children: /*#__PURE__*/jsx("div", {
|
|
156
|
+
className: `${CLASSNAME}__inner`
|
|
157
|
+
})
|
|
158
|
+
});
|
|
167
159
|
});
|
|
168
160
|
SkeletonTypography.displayName = COMPONENT_NAME;
|
|
169
161
|
SkeletonTypography.defaultProps = DEFAULT_PROPS;
|
|
170
162
|
SkeletonTypography.className = CLASSNAME;
|
|
171
163
|
|
|
172
164
|
export { SkeletonCircle, SkeletonRectangle, SkeletonRectangleVariant, SkeletonTypography };
|
|
173
|
-
//# sourceMappingURL=
|
|
165
|
+
//# sourceMappingURL=6da19518.js.map
|