@wordpress/components 25.5.0 → 25.6.1

package/build/panel/bottom-separator-cover.native.js

@@ -1,20 +1,14 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _element = require("@wordpress/element");
-
 var _reactNative = require("react-native");
-
 var _compose = require("@wordpress/compose");
-
 var _bottomSeparatorCover = _interopRequireDefault(require("./bottom-separator-cover.scss"));
-
 /**
  * External dependencies
  */
@@ -26,6 +20,7 @@ var _bottomSeparatorCover = _interopRequireDefault(require("./bottom-separator-c
 /**
  * Internal dependencies
  */
+
 function BottomSeparatorCover({
   getStylesFromColorScheme
 }) {
@@ -33,8 +28,6 @@ function BottomSeparatorCover({
     style: getStylesFromColorScheme(_bottomSeparatorCover.default.coverSeparator, _bottomSeparatorCover.default.coverSeparatorDark)
   });
 }
-
 var _default = (0, _compose.withPreferredColorScheme)(BottomSeparatorCover);
-
 exports.default = _default;
 //# sourceMappingURL=bottom-separator-cover.native.js.map

package/build/panel/bottom-separator-cover.native.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/panel/bottom-separator-cover.native.js"],"names":["BottomSeparatorCover","getStylesFromColorScheme","styles","coverSeparator","coverSeparatorDark"],"mappings":";;;;;;;;;;;AAGA;;AAKA;;AAKA;;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAGA,SAASA,oBAAT,CAA+B;AAAEC,EAAAA;AAAF,CAA/B,EAA8D;AAC7D,SACC,4BAAC,iBAAD;AACC,IAAA,KAAK,EAAGA,wBAAwB,CAC/BC,8BAAOC,cADwB,EAE/BD,8BAAOE,kBAFwB;AADjC,IADD;AAQA;;eAEc,uCAA0BJ,oBAA1B,C","sourcesContent":["/**\n * External dependencies\n */\nimport { View } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { withPreferredColorScheme } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport styles from './bottom-separator-cover.scss';\n\nfunction BottomSeparatorCover( { getStylesFromColorScheme } ) {\n\treturn (\n\t\t<View\n\t\t\tstyle={ getStylesFromColorScheme(\n\t\t\t\tstyles.coverSeparator,\n\t\t\t\tstyles.coverSeparatorDark\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nexport default withPreferredColorScheme( BottomSeparatorCover );\n"]}
+{"version":3,"names":["_reactNative","require","_compose","_bottomSeparatorCover","_interopRequireDefault","BottomSeparatorCover","getStylesFromColorScheme","_element","createElement","View","style","styles","coverSeparator","coverSeparatorDark","_default","withPreferredColorScheme","exports","default"],"sources":["@wordpress/components/src/panel/bottom-separator-cover.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { View } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { withPreferredColorScheme } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport styles from './bottom-separator-cover.scss';\n\nfunction BottomSeparatorCover( { getStylesFromColorScheme } ) {\n\treturn (\n\t\t<View\n\t\t\tstyle={ getStylesFromColorScheme(\n\t\t\t\tstyles.coverSeparator,\n\t\t\t\tstyles.coverSeparatorDark\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nexport default withPreferredColorScheme( BottomSeparatorCover );\n"],"mappings":";;;;;;;;AAGA,IAAAA,YAAA,GAAAC,OAAA;AAKA,IAAAC,QAAA,GAAAD,OAAA;AAKA,IAAAE,qBAAA,GAAAC,sBAAA,CAAAH,OAAA;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAGA,SAASI,oBAAoBA,CAAE;EAAEC;AAAyB,CAAC,EAAG;EAC7D,OACC,IAAAC,QAAA,CAAAC,aAAA,EAACR,YAAA,CAAAS,IAAI;IACJC,KAAK,EAAGJ,wBAAwB,CAC/BK,6BAAM,CAACC,cAAc,EACrBD,6BAAM,CAACE,kBACR;EAAG,CACH,CAAC;AAEJ;AAAC,IAAAC,QAAA,GAEc,IAAAC,iCAAwB,EAAEV,oBAAqB,CAAC;AAAAW,OAAA,CAAAC,OAAA,GAAAH,QAAA"}

package/build/panel/header.js

@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _element = require("@wordpress/element");
-
 /**
  * Internal dependencies
  */
@@ -24,7 +22,6 @@ function PanelHeader({
     className: "components-panel__header"
   }, label && (0, _element.createElement)("h2", null, label), children);
 }
-
 var _default = PanelHeader;
 exports.default = _default;
 //# sourceMappingURL=header.js.map

package/build/panel/header.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/panel/header.tsx"],"names":["PanelHeader","label","children"],"mappings":";;;;;;;;;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA,SAASA,WAAT,CAAsB;AAAEC,EAAAA,KAAF;AAASC,EAAAA;AAAT,CAAtB,EAA8D;AAC7D,SACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACGD,KAAK,IAAI,wCAAMA,KAAN,CADZ,EAEGC,QAFH,CADD;AAMA;;eAEcF,W","sourcesContent":["/**\n * Internal dependencies\n */\nimport type { PanelHeaderProps } from './types';\n\n/**\n * `PanelHeader` renders the header for the `Panel`.\n * This is used by the `Panel` component under the hood,\n * so it does not typically need to be used.\n */\nfunction PanelHeader( { label, children }: PanelHeaderProps ) {\n\treturn (\n\t\t<div className=\"components-panel__header\">\n\t\t\t{ label && <h2>{ label }</h2> }\n\t\t\t{ children }\n\t\t</div>\n\t);\n}\n\nexport default PanelHeader;\n"]}
+{"version":3,"names":["PanelHeader","label","children","_element","createElement","className","_default","exports","default"],"sources":["@wordpress/components/src/panel/header.tsx"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport type { PanelHeaderProps } from './types';\n\n/**\n * `PanelHeader` renders the header for the `Panel`.\n * This is used by the `Panel` component under the hood,\n * so it does not typically need to be used.\n */\nfunction PanelHeader( { label, children }: PanelHeaderProps ) {\n\treturn (\n\t\t<div className=\"components-panel__header\">\n\t\t\t{ label && <h2>{ label }</h2> }\n\t\t\t{ children }\n\t\t</div>\n\t);\n}\n\nexport default PanelHeader;\n"],"mappings":";;;;;;;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA,SAASA,WAAWA,CAAE;EAAEC,KAAK;EAAEC;AAA2B,CAAC,EAAG;EAC7D,OACC,IAAAC,QAAA,CAAAC,aAAA;IAAKC,SAAS,EAAC;EAA0B,GACtCJ,KAAK,IAAI,IAAAE,QAAA,CAAAC,aAAA,cAAMH,KAAW,CAAC,EAC3BC,QACE,CAAC;AAER;AAAC,IAAAI,QAAA,GAEcN,WAAW;AAAAO,OAAA,CAAAC,OAAA,GAAAF,QAAA"}

package/build/panel/index.js

@@ -1,18 +1,13 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.Panel = void 0;
-
 var _element = require("@wordpress/element");
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _header = _interopRequireDefault(require("./header"));
-
 /**
  * External dependencies
  */
@@ -24,6 +19,7 @@ var _header = _interopRequireDefault(require("./header"));
 /**
  * Internal dependencies
  */
+
 function UnforwardedPanel({
   header,
   className,
@@ -37,6 +33,7 @@ function UnforwardedPanel({
     label: header
   }), children);
 }
+
 /**
  * `Panel` expands and collapses multiple sections of content.
  *
@@ -53,8 +50,6 @@ function UnforwardedPanel({
  * );
  * ```
  */
-
-
 const Panel = (0, _element.forwardRef)(UnforwardedPanel);
 exports.Panel = Panel;
 var _default = Panel;

package/build/panel/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/panel/index.tsx"],"names":["UnforwardedPanel","header","className","children","ref","classNames","Panel"],"mappings":";;;;;;;;;AAQA;;AALA;;AAUA;;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAIA,SAASA,gBAAT,CACC;AAAEC,EAAAA,MAAF;AAAUC,EAAAA,SAAV;AAAqBC,EAAAA;AAArB,CADD,EAECC,GAFD,EAGE;AACD,QAAMC,UAAU,GAAG,yBAAYH,SAAZ,EAAuB,kBAAvB,CAAnB;AACA,SACC;AAAK,IAAA,SAAS,EAAGG,UAAjB;AAA8B,IAAA,GAAG,EAAGD;AAApC,KACGH,MAAM,IAAI,4BAAC,eAAD;AAAa,IAAA,KAAK,EAAGA;AAArB,IADb,EAEGE,QAFH,CADD;AAMA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAMG,KAAK,GAAG,yBAAYN,gBAAZ,CAAd;;eAEQM,K","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport PanelHeader from './header';\nimport type { PanelProps } from './types';\n\nfunction UnforwardedPanel(\n\t{ header, className, children }: PanelProps,\n\tref: React.ForwardedRef< HTMLDivElement >\n) {\n\tconst classNames = classnames( className, 'components-panel' );\n\treturn (\n\t\t<div className={ classNames } ref={ ref }>\n\t\t\t{ header && <PanelHeader label={ header } /> }\n\t\t\t{ children }\n\t\t</div>\n\t);\n}\n\n/**\n * `Panel` expands and collapses multiple sections of content.\n *\n * ```jsx\n * import { Panel, PanelBody, PanelRow } from '@wordpress/components';\n * import { more } from '@wordpress/icons';\n *\n * const MyPanel = () => (\n * \t<Panel header=\"My Panel\">\n * \t\t<PanelBody title=\"My Block Settings\" icon={ more } initialOpen={ true }>\n * \t\t\t<PanelRow>My Panel Inputs and Labels</PanelRow>\n * \t\t</PanelBody>\n * \t</Panel>\n * );\n * ```\n */\nexport const Panel = forwardRef( UnforwardedPanel );\n\nexport default Panel;\n"]}
+{"version":3,"names":["_element","require","_classnames","_interopRequireDefault","_header","UnforwardedPanel","header","className","children","ref","classNames","classnames","createElement","default","label","Panel","forwardRef","exports","_default"],"sources":["@wordpress/components/src/panel/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport PanelHeader from './header';\nimport type { PanelProps } from './types';\n\nfunction UnforwardedPanel(\n\t{ header, className, children }: PanelProps,\n\tref: React.ForwardedRef< HTMLDivElement >\n) {\n\tconst classNames = classnames( className, 'components-panel' );\n\treturn (\n\t\t<div className={ classNames } ref={ ref }>\n\t\t\t{ header && <PanelHeader label={ header } /> }\n\t\t\t{ children }\n\t\t</div>\n\t);\n}\n\n/**\n * `Panel` expands and collapses multiple sections of content.\n *\n * ```jsx\n * import { Panel, PanelBody, PanelRow } from '@wordpress/components';\n * import { more } from '@wordpress/icons';\n *\n * const MyPanel = () => (\n * \t<Panel header=\"My Panel\">\n * \t\t<PanelBody title=\"My Block Settings\" icon={ more } initialOpen={ true }>\n * \t\t\t<PanelRow>My Panel Inputs and Labels</PanelRow>\n * \t\t</PanelBody>\n * \t</Panel>\n * );\n * ```\n */\nexport const Panel = forwardRef( UnforwardedPanel );\n\nexport default Panel;\n"],"mappings":";;;;;;;AAQA,IAAAA,QAAA,GAAAC,OAAA;AALA,IAAAC,WAAA,GAAAC,sBAAA,CAAAF,OAAA;AAUA,IAAAG,OAAA,GAAAD,sBAAA,CAAAF,OAAA;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAIA,SAASI,gBAAgBA,CACxB;EAAEC,MAAM;EAAEC,SAAS;EAAEC;AAAqB,CAAC,EAC3CC,GAAyC,EACxC;EACD,MAAMC,UAAU,GAAG,IAAAC,mBAAU,EAAEJ,SAAS,EAAE,kBAAmB,CAAC;EAC9D,OACC,IAAAP,QAAA,CAAAY,aAAA;IAAKL,SAAS,EAAGG,UAAY;IAACD,GAAG,EAAGA;EAAK,GACtCH,MAAM,IAAI,IAAAN,QAAA,CAAAY,aAAA,EAACR,OAAA,CAAAS,OAAW;IAACC,KAAK,EAAGR;EAAQ,CAAE,CAAC,EAC1CE,QACE,CAAC;AAER;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMO,KAAK,GAAG,IAAAC,mBAAU,EAAEX,gBAAiB,CAAC;AAACY,OAAA,CAAAF,KAAA,GAAAA,KAAA;AAAA,IAAAG,QAAA,GAErCH,KAAK;AAAAE,OAAA,CAAAJ,OAAA,GAAAK,QAAA"}

package/build/panel/row.js

@@ -1,16 +1,12 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.PanelRow = void 0;
-
 var _element = require("@wordpress/element");
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 /**
  * External dependencies
  */
@@ -18,6 +14,7 @@ var _classnames = _interopRequireDefault(require("classnames"));
 /**
  * WordPress dependencies
  */
+
 function UnforwardedPanelRow({
   className,
   children
@@ -27,12 +24,11 @@ function UnforwardedPanelRow({
     ref: ref
   }, children);
 }
+
 /**
  * `PanelRow` is a generic container for rows within a `PanelBody`.
  * It is a flex container with a top margin for spacing.
  */
-
-
 const PanelRow = (0, _element.forwardRef)(UnforwardedPanelRow);
 exports.PanelRow = PanelRow;
 var _default = PanelRow;

package/build/panel/row.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/panel/row.tsx"],"names":["UnforwardedPanelRow","className","children","ref","PanelRow"],"mappings":";;;;;;;;;AAQA;;AALA;;AAHA;AACA;AACA;;AAGA;AACA;AACA;AASA,SAASA,mBAAT,CACC;AAAEC,EAAAA,SAAF;AAAaC,EAAAA;AAAb,CADD,EAECC,GAFD,EAGE;AACD,SACC;AACC,IAAA,SAAS,EAAG,yBAAY,uBAAZ,EAAqCF,SAArC,CADb;AAEC,IAAA,GAAG,EAAGE;AAFP,KAIGD,QAJH,CADD;AAQA;AAED;AACA;AACA;AACA;;;AACO,MAAME,QAAQ,GAAG,yBAAYJ,mBAAZ,CAAjB;;eAEQI,Q","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport type { ForwardedRef } from 'react';\n\n/**\n * Internal dependencies\n */\nimport type { PanelRowProps } from './types';\n\nfunction UnforwardedPanelRow(\n\t{ className, children }: PanelRowProps,\n\tref: ForwardedRef< HTMLDivElement >\n) {\n\treturn (\n\t\t<div\n\t\t\tclassName={ classnames( 'components-panel__row', className ) }\n\t\t\tref={ ref }\n\t\t>\n\t\t\t{ children }\n\t\t</div>\n\t);\n}\n\n/**\n * `PanelRow` is a generic container for rows within a `PanelBody`.\n * It is a flex container with a top margin for spacing.\n */\nexport const PanelRow = forwardRef( UnforwardedPanelRow );\n\nexport default PanelRow;\n"]}
+{"version":3,"names":["_element","require","_classnames","_interopRequireDefault","UnforwardedPanelRow","className","children","ref","createElement","classnames","PanelRow","forwardRef","exports","_default","default"],"sources":["@wordpress/components/src/panel/row.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport type { ForwardedRef } from 'react';\n\n/**\n * Internal dependencies\n */\nimport type { PanelRowProps } from './types';\n\nfunction UnforwardedPanelRow(\n\t{ className, children }: PanelRowProps,\n\tref: ForwardedRef< HTMLDivElement >\n) {\n\treturn (\n\t\t<div\n\t\t\tclassName={ classnames( 'components-panel__row', className ) }\n\t\t\tref={ ref }\n\t\t>\n\t\t\t{ children }\n\t\t</div>\n\t);\n}\n\n/**\n * `PanelRow` is a generic container for rows within a `PanelBody`.\n * It is a flex container with a top margin for spacing.\n */\nexport const PanelRow = forwardRef( UnforwardedPanelRow );\n\nexport default PanelRow;\n"],"mappings":";;;;;;;AAQA,IAAAA,QAAA,GAAAC,OAAA;AALA,IAAAC,WAAA,GAAAC,sBAAA,CAAAF,OAAA;AAHA;AACA;AACA;;AAGA;AACA;AACA;;AASA,SAASG,mBAAmBA,CAC3B;EAAEC,SAAS;EAAEC;AAAwB,CAAC,EACtCC,GAAmC,EAClC;EACD,OACC,IAAAP,QAAA,CAAAQ,aAAA;IACCH,SAAS,EAAG,IAAAI,mBAAU,EAAE,uBAAuB,EAAEJ,SAAU,CAAG;IAC9DE,GAAG,EAAGA;EAAK,GAETD,QACE,CAAC;AAER;;AAEA;AACA;AACA;AACA;AACO,MAAMI,QAAQ,GAAG,IAAAC,mBAAU,EAAEP,mBAAoB,CAAC;AAACQ,OAAA,CAAAF,QAAA,GAAAA,QAAA;AAAA,IAAAG,QAAA,GAE3CH,QAAQ;AAAAE,OAAA,CAAAE,OAAA,GAAAD,QAAA"}

package/build/panel/types.js.map

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}
+{"version":3,"names":[],"sources":["@wordpress/components/src/panel/types.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport type { ButtonAsButtonProps } from '../button/types';\nimport type { WordPressComponentProps } from '../ui/context';\n\nexport type PanelProps = {\n\t/**\n\t * The text that will be rendered as the title of the panel.\n\t * Text will be rendered inside an `<h2>` tag.\n\t */\n\theader?: PanelHeaderProps[ 'label' ];\n\t/**\n\t * The CSS class to apply to the wrapper element.\n\t */\n\tclassName?: string;\n\t/**\n\t * The content to display within the panel.\n\t */\n\tchildren: React.ReactNode;\n};\n\nexport type PanelHeaderProps = {\n\t/**\n\t * The text that will be rendered as the title of the panel.\n\t * Will be rendered in an `<h2>` tag.\n\t */\n\tlabel?: string;\n\t/**\n\t * The content to display within the panel header.\n\t */\n\tchildren?: React.ReactNode;\n};\n\nexport type PanelRowProps = {\n\t/**\n\t * The CSS class to apply to the wrapper element.\n\t */\n\tclassName?: string;\n\t/**\n\t * The content to display within the panel row.\n\t */\n\tchildren: React.ReactNode;\n};\n\nexport type PanelBodyProps = {\n\t/**\n\t * Props that are passed to the `Button` component in title within the\n\t * `PanelBody`.\n\t *\n\t * @default {}\n\t */\n\tbuttonProps?: WordPressComponentProps<\n\t\tOmit< ButtonAsButtonProps, 'icon' >,\n\t\t'button',\n\t\tfalse\n\t>;\n\t/**\n\t * The content to display in the `PanelBody`.If a function is provided for\n\t * this prop, it will receive an object with the `opened` prop as an argument.\n\t */\n\tchildren?:\n\t\t| React.ReactNode\n\t\t| ( ( props: { opened: boolean } ) => React.ReactNode );\n\n\t/**\n\t * The CSS class to apply to the wrapper element.\n\t */\n\tclassName?: string;\n\t/**\n\t * An icon to be shown next to the title.\n\t */\n\ticon?: JSX.Element;\n\t/**\n\t * Whether or not the panel will start open.\n\t */\n\tinitialOpen?: boolean;\n\t/**\n\t * A function that is called any time the component is toggled from its closed\n\t * state to its opened state, or vice versa.\n\t *\n\t * @default noop\n\t */\n\tonToggle?: ( next: boolean ) => void;\n\t/**\n\t * When set to `true`, the component will remain open regardless of the\n\t * `initialOpen` prop and the panel will be prevented from being closed.\n\t */\n\topened?: boolean;\n\t/**\n\t * Title text. It shows even when it is closed.\n\t */\n\ttitle?: string;\n\t/**\n\t * Scrolls the content into view when visible. This improves the UX when\n\t * multiple `PanelBody` components are stacked in a scrollable container.\n\t *\n\t * @default true\n\t */\n\tscrollAfterOpen?: boolean;\n};\n\nexport type PanelBodyTitleProps = Omit< ButtonAsButtonProps, 'icon' > & {\n\t/**\n\t * An icon to be shown next to the title.\n\t */\n\ticon?: JSX.Element;\n\t/**\n\t * Whether or not the `PanelBody` is currently opened or not.\n\t */\n\tisOpened?: boolean;\n\t/**\n\t * The title text.\n\t */\n\ttitle?: string;\n};\n"],"mappings":""}

package/build/placeholder/index.js

@@ -1,23 +1,16 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Placeholder = Placeholder;
 exports.default = void 0;
-
 var _element = require("@wordpress/element");
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _compose = require("@wordpress/compose");
-
 var _primitives = require("@wordpress/primitives");
-
 var _icon = _interopRequireDefault(require("../icon"));
-
 /**
  * External dependencies
  */
@@ -29,6 +22,7 @@ var _icon = _interopRequireDefault(require("../icon"));
 /**
  * Internal dependencies
  */
+
 const PlaceholderIllustration = (0, _element.createElement)(_primitives.SVG, {
   className: "components-placeholder__illustration",
   fill: "none",
@@ -39,6 +33,7 @@ const PlaceholderIllustration = (0, _element.createElement)(_primitives.SVG, {
   vectorEffect: "non-scaling-stroke",
   d: "M60 60 0 0"
 }));
+
 /**
  * Renders a placeholder. Normally used by blocks to render their empty state.
  *
@@ -49,7 +44,6 @@ const PlaceholderIllustration = (0, _element.createElement)(_primitives.SVG, {
  * const MyPlaceholder = () => <Placeholder icon={ more } label="Placeholder" />;
  * ```
  */
-
 function Placeholder(props) {
   const {
     icon,
@@ -65,11 +59,11 @@ function Placeholder(props) {
   } = props;
   const [resizeListener, {
     width
-  }] = (0, _compose.useResizeObserver)(); // Since `useResizeObserver` will report a width of `null` until after the
-  // first render, avoid applying any modifier classes until width is known.
+  }] = (0, _compose.useResizeObserver)();
 
+  // Since `useResizeObserver` will report a width of `null` until after the
+  // first render, avoid applying any modifier classes until width is known.
   let modifierClassNames;
-
   if (typeof width === 'number') {
     modifierClassNames = {
       'is-large': width >= 480,
@@ -77,12 +71,12 @@ function Placeholder(props) {
       'is-small': width < 160
     };
   }
-
   const classes = (0, _classnames.default)('components-placeholder', className, modifierClassNames, withIllustration ? 'has-illustration' : null);
   const fieldsetClasses = (0, _classnames.default)('components-placeholder__fieldset', {
     'is-column-layout': isColumnLayout
   });
-  return (0, _element.createElement)("div", { ...additionalProps,
+  return (0, _element.createElement)("div", {
+    ...additionalProps,
     className: classes
   }, withIllustration ? PlaceholderIllustration : null, resizeListener, notices, preview && (0, _element.createElement)("div", {
     className: "components-placeholder__preview"
@@ -96,7 +90,6 @@ function Placeholder(props) {
     className: "components-placeholder__instructions"
   }, instructions), children));
 }
-
 var _default = Placeholder;
 exports.default = _default;
 //# sourceMappingURL=index.js.map

package/build/placeholder/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/placeholder/index.tsx"],"names":["PlaceholderIllustration","Placeholder","props","icon","children","label","instructions","className","notices","preview","isColumnLayout","withIllustration","additionalProps","resizeListener","width","modifierClassNames","classes","fieldsetClasses"],"mappings":";;;;;;;;;;;;AAGA;;AAKA;;AACA;;AAKA;;AAdA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;AAKA,MAAMA,uBAAuB,GAC5B,4BAAC,eAAD;AACC,EAAA,SAAS,EAAC,sCADX;AAEC,EAAA,IAAI,EAAC,MAFN;AAGC,EAAA,KAAK,EAAC,4BAHP;AAIC,EAAA,OAAO,EAAC,WAJT;AAKC,EAAA,mBAAmB,EAAC;AALrB,GAOC,4BAAC,gBAAD;AAAM,EAAA,YAAY,EAAC,oBAAnB;AAAwC,EAAA,CAAC,EAAC;AAA1C,EAPD,CADD;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACO,SAASC,WAAT,CACNC,KADM,EAEL;AACD,QAAM;AACLC,IAAAA,IADK;AAELC,IAAAA,QAFK;AAGLC,IAAAA,KAHK;AAILC,IAAAA,YAJK;AAKLC,IAAAA,SALK;AAMLC,IAAAA,OANK;AAOLC,IAAAA,OAPK;AAQLC,IAAAA,cARK;AASLC,IAAAA,gBATK;AAUL,OAAGC;AAVE,MAWFV,KAXJ;AAYA,QAAM,CAAEW,cAAF,EAAkB;AAAEC,IAAAA;AAAF,GAAlB,IAAgC,iCAAtC,CAbC,CAeD;AACA;;AACA,MAAIC,kBAAJ;;AACA,MAAK,OAAOD,KAAP,KAAiB,QAAtB,EAAiC;AAChCC,IAAAA,kBAAkB,GAAG;AACpB,kBAAYD,KAAK,IAAI,GADD;AAEpB,mBAAaA,KAAK,IAAI,GAAT,IAAgBA,KAAK,GAAG,GAFjB;AAGpB,kBAAYA,KAAK,GAAG;AAHA,KAArB;AAKA;;AAED,QAAME,OAAO,GAAG,yBACf,wBADe,EAEfT,SAFe,EAGfQ,kBAHe,EAIfJ,gBAAgB,GAAG,kBAAH,GAAwB,IAJzB,CAAhB;AAMA,QAAMM,eAAe,GAAG,yBAAY,kCAAZ,EAAgD;AACvE,wBAAoBP;AADmD,GAAhD,CAAxB;AAGA,SACC,wCAAUE,eAAV;AAA4B,IAAA,SAAS,EAAGI;AAAxC,KACGL,gBAAgB,GAAGX,uBAAH,GAA6B,IADhD,EAEGa,cAFH,EAGGL,OAHH,EAIGC,OAAO,IACR;AAAK,IAAA,SAAS,EAAC;AAAf,KACGA,OADH,CALF,EASC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC,4BAAC,aAAD;AAAM,IAAA,IAAI,EAAGN;AAAb,IADD,EAEGE,KAFH,CATD,EAaC;AAAU,IAAA,SAAS,EAAGY;AAAtB,KACG,CAAC,CAAEX,YAAH,IACD;AAAQ,IAAA,SAAS,EAAC;AAAlB,KACGA,YADH,CAFF,EAMGF,QANH,CAbD,CADD;AAwBA;;eAEcH,W","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useResizeObserver } from '@wordpress/compose';\nimport { SVG, Path } from '@wordpress/primitives';\n\n/**\n * Internal dependencies\n */\nimport Icon from '../icon';\nimport type { PlaceholderProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\n\nconst PlaceholderIllustration = (\n\t<SVG\n\t\tclassName=\"components-placeholder__illustration\"\n\t\tfill=\"none\"\n\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\tviewBox=\"0 0 60 60\"\n\t\tpreserveAspectRatio=\"none\"\n\t>\n\t\t<Path vectorEffect=\"non-scaling-stroke\" d=\"M60 60 0 0\" />\n\t</SVG>\n);\n\n/**\n * Renders a placeholder. Normally used by blocks to render their empty state.\n *\n * ```jsx\n * import { Placeholder } from '@wordpress/components';\n * import { more } from '@wordpress/icons';\n *\n * const MyPlaceholder = () => <Placeholder icon={ more } label=\"Placeholder\" />;\n * ```\n */\nexport function Placeholder(\n\tprops: WordPressComponentProps< PlaceholderProps, 'div', false >\n) {\n\tconst {\n\t\ticon,\n\t\tchildren,\n\t\tlabel,\n\t\tinstructions,\n\t\tclassName,\n\t\tnotices,\n\t\tpreview,\n\t\tisColumnLayout,\n\t\twithIllustration,\n\t\t...additionalProps\n\t} = props;\n\tconst [ resizeListener, { width } ] = useResizeObserver();\n\n\t// Since `useResizeObserver` will report a width of `null` until after the\n\t// first render, avoid applying any modifier classes until width is known.\n\tlet modifierClassNames;\n\tif ( typeof width === 'number' ) {\n\t\tmodifierClassNames = {\n\t\t\t'is-large': width >= 480,\n\t\t\t'is-medium': width >= 160 && width < 480,\n\t\t\t'is-small': width < 160,\n\t\t};\n\t}\n\n\tconst classes = classnames(\n\t\t'components-placeholder',\n\t\tclassName,\n\t\tmodifierClassNames,\n\t\twithIllustration ? 'has-illustration' : null\n\t);\n\tconst fieldsetClasses = classnames( 'components-placeholder__fieldset', {\n\t\t'is-column-layout': isColumnLayout,\n\t} );\n\treturn (\n\t\t<div { ...additionalProps } className={ classes }>\n\t\t\t{ withIllustration ? PlaceholderIllustration : null }\n\t\t\t{ resizeListener }\n\t\t\t{ notices }\n\t\t\t{ preview && (\n\t\t\t\t<div className=\"components-placeholder__preview\">\n\t\t\t\t\t{ preview }\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t<div className=\"components-placeholder__label\">\n\t\t\t\t<Icon icon={ icon } />\n\t\t\t\t{ label }\n\t\t\t</div>\n\t\t\t<fieldset className={ fieldsetClasses }>\n\t\t\t\t{ !! instructions && (\n\t\t\t\t\t<legend className=\"components-placeholder__instructions\">\n\t\t\t\t\t\t{ instructions }\n\t\t\t\t\t</legend>\n\t\t\t\t) }\n\t\t\t\t{ children }\n\t\t\t</fieldset>\n\t\t</div>\n\t);\n}\n\nexport default Placeholder;\n"]}
+{"version":3,"names":["_classnames","_interopRequireDefault","require","_compose","_primitives","_icon","PlaceholderIllustration","_element","createElement","SVG","className","fill","xmlns","viewBox","preserveAspectRatio","Path","vectorEffect","d","Placeholder","props","icon","children","label","instructions","notices","preview","isColumnLayout","withIllustration","additionalProps","resizeListener","width","useResizeObserver","modifierClassNames","classes","classnames","fieldsetClasses","default","_default","exports"],"sources":["@wordpress/components/src/placeholder/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useResizeObserver } from '@wordpress/compose';\nimport { SVG, Path } from '@wordpress/primitives';\n\n/**\n * Internal dependencies\n */\nimport Icon from '../icon';\nimport type { PlaceholderProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\n\nconst PlaceholderIllustration = (\n\t<SVG\n\t\tclassName=\"components-placeholder__illustration\"\n\t\tfill=\"none\"\n\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\tviewBox=\"0 0 60 60\"\n\t\tpreserveAspectRatio=\"none\"\n\t>\n\t\t<Path vectorEffect=\"non-scaling-stroke\" d=\"M60 60 0 0\" />\n\t</SVG>\n);\n\n/**\n * Renders a placeholder. Normally used by blocks to render their empty state.\n *\n * ```jsx\n * import { Placeholder } from '@wordpress/components';\n * import { more } from '@wordpress/icons';\n *\n * const MyPlaceholder = () => <Placeholder icon={ more } label=\"Placeholder\" />;\n * ```\n */\nexport function Placeholder(\n\tprops: WordPressComponentProps< PlaceholderProps, 'div', false >\n) {\n\tconst {\n\t\ticon,\n\t\tchildren,\n\t\tlabel,\n\t\tinstructions,\n\t\tclassName,\n\t\tnotices,\n\t\tpreview,\n\t\tisColumnLayout,\n\t\twithIllustration,\n\t\t...additionalProps\n\t} = props;\n\tconst [ resizeListener, { width } ] = useResizeObserver();\n\n\t// Since `useResizeObserver` will report a width of `null` until after the\n\t// first render, avoid applying any modifier classes until width is known.\n\tlet modifierClassNames;\n\tif ( typeof width === 'number' ) {\n\t\tmodifierClassNames = {\n\t\t\t'is-large': width >= 480,\n\t\t\t'is-medium': width >= 160 && width < 480,\n\t\t\t'is-small': width < 160,\n\t\t};\n\t}\n\n\tconst classes = classnames(\n\t\t'components-placeholder',\n\t\tclassName,\n\t\tmodifierClassNames,\n\t\twithIllustration ? 'has-illustration' : null\n\t);\n\tconst fieldsetClasses = classnames( 'components-placeholder__fieldset', {\n\t\t'is-column-layout': isColumnLayout,\n\t} );\n\treturn (\n\t\t<div { ...additionalProps } className={ classes }>\n\t\t\t{ withIllustration ? PlaceholderIllustration : null }\n\t\t\t{ resizeListener }\n\t\t\t{ notices }\n\t\t\t{ preview && (\n\t\t\t\t<div className=\"components-placeholder__preview\">\n\t\t\t\t\t{ preview }\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t<div className=\"components-placeholder__label\">\n\t\t\t\t<Icon icon={ icon } />\n\t\t\t\t{ label }\n\t\t\t</div>\n\t\t\t<fieldset className={ fieldsetClasses }>\n\t\t\t\t{ !! instructions && (\n\t\t\t\t\t<legend className=\"components-placeholder__instructions\">\n\t\t\t\t\t\t{ instructions }\n\t\t\t\t\t</legend>\n\t\t\t\t) }\n\t\t\t\t{ children }\n\t\t\t</fieldset>\n\t\t</div>\n\t);\n}\n\nexport default Placeholder;\n"],"mappings":";;;;;;;;;AAGA,IAAAA,WAAA,GAAAC,sBAAA,CAAAC,OAAA;AAKA,IAAAC,QAAA,GAAAD,OAAA;AACA,IAAAE,WAAA,GAAAF,OAAA;AAKA,IAAAG,KAAA,GAAAJ,sBAAA,CAAAC,OAAA;AAdA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;;AAKA,MAAMI,uBAAuB,GAC5B,IAAAC,QAAA,CAAAC,aAAA,EAACJ,WAAA,CAAAK,GAAG;EACHC,SAAS,EAAC,sCAAsC;EAChDC,IAAI,EAAC,MAAM;EACXC,KAAK,EAAC,4BAA4B;EAClCC,OAAO,EAAC,WAAW;EACnBC,mBAAmB,EAAC;AAAM,GAE1B,IAAAP,QAAA,CAAAC,aAAA,EAACJ,WAAA,CAAAW,IAAI;EAACC,YAAY,EAAC,oBAAoB;EAACC,CAAC,EAAC;AAAY,CAAE,CACpD,CACL;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASC,WAAWA,CAC1BC,KAAgE,EAC/D;EACD,MAAM;IACLC,IAAI;IACJC,QAAQ;IACRC,KAAK;IACLC,YAAY;IACZb,SAAS;IACTc,OAAO;IACPC,OAAO;IACPC,cAAc;IACdC,gBAAgB;IAChB,GAAGC;EACJ,CAAC,GAAGT,KAAK;EACT,MAAM,CAAEU,cAAc,EAAE;IAAEC;EAAM,CAAC,CAAE,GAAG,IAAAC,0BAAiB,EAAC,CAAC;;EAEzD;EACA;EACA,IAAIC,kBAAkB;EACtB,IAAK,OAAOF,KAAK,KAAK,QAAQ,EAAG;IAChCE,kBAAkB,GAAG;MACpB,UAAU,EAAEF,KAAK,IAAI,GAAG;MACxB,WAAW,EAAEA,KAAK,IAAI,GAAG,IAAIA,KAAK,GAAG,GAAG;MACxC,UAAU,EAAEA,KAAK,GAAG;IACrB,CAAC;EACF;EAEA,MAAMG,OAAO,GAAG,IAAAC,mBAAU,EACzB,wBAAwB,EACxBxB,SAAS,EACTsB,kBAAkB,EAClBL,gBAAgB,GAAG,kBAAkB,GAAG,IACzC,CAAC;EACD,MAAMQ,eAAe,GAAG,IAAAD,mBAAU,EAAE,kCAAkC,EAAE;IACvE,kBAAkB,EAAER;EACrB,CAAE,CAAC;EACH,OACC,IAAAnB,QAAA,CAAAC,aAAA;IAAA,GAAUoB,eAAe;IAAGlB,SAAS,EAAGuB;EAAS,GAC9CN,gBAAgB,GAAGrB,uBAAuB,GAAG,IAAI,EACjDuB,cAAc,EACdL,OAAO,EACPC,OAAO,IACR,IAAAlB,QAAA,CAAAC,aAAA;IAAKE,SAAS,EAAC;EAAiC,GAC7Ce,OACE,CACL,EACD,IAAAlB,QAAA,CAAAC,aAAA;IAAKE,SAAS,EAAC;EAA+B,GAC7C,IAAAH,QAAA,CAAAC,aAAA,EAACH,KAAA,CAAA+B,OAAI;IAAChB,IAAI,EAAGA;EAAM,CAAE,CAAC,EACpBE,KACE,CAAC,EACN,IAAAf,QAAA,CAAAC,aAAA;IAAUE,SAAS,EAAGyB;EAAiB,GACpC,CAAC,CAAEZ,YAAY,IAChB,IAAAhB,QAAA,CAAAC,aAAA;IAAQE,SAAS,EAAC;EAAsC,GACrDa,YACK,CACR,EACCF,QACO,CACN,CAAC;AAER;AAAC,IAAAgB,QAAA,GAEcnB,WAAW;AAAAoB,OAAA,CAAAF,OAAA,GAAAC,QAAA"}

package/build/placeholder/types.js.map

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}
+{"version":3,"names":[],"sources":["@wordpress/components/src/placeholder/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactNode } from 'react';\n\n/**\n * Internal dependencies\n */\nimport type { IconType } from '../icon';\n\nexport type PlaceholderProps = {\n\t/**\n\t * The children elements.\n\t */\n\tchildren?: ReactNode;\n\t/**\n\t * Class to set on the container div.\n\t */\n\tclassName?: string;\n\t/**\n\t * If provided, renders an icon next to the label.\n\t */\n\ticon?: IconType;\n\t/**\n\t * Instructions of the placeholder.\n\t */\n\tinstructions?: string;\n\t/**\n\t * Changes placeholder children layout from flex-row to flex-column.\n\t */\n\tisColumnLayout?: boolean;\n\t/**\n\t * Title of the placeholder.\n\t */\n\tlabel?: string;\n\t/**\n\t * A rendered notices list\n\t */\n\tnotices?: ReactNode;\n\t/**\n\t * Preview to be rendered in the placeholder.\n\t */\n\tpreview?: ReactNode;\n\t/**\n\t * Outputs a placeholder illustration.\n\t */\n\twithIllustration?: boolean;\n};\n"],"mappings":""}