@wordpress/primitives 3.32.0 → 3.33.1

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/CHANGELOG.md CHANGED
@@ -2,6 +2,8 @@
2
2
 
3
3
  ## Unreleased
4
4
 
5
+ ## 3.33.0 (2023-06-07)
6
+
5
7
  ## 3.32.0 (2023-05-24)
6
8
 
7
9
  ## 3.31.0 (2023-05-10)
@@ -26,16 +26,15 @@ var _style = _interopRequireDefault(require("./style.scss"));
26
26
  /**
27
27
  * Internal dependencies
28
28
  */
29
- const BlockQuotation = (0, _element.forwardRef)((_ref, ref) => {
30
- let { ...props
31
- } = _ref;
29
+ const BlockQuotation = (0, _element.forwardRef)(({ ...props
30
+ }, ref) => {
32
31
  const {
33
32
  style
34
33
  } = props;
35
- const blockQuoteStyle = [(0, _compose.usePreferredColorSchemeStyle)(_style.default.wpBlockQuoteLight, _style.default.wpBlockQuoteDark), (style === null || style === void 0 ? void 0 : style.color) && {
34
+ const blockQuoteStyle = [(0, _compose.usePreferredColorSchemeStyle)(_style.default.wpBlockQuoteLight, _style.default.wpBlockQuoteDark), style?.color && {
36
35
  borderLeftColor: style.color
37
- }, style, (style === null || style === void 0 ? void 0 : style.backgroundColor) && _style.default.paddingWithBackground];
38
- const colorStyle = style !== null && style !== void 0 && style.color ? {
36
+ }, style, style?.backgroundColor && _style.default.paddingWithBackground];
37
+ const colorStyle = style?.color ? {
39
38
  color: style.color
40
39
  } : {};
41
40
 
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/primitives/src/block-quotation/index.native.js"],"names":["BlockQuotation","ref","props","style","blockQuoteStyle","styles","wpBlockQuoteLight","wpBlockQuoteDark","color","borderLeftColor","backgroundColor","paddingWithBackground","colorStyle","newChildren","Children","map","children","child","identifier","wpBlockQuoteCitation","tagsToEliminate"],"mappings":";;;;;;;;;AAOA;;AAJA;;AAKA;;AAIA;;AAZA;AACA;AACA;;AAEA;AACA;AACA;;AAGA;AACA;AACA;AAGO,MAAMA,cAAc,GAAG,yBAAY,OAAgBC,GAAhB,KAAyB;AAAA,MAAvB,EAAE,GAAGC;AAAL,GAAuB;AAClE,QAAM;AAAEC,IAAAA;AAAF,MAAYD,KAAlB;AAEA,QAAME,eAAe,GAAG,CACvB,2CACCC,eAAOC,iBADR,EAECD,eAAOE,gBAFR,CADuB,EAKvB,CAAAJ,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEK,KAAP,KAAgB;AACfC,IAAAA,eAAe,EAAEN,KAAK,CAACK;AADR,GALO,EAQvBL,KARuB,EASvB,CAAAA,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEO,eAAP,KAA0BL,eAAOM,qBATV,CAAxB;AAWA,QAAMC,UAAU,GAAGT,KAAK,SAAL,IAAAA,KAAK,WAAL,IAAAA,KAAK,CAAEK,KAAP,GAAe;AAAEA,IAAAA,KAAK,EAAEL,KAAK,CAACK;AAAf,GAAf,GAAwC,EAA3D;;AAEA,QAAMK,WAAW,GAAGC,kBAASC,GAAT,CAAcb,KAAK,CAACc,QAApB,EAAgCC,KAAF,IAAa;AAC9D,QAAKA,KAAK,IAAIA,KAAK,CAACf,KAAN,CAAYgB,UAAZ,KAA2B,UAAzC,EAAsD;AACrD,aAAO,2BAAcD,KAAd,EAAqB;AAC3Bd,QAAAA,KAAK,EAAE,EACN,GAAGE,eAAOc,oBADJ;AAEN,aAAGP;AAFG;AADoB,OAArB,CAAP;AAMA;;AACD,QAAKK,KAAK,IAAIA,KAAK,CAACf,KAAN,CAAYgB,UAAZ,KAA2B,OAAzC,EAAmD;AAClD,aAAO,2BAAcD,KAAd,EAAqB;AAC3BG,QAAAA,eAAe,EAAE,CAAE,KAAF,CADU;AAE3BjB,QAAAA,KAAK,EAAES;AAFoB,OAArB,CAAP;AAIA;;AACD,WAAOK,KAAP;AACA,GAhBmB,CAApB;;AAiBA,SACC,4BAAC,iBAAD;AAAM,IAAA,GAAG,EAAGhB,GAAZ;AAAkB,IAAA,KAAK,EAAGG;AAA1B,KACGS,WADH,CADD;AAKA,CAtC6B,CAAvB","sourcesContent":["/**\n * External dependencies\n */\nimport { View } from 'react-native';\n/**\n * WordPress dependencies\n */\nimport { Children, cloneElement, forwardRef } from '@wordpress/element';\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\n\nexport const BlockQuotation = forwardRef( ( { ...props }, ref ) => {\n\tconst { style } = props;\n\n\tconst blockQuoteStyle = [\n\t\tusePreferredColorSchemeStyle(\n\t\t\tstyles.wpBlockQuoteLight,\n\t\t\tstyles.wpBlockQuoteDark\n\t\t),\n\t\tstyle?.color && {\n\t\t\tborderLeftColor: style.color,\n\t\t},\n\t\tstyle,\n\t\tstyle?.backgroundColor && styles.paddingWithBackground,\n\t];\n\tconst colorStyle = style?.color ? { color: style.color } : {};\n\n\tconst newChildren = Children.map( props.children, ( child ) => {\n\t\tif ( child && child.props.identifier === 'citation' ) {\n\t\t\treturn cloneElement( child, {\n\t\t\t\tstyle: {\n\t\t\t\t\t...styles.wpBlockQuoteCitation,\n\t\t\t\t\t...colorStyle,\n\t\t\t\t},\n\t\t\t} );\n\t\t}\n\t\tif ( child && child.props.identifier === 'value' ) {\n\t\t\treturn cloneElement( child, {\n\t\t\t\ttagsToEliminate: [ 'div' ],\n\t\t\t\tstyle: colorStyle,\n\t\t\t} );\n\t\t}\n\t\treturn child;\n\t} );\n\treturn (\n\t\t<View ref={ ref } style={ blockQuoteStyle }>\n\t\t\t{ newChildren }\n\t\t</View>\n\t);\n} );\n"]}
1
+ {"version":3,"sources":["@wordpress/primitives/src/block-quotation/index.native.js"],"names":["BlockQuotation","props","ref","style","blockQuoteStyle","styles","wpBlockQuoteLight","wpBlockQuoteDark","color","borderLeftColor","backgroundColor","paddingWithBackground","colorStyle","newChildren","Children","map","children","child","identifier","wpBlockQuoteCitation","tagsToEliminate"],"mappings":";;;;;;;;;AAOA;;AAJA;;AAKA;;AAIA;;AAZA;AACA;AACA;;AAEA;AACA;AACA;;AAGA;AACA;AACA;AAGO,MAAMA,cAAc,GAAG,yBAAY,CAAE,EAAE,GAAGC;AAAL,CAAF,EAAgBC,GAAhB,KAAyB;AAClE,QAAM;AAAEC,IAAAA;AAAF,MAAYF,KAAlB;AAEA,QAAMG,eAAe,GAAG,CACvB,2CACCC,eAAOC,iBADR,EAECD,eAAOE,gBAFR,CADuB,EAKvBJ,KAAK,EAAEK,KAAP,IAAgB;AACfC,IAAAA,eAAe,EAAEN,KAAK,CAACK;AADR,GALO,EAQvBL,KARuB,EASvBA,KAAK,EAAEO,eAAP,IAA0BL,eAAOM,qBATV,CAAxB;AAWA,QAAMC,UAAU,GAAGT,KAAK,EAAEK,KAAP,GAAe;AAAEA,IAAAA,KAAK,EAAEL,KAAK,CAACK;AAAf,GAAf,GAAwC,EAA3D;;AAEA,QAAMK,WAAW,GAAGC,kBAASC,GAAT,CAAcd,KAAK,CAACe,QAApB,EAAgCC,KAAF,IAAa;AAC9D,QAAKA,KAAK,IAAIA,KAAK,CAAChB,KAAN,CAAYiB,UAAZ,KAA2B,UAAzC,EAAsD;AACrD,aAAO,2BAAcD,KAAd,EAAqB;AAC3Bd,QAAAA,KAAK,EAAE,EACN,GAAGE,eAAOc,oBADJ;AAEN,aAAGP;AAFG;AADoB,OAArB,CAAP;AAMA;;AACD,QAAKK,KAAK,IAAIA,KAAK,CAAChB,KAAN,CAAYiB,UAAZ,KAA2B,OAAzC,EAAmD;AAClD,aAAO,2BAAcD,KAAd,EAAqB;AAC3BG,QAAAA,eAAe,EAAE,CAAE,KAAF,CADU;AAE3BjB,QAAAA,KAAK,EAAES;AAFoB,OAArB,CAAP;AAIA;;AACD,WAAOK,KAAP;AACA,GAhBmB,CAApB;;AAiBA,SACC,4BAAC,iBAAD;AAAM,IAAA,GAAG,EAAGf,GAAZ;AAAkB,IAAA,KAAK,EAAGE;AAA1B,KACGS,WADH,CADD;AAKA,CAtC6B,CAAvB","sourcesContent":["/**\n * External dependencies\n */\nimport { View } from 'react-native';\n/**\n * WordPress dependencies\n */\nimport { Children, cloneElement, forwardRef } from '@wordpress/element';\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\n\nexport const BlockQuotation = forwardRef( ( { ...props }, ref ) => {\n\tconst { style } = props;\n\n\tconst blockQuoteStyle = [\n\t\tusePreferredColorSchemeStyle(\n\t\t\tstyles.wpBlockQuoteLight,\n\t\t\tstyles.wpBlockQuoteDark\n\t\t),\n\t\tstyle?.color && {\n\t\t\tborderLeftColor: style.color,\n\t\t},\n\t\tstyle,\n\t\tstyle?.backgroundColor && styles.paddingWithBackground,\n\t];\n\tconst colorStyle = style?.color ? { color: style.color } : {};\n\n\tconst newChildren = Children.map( props.children, ( child ) => {\n\t\tif ( child && child.props.identifier === 'citation' ) {\n\t\t\treturn cloneElement( child, {\n\t\t\t\tstyle: {\n\t\t\t\t\t...styles.wpBlockQuoteCitation,\n\t\t\t\t\t...colorStyle,\n\t\t\t\t},\n\t\t\t} );\n\t\t}\n\t\tif ( child && child.props.identifier === 'value' ) {\n\t\t\treturn cloneElement( child, {\n\t\t\t\ttagsToEliminate: [ 'div' ],\n\t\t\t\tstyle: colorStyle,\n\t\t\t} );\n\t\t}\n\t\treturn child;\n\t} );\n\treturn (\n\t\t<View ref={ ref } style={ blockQuoteStyle }>\n\t\t\t{ newChildren }\n\t\t</View>\n\t);\n} );\n"]}
@@ -9,9 +9,7 @@ exports.HorizontalRule = void 0;
9
9
 
10
10
  var _element = require("@wordpress/element");
11
11
 
12
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
13
-
14
- var _reactNativeHr = _interopRequireDefault(require("react-native-hr"));
12
+ var _reactNative = require("react-native");
15
13
 
16
14
  var _compose = require("@wordpress/compose");
17
15
 
@@ -28,17 +26,41 @@ var _styles = _interopRequireDefault(require("./styles.scss"));
28
26
  /**
29
27
  * Internal dependencies
30
28
  */
31
- const HR = _ref => {
32
- let {
33
- getStylesFromColorScheme,
29
+ const HR = ({
30
+ getStylesFromColorScheme,
31
+ lineStyle,
32
+ marginLeft,
33
+ marginRight,
34
+ textStyle,
35
+ text,
36
+ ...props
37
+ }) => {
38
+ const renderLine = key => (0, _element.createElement)(_reactNative.View, {
39
+ key: key,
40
+ style: getStylesFromColorScheme(_styles.default.line, _styles.default.lineDark)
41
+ });
42
+
43
+ const renderText = key => (0, _element.createElement)(_reactNative.View, {
44
+ key: key
45
+ }, (0, _element.createElement)(_reactNative.Text, {
46
+ style: [_styles.default.text, textStyle]
47
+ }, text));
48
+
49
+ const renderInner = () => {
50
+ if (!text) {
51
+ return renderLine();
52
+ }
53
+
54
+ return [renderLine(1), renderText(2), renderLine(3)];
55
+ };
56
+
57
+ return (0, _element.createElement)(_reactNative.View, {
58
+ style: [_styles.default.container, {
59
+ marginLeft,
60
+ marginRight
61
+ }, props.style],
34
62
  ...props
35
- } = _ref;
36
- const lineStyle = getStylesFromColorScheme(_styles.default.line, _styles.default.lineDark);
37
- return (0, _element.createElement)(_reactNativeHr.default, (0, _extends2.default)({}, props, {
38
- lineStyle: [lineStyle, props.lineStyle],
39
- marginLeft: 0,
40
- marginRight: 0
41
- }));
63
+ }, renderInner());
42
64
  };
43
65
 
44
66
  const HorizontalRule = (0, _compose.withPreferredColorScheme)(HR);
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/primitives/src/horizontal-rule/index.native.js"],"names":["HR","getStylesFromColorScheme","props","lineStyle","styles","line","lineDark","HorizontalRule"],"mappings":";;;;;;;;;;;;;AAGA;;AAKA;;AAKA;;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAGA,MAAMA,EAAE,GAAG,QAA8C;AAAA,MAA5C;AAAEC,IAAAA,wBAAF;AAA4B,OAAGC;AAA/B,GAA4C;AACxD,QAAMC,SAAS,GAAGF,wBAAwB,CAAEG,gBAAOC,IAAT,EAAeD,gBAAOE,QAAtB,CAA1C;AAEA,SACC,4BAAC,sBAAD,6BACMJ,KADN;AAEC,IAAA,SAAS,EAAG,CAAEC,SAAF,EAAaD,KAAK,CAACC,SAAnB,CAFb;AAGC,IAAA,UAAU,EAAG,CAHd;AAIC,IAAA,WAAW,EAAG;AAJf,KADD;AAQA,CAXD;;AAaO,MAAMI,cAAc,GAAG,uCAA0BP,EAA1B,CAAvB","sourcesContent":["/**\n * External dependencies\n */\nimport Hr from 'react-native-hr';\n\n/**\n * WordPress dependencies\n */\nimport { withPreferredColorScheme } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport styles from './styles.scss';\n\nconst HR = ( { getStylesFromColorScheme, ...props } ) => {\n\tconst lineStyle = getStylesFromColorScheme( styles.line, styles.lineDark );\n\n\treturn (\n\t\t<Hr\n\t\t\t{ ...props }\n\t\t\tlineStyle={ [ lineStyle, props.lineStyle ] }\n\t\t\tmarginLeft={ 0 }\n\t\t\tmarginRight={ 0 }\n\t\t/>\n\t);\n};\n\nexport const HorizontalRule = withPreferredColorScheme( HR );\n"]}
1
+ {"version":3,"sources":["@wordpress/primitives/src/horizontal-rule/index.native.js"],"names":["HR","getStylesFromColorScheme","lineStyle","marginLeft","marginRight","textStyle","text","props","renderLine","key","styles","line","lineDark","renderText","renderInner","container","style","HorizontalRule"],"mappings":";;;;;;;;;;;AAGA;;AAKA;;AAKA;;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAGA,MAAMA,EAAE,GAAG,CAAE;AACZC,EAAAA,wBADY;AAEZC,EAAAA,SAFY;AAGZC,EAAAA,UAHY;AAIZC,EAAAA,WAJY;AAKZC,EAAAA,SALY;AAMZC,EAAAA,IANY;AAOZ,KAAGC;AAPS,CAAF,KAQJ;AACN,QAAMC,UAAU,GAAKC,GAAF,IAClB,4BAAC,iBAAD;AACC,IAAA,GAAG,EAAGA,GADP;AAEC,IAAA,KAAK,EAAGR,wBAAwB,CAAES,gBAAOC,IAAT,EAAeD,gBAAOE,QAAtB;AAFjC,IADD;;AAOA,QAAMC,UAAU,GAAKJ,GAAF,IAClB,4BAAC,iBAAD;AAAM,IAAA,GAAG,EAAGA;AAAZ,KACC,4BAAC,iBAAD;AAAM,IAAA,KAAK,EAAG,CAAEC,gBAAOJ,IAAT,EAAeD,SAAf;AAAd,KAA6CC,IAA7C,CADD,CADD;;AAMA,QAAMQ,WAAW,GAAG,MAAM;AACzB,QAAK,CAAER,IAAP,EAAc;AACb,aAAOE,UAAU,EAAjB;AACA;;AACD,WAAO,CAAEA,UAAU,CAAE,CAAF,CAAZ,EAAmBK,UAAU,CAAE,CAAF,CAA7B,EAAoCL,UAAU,CAAE,CAAF,CAA9C,CAAP;AACA,GALD;;AAOA,SACC,4BAAC,iBAAD;AACC,IAAA,KAAK,EAAG,CACPE,gBAAOK,SADA,EAEP;AAAEZ,MAAAA,UAAF;AAAcC,MAAAA;AAAd,KAFO,EAGPG,KAAK,CAACS,KAHC,CADT;AAAA,OAMMT;AANN,KAQGO,WAAW,EARd,CADD;AAYA,CAzCD;;AA2CO,MAAMG,cAAc,GAAG,uCAA0BjB,EAA1B,CAAvB","sourcesContent":["/**\n * External dependencies\n */\nimport { Text, View } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { withPreferredColorScheme } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport styles from './styles.scss';\n\nconst HR = ( {\n\tgetStylesFromColorScheme,\n\tlineStyle,\n\tmarginLeft,\n\tmarginRight,\n\ttextStyle,\n\ttext,\n\t...props\n} ) => {\n\tconst renderLine = ( key ) => (\n\t\t<View\n\t\t\tkey={ key }\n\t\t\tstyle={ getStylesFromColorScheme( styles.line, styles.lineDark ) }\n\t\t/>\n\t);\n\n\tconst renderText = ( key ) => (\n\t\t<View key={ key }>\n\t\t\t<Text style={ [ styles.text, textStyle ] }>{ text }</Text>\n\t\t</View>\n\t);\n\n\tconst renderInner = () => {\n\t\tif ( ! text ) {\n\t\t\treturn renderLine();\n\t\t}\n\t\treturn [ renderLine( 1 ), renderText( 2 ), renderLine( 3 ) ];\n\t};\n\n\treturn (\n\t\t<View\n\t\t\tstyle={ [\n\t\t\t\tstyles.container,\n\t\t\t\t{ marginLeft, marginRight },\n\t\t\t\tprops.style,\n\t\t\t] }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t{ renderInner() }\n\t\t</View>\n\t);\n};\n\nexport const HorizontalRule = withPreferredColorScheme( HR );\n"]}
@@ -128,12 +128,11 @@ const Stop = props => (0, _element.createElement)('stop', props);
128
128
 
129
129
  exports.Stop = Stop;
130
130
 
131
- const SVG = _ref => {
132
- let {
133
- className,
134
- isPressed,
135
- ...props
136
- } = _ref;
131
+ const SVG = ({
132
+ className,
133
+ isPressed,
134
+ ...props
135
+ }) => {
137
136
  const appliedProps = { ...props,
138
137
  className: (0, _classnames.default)(className, {
139
138
  'is-pressed': isPressed
@@ -143,7 +142,8 @@ const SVG = _ref => {
143
142
  }; // Disable reason: We need to have a way to render HTML tag for web.
144
143
  // eslint-disable-next-line react/forbid-elements
145
144
 
146
- return (0, _element.createElement)("svg", appliedProps);
145
+ return (0, _element.createElement)("svg", { ...appliedProps
146
+ });
147
147
  };
148
148
 
149
149
  exports.SVG = SVG;
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/primitives/src/svg/index.js"],"names":["Circle","props","G","Line","Path","Polygon","Rect","Defs","RadialGradient","LinearGradient","Stop","SVG","className","isPressed","appliedProps","undefined","focusable"],"mappings":";;;;;;;;;AAGA;;AAKA;;AARA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;;AAEA;AACA;AACA;AACA;AACA;AACO,MAAMA,MAAM,GAAKC,KAAF,IAAa,4BAAe,QAAf,EAAyBA,KAAzB,CAA5B;AAEP;AACA;AACA;AACA;AACA;;;;;AACO,MAAMC,CAAC,GAAKD,KAAF,IAAa,4BAAe,GAAf,EAAoBA,KAApB,CAAvB;AAEP;AACA;AACA;AACA;AACA;;;;;AACO,MAAME,IAAI,GAAKF,KAAF,IAAa,4BAAe,MAAf,EAAuBA,KAAvB,CAA1B;AAEP;AACA;AACA;AACA;AACA;;;;;AACO,MAAMG,IAAI,GAAKH,KAAF,IAAa,4BAAe,MAAf,EAAuBA,KAAvB,CAA1B;AAEP;AACA;AACA;AACA;AACA;;;;;AACO,MAAMI,OAAO,GAAKJ,KAAF,IAAa,4BAAe,SAAf,EAA0BA,KAA1B,CAA7B;AAEP;AACA;AACA;AACA;AACA;;;;;AACO,MAAMK,IAAI,GAAKL,KAAF,IAAa,4BAAe,MAAf,EAAuBA,KAAvB,CAA1B;AAEP;AACA;AACA;AACA;AACA;;;;;AACO,MAAMM,IAAI,GAAKN,KAAF,IAAa,4BAAe,MAAf,EAAuBA,KAAvB,CAA1B;AAEP;AACA;AACA;AACA;AACA;;;;;AACO,MAAMO,cAAc,GAAKP,KAAF,IAC7B,4BAAe,gBAAf,EAAiCA,KAAjC,CADM;AAGP;AACA;AACA;AACA;AACA;;;;;AACO,MAAMQ,cAAc,GAAKR,KAAF,IAC7B,4BAAe,gBAAf,EAAiCA,KAAjC,CADM;AAGP;AACA;AACA;AACA;AACA;;;;;AACO,MAAMS,IAAI,GAAKT,KAAF,IAAa,4BAAe,MAAf,EAAuBA,KAAvB,CAA1B;AAEP;AACA;AACA;AACA;AACA;AACA;AACA;;;;;AACO,MAAMU,GAAG,GAAG,QAA0C;AAAA,MAAxC;AAAEC,IAAAA,SAAF;AAAaC,IAAAA,SAAb;AAAwB,OAAGZ;AAA3B,GAAwC;AAC5D,QAAMa,YAAY,GAAG,EACpB,GAAGb,KADiB;AAEpBW,IAAAA,SAAS,EACR,yBAAYA,SAAZ,EAAuB;AAAE,oBAAcC;AAAhB,KAAvB,KAAwDE,SAHrC;AAIpB,mBAAe,IAJK;AAKpBC,IAAAA,SAAS,EAAE;AALS,GAArB,CAD4D,CAS5D;AACA;;AACA,SAAO,mCAAUF,YAAV,CAAP;AACA,CAZM","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { createElement } from '@wordpress/element';\n\n/** @typedef {{isPressed?: boolean} & import('react').ComponentPropsWithoutRef<'svg'>} SVGProps */\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'circle'>} props\n *\n * @return {JSX.Element} Circle component\n */\nexport const Circle = ( props ) => createElement( 'circle', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'g'>} props\n *\n * @return {JSX.Element} G component\n */\nexport const G = ( props ) => createElement( 'g', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'line'>} props\n *\n * @return {JSX.Element} Path component\n */\nexport const Line = ( props ) => createElement( 'line', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'path'>} props\n *\n * @return {JSX.Element} Path component\n */\nexport const Path = ( props ) => createElement( 'path', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'polygon'>} props\n *\n * @return {JSX.Element} Polygon component\n */\nexport const Polygon = ( props ) => createElement( 'polygon', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'rect'>} props\n *\n * @return {JSX.Element} Rect component\n */\nexport const Rect = ( props ) => createElement( 'rect', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'defs'>} props\n *\n * @return {JSX.Element} Defs component\n */\nexport const Defs = ( props ) => createElement( 'defs', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'radialGradient'>} props\n *\n * @return {JSX.Element} RadialGradient component\n */\nexport const RadialGradient = ( props ) =>\n\tcreateElement( 'radialGradient', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'linearGradient'>} props\n *\n * @return {JSX.Element} LinearGradient component\n */\nexport const LinearGradient = ( props ) =>\n\tcreateElement( 'linearGradient', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'stop'>} props\n *\n * @return {JSX.Element} Stop component\n */\nexport const Stop = ( props ) => createElement( 'stop', props );\n\n/**\n *\n * @param {SVGProps} props isPressed indicates whether the SVG should appear as pressed.\n * Other props will be passed through to svg component.\n *\n * @return {JSX.Element} Stop component\n */\nexport const SVG = ( { className, isPressed, ...props } ) => {\n\tconst appliedProps = {\n\t\t...props,\n\t\tclassName:\n\t\t\tclassnames( className, { 'is-pressed': isPressed } ) || undefined,\n\t\t'aria-hidden': true,\n\t\tfocusable: false,\n\t};\n\n\t// Disable reason: We need to have a way to render HTML tag for web.\n\t// eslint-disable-next-line react/forbid-elements\n\treturn <svg { ...appliedProps } />;\n};\n"]}
1
+ {"version":3,"sources":["@wordpress/primitives/src/svg/index.js"],"names":["Circle","props","G","Line","Path","Polygon","Rect","Defs","RadialGradient","LinearGradient","Stop","SVG","className","isPressed","appliedProps","undefined","focusable"],"mappings":";;;;;;;;;AAGA;;AAKA;;AARA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;;AAEA;AACA;AACA;AACA;AACA;AACO,MAAMA,MAAM,GAAKC,KAAF,IAAa,4BAAe,QAAf,EAAyBA,KAAzB,CAA5B;AAEP;AACA;AACA;AACA;AACA;;;;;AACO,MAAMC,CAAC,GAAKD,KAAF,IAAa,4BAAe,GAAf,EAAoBA,KAApB,CAAvB;AAEP;AACA;AACA;AACA;AACA;;;;;AACO,MAAME,IAAI,GAAKF,KAAF,IAAa,4BAAe,MAAf,EAAuBA,KAAvB,CAA1B;AAEP;AACA;AACA;AACA;AACA;;;;;AACO,MAAMG,IAAI,GAAKH,KAAF,IAAa,4BAAe,MAAf,EAAuBA,KAAvB,CAA1B;AAEP;AACA;AACA;AACA;AACA;;;;;AACO,MAAMI,OAAO,GAAKJ,KAAF,IAAa,4BAAe,SAAf,EAA0BA,KAA1B,CAA7B;AAEP;AACA;AACA;AACA;AACA;;;;;AACO,MAAMK,IAAI,GAAKL,KAAF,IAAa,4BAAe,MAAf,EAAuBA,KAAvB,CAA1B;AAEP;AACA;AACA;AACA;AACA;;;;;AACO,MAAMM,IAAI,GAAKN,KAAF,IAAa,4BAAe,MAAf,EAAuBA,KAAvB,CAA1B;AAEP;AACA;AACA;AACA;AACA;;;;;AACO,MAAMO,cAAc,GAAKP,KAAF,IAC7B,4BAAe,gBAAf,EAAiCA,KAAjC,CADM;AAGP;AACA;AACA;AACA;AACA;;;;;AACO,MAAMQ,cAAc,GAAKR,KAAF,IAC7B,4BAAe,gBAAf,EAAiCA,KAAjC,CADM;AAGP;AACA;AACA;AACA;AACA;;;;;AACO,MAAMS,IAAI,GAAKT,KAAF,IAAa,4BAAe,MAAf,EAAuBA,KAAvB,CAA1B;AAEP;AACA;AACA;AACA;AACA;AACA;AACA;;;;;AACO,MAAMU,GAAG,GAAG,CAAE;AAAEC,EAAAA,SAAF;AAAaC,EAAAA,SAAb;AAAwB,KAAGZ;AAA3B,CAAF,KAA0C;AAC5D,QAAMa,YAAY,GAAG,EACpB,GAAGb,KADiB;AAEpBW,IAAAA,SAAS,EACR,yBAAYA,SAAZ,EAAuB;AAAE,oBAAcC;AAAhB,KAAvB,KAAwDE,SAHrC;AAIpB,mBAAe,IAJK;AAKpBC,IAAAA,SAAS,EAAE;AALS,GAArB,CAD4D,CAS5D;AACA;;AACA,SAAO,wCAAUF;AAAV,IAAP;AACA,CAZM","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { createElement } from '@wordpress/element';\n\n/** @typedef {{isPressed?: boolean} & import('react').ComponentPropsWithoutRef<'svg'>} SVGProps */\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'circle'>} props\n *\n * @return {JSX.Element} Circle component\n */\nexport const Circle = ( props ) => createElement( 'circle', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'g'>} props\n *\n * @return {JSX.Element} G component\n */\nexport const G = ( props ) => createElement( 'g', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'line'>} props\n *\n * @return {JSX.Element} Path component\n */\nexport const Line = ( props ) => createElement( 'line', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'path'>} props\n *\n * @return {JSX.Element} Path component\n */\nexport const Path = ( props ) => createElement( 'path', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'polygon'>} props\n *\n * @return {JSX.Element} Polygon component\n */\nexport const Polygon = ( props ) => createElement( 'polygon', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'rect'>} props\n *\n * @return {JSX.Element} Rect component\n */\nexport const Rect = ( props ) => createElement( 'rect', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'defs'>} props\n *\n * @return {JSX.Element} Defs component\n */\nexport const Defs = ( props ) => createElement( 'defs', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'radialGradient'>} props\n *\n * @return {JSX.Element} RadialGradient component\n */\nexport const RadialGradient = ( props ) =>\n\tcreateElement( 'radialGradient', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'linearGradient'>} props\n *\n * @return {JSX.Element} LinearGradient component\n */\nexport const LinearGradient = ( props ) =>\n\tcreateElement( 'linearGradient', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'stop'>} props\n *\n * @return {JSX.Element} Stop component\n */\nexport const Stop = ( props ) => createElement( 'stop', props );\n\n/**\n *\n * @param {SVGProps} props isPressed indicates whether the SVG should appear as pressed.\n * Other props will be passed through to svg component.\n *\n * @return {JSX.Element} Stop component\n */\nexport const SVG = ( { className, isPressed, ...props } ) => {\n\tconst appliedProps = {\n\t\t...props,\n\t\tclassName:\n\t\t\tclassnames( className, { 'is-pressed': isPressed } ) || undefined,\n\t\t'aria-hidden': true,\n\t\tfocusable: false,\n\t};\n\n\t// Disable reason: We need to have a way to render HTML tag for web.\n\t// eslint-disable-next-line react/forbid-elements\n\treturn <svg { ...appliedProps } />;\n};\n"]}
@@ -69,8 +69,6 @@ Object.defineProperty(exports, "Stop", {
69
69
 
70
70
  var _element = require("@wordpress/element");
71
71
 
72
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
73
-
74
72
  var _reactNativeSvg = require("react-native-svg");
75
73
 
76
74
  var _reactNative = require("react-native");
@@ -88,17 +86,17 @@ var _style = _interopRequireDefault(require("./style.scss"));
88
86
  /**
89
87
  * Internal dependencies
90
88
  */
91
- const AnimatedSvg = _reactNative.Animated.createAnimatedComponent((0, _element.forwardRef)((props, ref) => (0, _element.createElement)(_reactNativeSvg.Svg, (0, _extends2.default)({
92
- ref: ref
93
- }, props))));
89
+ const AnimatedSvg = _reactNative.Animated.createAnimatedComponent((0, _element.forwardRef)((props, ref) => (0, _element.createElement)(_reactNativeSvg.Svg, {
90
+ ref: ref,
91
+ ...props
92
+ })));
94
93
 
95
- const SVG = _ref => {
96
- let {
97
- className = '',
98
- isPressed,
99
- animated = false,
100
- ...props
101
- } = _ref;
94
+ const SVG = ({
95
+ className = '',
96
+ isPressed,
97
+ animated = false,
98
+ ...props
99
+ }) => {
102
100
  const colorScheme = props.colorScheme || 'light';
103
101
  const stylesFromClasses = className.split(' ').map(element => _style.default[element]).filter(Boolean);
104
102
  const defaultStyle = isPressed ? _style.default['is-pressed'] : _style.default['components-toolbar__control-' + colorScheme];
@@ -113,11 +111,12 @@ const SVG = _ref => {
113
111
  };
114
112
  const SvgWrapper = animated ? AnimatedSvg : _reactNativeSvg.Svg;
115
113
  return (0, _element.createElement)(SvgWrapper // We want to re-render when style color is changed.
116
- , (0, _extends2.default)({
114
+ , {
117
115
  key: appliedProps.style.color,
118
116
  height: "100%",
119
- width: "100%"
120
- }, appliedProps));
117
+ width: "100%",
118
+ ...appliedProps
119
+ });
121
120
  };
122
121
 
123
122
  exports.SVG = SVG;
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/primitives/src/svg/index.native.js"],"names":["AnimatedSvg","Animated","createAnimatedComponent","props","ref","SVG","className","isPressed","animated","colorScheme","stylesFromClasses","split","map","element","styles","filter","Boolean","defaultStyle","propStyle","Array","isArray","style","reduce","acc","el","styleValues","Object","assign","appliedProps","SvgWrapper","Svg","color"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA;;;;AANA;;AACA;;AAUA;;AAdA;AACA;AACA;;AAIA;AACA;AACA;;AAGA;AACA;AACA;AAgBA,MAAMA,WAAW,GAAGC,sBAASC,uBAAT,CACnB,yBAAY,CAAEC,KAAF,EAASC,GAAT,KAAkB,4BAAC,mBAAD;AAAK,EAAA,GAAG,EAAGA;AAAX,GAAsBD,KAAtB,EAA9B,CADmB,CAApB;;AAIO,MAAME,GAAG,GAAG,QAKZ;AAAA,MALc;AACpBC,IAAAA,SAAS,GAAG,EADQ;AAEpBC,IAAAA,SAFoB;AAGpBC,IAAAA,QAAQ,GAAG,KAHS;AAIpB,OAAGL;AAJiB,GAKd;AACN,QAAMM,WAAW,GAAGN,KAAK,CAACM,WAAN,IAAqB,OAAzC;AACA,QAAMC,iBAAiB,GAAGJ,SAAS,CACjCK,KADwB,CACjB,GADiB,EAExBC,GAFwB,CAEjBC,OAAF,IAAeC,eAAQD,OAAR,CAFI,EAGxBE,MAHwB,CAGhBC,OAHgB,CAA1B;AAIA,QAAMC,YAAY,GAAGV,SAAS,GAC3BO,eAAQ,YAAR,CAD2B,GAE3BA,eAAQ,iCAAiCL,WAAzC,CAFH;AAGA,QAAMS,SAAS,GAAGC,KAAK,CAACC,OAAN,CAAejB,KAAK,CAACkB,KAArB,IACflB,KAAK,CAACkB,KAAN,CAAYC,MAAZ,CAAoB,CAAEC,GAAF,EAAOC,EAAP,KAAe;AACnC,WAAO,EAAE,GAAGD,GAAL;AAAU,SAAGC;AAAb,KAAP;AACC,GAFD,EAEG,EAFH,CADe,GAIfrB,KAAK,CAACkB,KAJT;AAKA,QAAMI,WAAW,GAAGC,MAAM,CAACC,MAAP,CACnB,EADmB,EAEnBV,YAFmB,EAGnBC,SAHmB,EAInB,GAAGR,iBAJgB,CAApB;AAOA,QAAMkB,YAAY,GAAG,EAAE,GAAGzB,KAAL;AAAYkB,IAAAA,KAAK,EAAEI;AAAnB,GAArB;AAEA,QAAMI,UAAU,GAAGrB,QAAQ,GAAGR,WAAH,GAAiB8B,mBAA5C;AAEA,SACC,4BAAC,UAAD,CACC;AADD;AAEC,IAAA,GAAG,EAAGF,YAAY,CAACP,KAAb,CAAmBU,KAF1B;AAGC,IAAA,MAAM,EAAC,MAHR;AAIC,IAAA,KAAK,EAAC;AAJP,KAKMH,YALN,EADD;AASA,CAvCM","sourcesContent":["/**\n * External dependencies\n */\nimport { Svg } from 'react-native-svg';\nimport { Animated } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\n\nexport {\n\tCircle,\n\tG,\n\tPath,\n\tPolygon,\n\tRect,\n\tDefs,\n\tRadialGradient,\n\tLinearGradient,\n\tStop,\n\tLine,\n} from 'react-native-svg';\n\nconst AnimatedSvg = Animated.createAnimatedComponent(\n\tforwardRef( ( props, ref ) => <Svg ref={ ref } { ...props } /> )\n);\n\nexport const SVG = ( {\n\tclassName = '',\n\tisPressed,\n\tanimated = false,\n\t...props\n} ) => {\n\tconst colorScheme = props.colorScheme || 'light';\n\tconst stylesFromClasses = className\n\t\t.split( ' ' )\n\t\t.map( ( element ) => styles[ element ] )\n\t\t.filter( Boolean );\n\tconst defaultStyle = isPressed\n\t\t? styles[ 'is-pressed' ]\n\t\t: styles[ 'components-toolbar__control-' + colorScheme ];\n\tconst propStyle = Array.isArray( props.style )\n\t\t? props.style.reduce( ( acc, el ) => {\n\t\t\t\treturn { ...acc, ...el };\n\t\t }, {} )\n\t\t: props.style;\n\tconst styleValues = Object.assign(\n\t\t{},\n\t\tdefaultStyle,\n\t\tpropStyle,\n\t\t...stylesFromClasses\n\t);\n\n\tconst appliedProps = { ...props, style: styleValues };\n\n\tconst SvgWrapper = animated ? AnimatedSvg : Svg;\n\n\treturn (\n\t\t<SvgWrapper\n\t\t\t// We want to re-render when style color is changed.\n\t\t\tkey={ appliedProps.style.color }\n\t\t\theight=\"100%\"\n\t\t\twidth=\"100%\"\n\t\t\t{ ...appliedProps }\n\t\t/>\n\t);\n};\n"]}
1
+ {"version":3,"sources":["@wordpress/primitives/src/svg/index.native.js"],"names":["AnimatedSvg","Animated","createAnimatedComponent","props","ref","SVG","className","isPressed","animated","colorScheme","stylesFromClasses","split","map","element","styles","filter","Boolean","defaultStyle","propStyle","Array","isArray","style","reduce","acc","el","styleValues","Object","assign","appliedProps","SvgWrapper","Svg","color"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA;;AANA;;AACA;;AAUA;;AAdA;AACA;AACA;;AAIA;AACA;AACA;;AAGA;AACA;AACA;AAgBA,MAAMA,WAAW,GAAGC,sBAASC,uBAAT,CACnB,yBAAY,CAAEC,KAAF,EAASC,GAAT,KAAkB,4BAAC,mBAAD;AAAK,EAAA,GAAG,EAAGA,GAAX;AAAA,KAAsBD;AAAtB,EAA9B,CADmB,CAApB;;AAIO,MAAME,GAAG,GAAG,CAAE;AACpBC,EAAAA,SAAS,GAAG,EADQ;AAEpBC,EAAAA,SAFoB;AAGpBC,EAAAA,QAAQ,GAAG,KAHS;AAIpB,KAAGL;AAJiB,CAAF,KAKZ;AACN,QAAMM,WAAW,GAAGN,KAAK,CAACM,WAAN,IAAqB,OAAzC;AACA,QAAMC,iBAAiB,GAAGJ,SAAS,CACjCK,KADwB,CACjB,GADiB,EAExBC,GAFwB,CAEjBC,OAAF,IAAeC,eAAQD,OAAR,CAFI,EAGxBE,MAHwB,CAGhBC,OAHgB,CAA1B;AAIA,QAAMC,YAAY,GAAGV,SAAS,GAC3BO,eAAQ,YAAR,CAD2B,GAE3BA,eAAQ,iCAAiCL,WAAzC,CAFH;AAGA,QAAMS,SAAS,GAAGC,KAAK,CAACC,OAAN,CAAejB,KAAK,CAACkB,KAArB,IACflB,KAAK,CAACkB,KAAN,CAAYC,MAAZ,CAAoB,CAAEC,GAAF,EAAOC,EAAP,KAAe;AACnC,WAAO,EAAE,GAAGD,GAAL;AAAU,SAAGC;AAAb,KAAP;AACC,GAFD,EAEG,EAFH,CADe,GAIfrB,KAAK,CAACkB,KAJT;AAKA,QAAMI,WAAW,GAAGC,MAAM,CAACC,MAAP,CACnB,EADmB,EAEnBV,YAFmB,EAGnBC,SAHmB,EAInB,GAAGR,iBAJgB,CAApB;AAOA,QAAMkB,YAAY,GAAG,EAAE,GAAGzB,KAAL;AAAYkB,IAAAA,KAAK,EAAEI;AAAnB,GAArB;AAEA,QAAMI,UAAU,GAAGrB,QAAQ,GAAGR,WAAH,GAAiB8B,mBAA5C;AAEA,SACC,4BAAC,UAAD,CACC;AADD;AAEC,IAAA,GAAG,EAAGF,YAAY,CAACP,KAAb,CAAmBU,KAF1B;AAGC,IAAA,MAAM,EAAC,MAHR;AAIC,IAAA,KAAK,EAAC,MAJP;AAAA,OAKMH;AALN,IADD;AASA,CAvCM","sourcesContent":["/**\n * External dependencies\n */\nimport { Svg } from 'react-native-svg';\nimport { Animated } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\n\nexport {\n\tCircle,\n\tG,\n\tPath,\n\tPolygon,\n\tRect,\n\tDefs,\n\tRadialGradient,\n\tLinearGradient,\n\tStop,\n\tLine,\n} from 'react-native-svg';\n\nconst AnimatedSvg = Animated.createAnimatedComponent(\n\tforwardRef( ( props, ref ) => <Svg ref={ ref } { ...props } /> )\n);\n\nexport const SVG = ( {\n\tclassName = '',\n\tisPressed,\n\tanimated = false,\n\t...props\n} ) => {\n\tconst colorScheme = props.colorScheme || 'light';\n\tconst stylesFromClasses = className\n\t\t.split( ' ' )\n\t\t.map( ( element ) => styles[ element ] )\n\t\t.filter( Boolean );\n\tconst defaultStyle = isPressed\n\t\t? styles[ 'is-pressed' ]\n\t\t: styles[ 'components-toolbar__control-' + colorScheme ];\n\tconst propStyle = Array.isArray( props.style )\n\t\t? props.style.reduce( ( acc, el ) => {\n\t\t\t\treturn { ...acc, ...el };\n\t\t }, {} )\n\t\t: props.style;\n\tconst styleValues = Object.assign(\n\t\t{},\n\t\tdefaultStyle,\n\t\tpropStyle,\n\t\t...stylesFromClasses\n\t);\n\n\tconst appliedProps = { ...props, style: styleValues };\n\n\tconst SvgWrapper = animated ? AnimatedSvg : Svg;\n\n\treturn (\n\t\t<SvgWrapper\n\t\t\t// We want to re-render when style color is changed.\n\t\t\tkey={ appliedProps.style.color }\n\t\t\theight=\"100%\"\n\t\t\twidth=\"100%\"\n\t\t\t{ ...appliedProps }\n\t\t/>\n\t);\n};\n"]}
@@ -15,16 +15,15 @@ import { usePreferredColorSchemeStyle } from '@wordpress/compose';
15
15
  */
16
16
 
17
17
  import styles from './style.scss';
18
- export const BlockQuotation = forwardRef((_ref, ref) => {
19
- let { ...props
20
- } = _ref;
18
+ export const BlockQuotation = forwardRef(({ ...props
19
+ }, ref) => {
21
20
  const {
22
21
  style
23
22
  } = props;
24
- const blockQuoteStyle = [usePreferredColorSchemeStyle(styles.wpBlockQuoteLight, styles.wpBlockQuoteDark), (style === null || style === void 0 ? void 0 : style.color) && {
23
+ const blockQuoteStyle = [usePreferredColorSchemeStyle(styles.wpBlockQuoteLight, styles.wpBlockQuoteDark), style?.color && {
25
24
  borderLeftColor: style.color
26
- }, style, (style === null || style === void 0 ? void 0 : style.backgroundColor) && styles.paddingWithBackground];
27
- const colorStyle = style !== null && style !== void 0 && style.color ? {
25
+ }, style, style?.backgroundColor && styles.paddingWithBackground];
26
+ const colorStyle = style?.color ? {
28
27
  color: style.color
29
28
  } : {};
30
29
  const newChildren = Children.map(props.children, child => {
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/primitives/src/block-quotation/index.native.js"],"names":["View","Children","cloneElement","forwardRef","usePreferredColorSchemeStyle","styles","BlockQuotation","ref","props","style","blockQuoteStyle","wpBlockQuoteLight","wpBlockQuoteDark","color","borderLeftColor","backgroundColor","paddingWithBackground","colorStyle","newChildren","map","children","child","identifier","wpBlockQuoteCitation","tagsToEliminate"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,IAAT,QAAqB,cAArB;AACA;AACA;AACA;;AACA,SAASC,QAAT,EAAmBC,YAAnB,EAAiCC,UAAjC,QAAmD,oBAAnD;AACA,SAASC,4BAAT,QAA6C,oBAA7C;AACA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,cAAnB;AAEA,OAAO,MAAMC,cAAc,GAAGH,UAAU,CAAE,OAAgBI,GAAhB,KAAyB;AAAA,MAAvB,EAAE,GAAGC;AAAL,GAAuB;AAClE,QAAM;AAAEC,IAAAA;AAAF,MAAYD,KAAlB;AAEA,QAAME,eAAe,GAAG,CACvBN,4BAA4B,CAC3BC,MAAM,CAACM,iBADoB,EAE3BN,MAAM,CAACO,gBAFoB,CADL,EAKvB,CAAAH,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEI,KAAP,KAAgB;AACfC,IAAAA,eAAe,EAAEL,KAAK,CAACI;AADR,GALO,EAQvBJ,KARuB,EASvB,CAAAA,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEM,eAAP,KAA0BV,MAAM,CAACW,qBATV,CAAxB;AAWA,QAAMC,UAAU,GAAGR,KAAK,SAAL,IAAAA,KAAK,WAAL,IAAAA,KAAK,CAAEI,KAAP,GAAe;AAAEA,IAAAA,KAAK,EAAEJ,KAAK,CAACI;AAAf,GAAf,GAAwC,EAA3D;AAEA,QAAMK,WAAW,GAAGjB,QAAQ,CAACkB,GAAT,CAAcX,KAAK,CAACY,QAApB,EAAgCC,KAAF,IAAa;AAC9D,QAAKA,KAAK,IAAIA,KAAK,CAACb,KAAN,CAAYc,UAAZ,KAA2B,UAAzC,EAAsD;AACrD,aAAOpB,YAAY,CAAEmB,KAAF,EAAS;AAC3BZ,QAAAA,KAAK,EAAE,EACN,GAAGJ,MAAM,CAACkB,oBADJ;AAEN,aAAGN;AAFG;AADoB,OAAT,CAAnB;AAMA;;AACD,QAAKI,KAAK,IAAIA,KAAK,CAACb,KAAN,CAAYc,UAAZ,KAA2B,OAAzC,EAAmD;AAClD,aAAOpB,YAAY,CAAEmB,KAAF,EAAS;AAC3BG,QAAAA,eAAe,EAAE,CAAE,KAAF,CADU;AAE3Bf,QAAAA,KAAK,EAAEQ;AAFoB,OAAT,CAAnB;AAIA;;AACD,WAAOI,KAAP;AACA,GAhBmB,CAApB;AAiBA,SACC,cAAC,IAAD;AAAM,IAAA,GAAG,EAAGd,GAAZ;AAAkB,IAAA,KAAK,EAAGG;AAA1B,KACGQ,WADH,CADD;AAKA,CAtCuC,CAAjC","sourcesContent":["/**\n * External dependencies\n */\nimport { View } from 'react-native';\n/**\n * WordPress dependencies\n */\nimport { Children, cloneElement, forwardRef } from '@wordpress/element';\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\n\nexport const BlockQuotation = forwardRef( ( { ...props }, ref ) => {\n\tconst { style } = props;\n\n\tconst blockQuoteStyle = [\n\t\tusePreferredColorSchemeStyle(\n\t\t\tstyles.wpBlockQuoteLight,\n\t\t\tstyles.wpBlockQuoteDark\n\t\t),\n\t\tstyle?.color && {\n\t\t\tborderLeftColor: style.color,\n\t\t},\n\t\tstyle,\n\t\tstyle?.backgroundColor && styles.paddingWithBackground,\n\t];\n\tconst colorStyle = style?.color ? { color: style.color } : {};\n\n\tconst newChildren = Children.map( props.children, ( child ) => {\n\t\tif ( child && child.props.identifier === 'citation' ) {\n\t\t\treturn cloneElement( child, {\n\t\t\t\tstyle: {\n\t\t\t\t\t...styles.wpBlockQuoteCitation,\n\t\t\t\t\t...colorStyle,\n\t\t\t\t},\n\t\t\t} );\n\t\t}\n\t\tif ( child && child.props.identifier === 'value' ) {\n\t\t\treturn cloneElement( child, {\n\t\t\t\ttagsToEliminate: [ 'div' ],\n\t\t\t\tstyle: colorStyle,\n\t\t\t} );\n\t\t}\n\t\treturn child;\n\t} );\n\treturn (\n\t\t<View ref={ ref } style={ blockQuoteStyle }>\n\t\t\t{ newChildren }\n\t\t</View>\n\t);\n} );\n"]}
1
+ {"version":3,"sources":["@wordpress/primitives/src/block-quotation/index.native.js"],"names":["View","Children","cloneElement","forwardRef","usePreferredColorSchemeStyle","styles","BlockQuotation","props","ref","style","blockQuoteStyle","wpBlockQuoteLight","wpBlockQuoteDark","color","borderLeftColor","backgroundColor","paddingWithBackground","colorStyle","newChildren","map","children","child","identifier","wpBlockQuoteCitation","tagsToEliminate"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,IAAT,QAAqB,cAArB;AACA;AACA;AACA;;AACA,SAASC,QAAT,EAAmBC,YAAnB,EAAiCC,UAAjC,QAAmD,oBAAnD;AACA,SAASC,4BAAT,QAA6C,oBAA7C;AACA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,cAAnB;AAEA,OAAO,MAAMC,cAAc,GAAGH,UAAU,CAAE,CAAE,EAAE,GAAGI;AAAL,CAAF,EAAgBC,GAAhB,KAAyB;AAClE,QAAM;AAAEC,IAAAA;AAAF,MAAYF,KAAlB;AAEA,QAAMG,eAAe,GAAG,CACvBN,4BAA4B,CAC3BC,MAAM,CAACM,iBADoB,EAE3BN,MAAM,CAACO,gBAFoB,CADL,EAKvBH,KAAK,EAAEI,KAAP,IAAgB;AACfC,IAAAA,eAAe,EAAEL,KAAK,CAACI;AADR,GALO,EAQvBJ,KARuB,EASvBA,KAAK,EAAEM,eAAP,IAA0BV,MAAM,CAACW,qBATV,CAAxB;AAWA,QAAMC,UAAU,GAAGR,KAAK,EAAEI,KAAP,GAAe;AAAEA,IAAAA,KAAK,EAAEJ,KAAK,CAACI;AAAf,GAAf,GAAwC,EAA3D;AAEA,QAAMK,WAAW,GAAGjB,QAAQ,CAACkB,GAAT,CAAcZ,KAAK,CAACa,QAApB,EAAgCC,KAAF,IAAa;AAC9D,QAAKA,KAAK,IAAIA,KAAK,CAACd,KAAN,CAAYe,UAAZ,KAA2B,UAAzC,EAAsD;AACrD,aAAOpB,YAAY,CAAEmB,KAAF,EAAS;AAC3BZ,QAAAA,KAAK,EAAE,EACN,GAAGJ,MAAM,CAACkB,oBADJ;AAEN,aAAGN;AAFG;AADoB,OAAT,CAAnB;AAMA;;AACD,QAAKI,KAAK,IAAIA,KAAK,CAACd,KAAN,CAAYe,UAAZ,KAA2B,OAAzC,EAAmD;AAClD,aAAOpB,YAAY,CAAEmB,KAAF,EAAS;AAC3BG,QAAAA,eAAe,EAAE,CAAE,KAAF,CADU;AAE3Bf,QAAAA,KAAK,EAAEQ;AAFoB,OAAT,CAAnB;AAIA;;AACD,WAAOI,KAAP;AACA,GAhBmB,CAApB;AAiBA,SACC,cAAC,IAAD;AAAM,IAAA,GAAG,EAAGb,GAAZ;AAAkB,IAAA,KAAK,EAAGE;AAA1B,KACGQ,WADH,CADD;AAKA,CAtCuC,CAAjC","sourcesContent":["/**\n * External dependencies\n */\nimport { View } from 'react-native';\n/**\n * WordPress dependencies\n */\nimport { Children, cloneElement, forwardRef } from '@wordpress/element';\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\n\nexport const BlockQuotation = forwardRef( ( { ...props }, ref ) => {\n\tconst { style } = props;\n\n\tconst blockQuoteStyle = [\n\t\tusePreferredColorSchemeStyle(\n\t\t\tstyles.wpBlockQuoteLight,\n\t\t\tstyles.wpBlockQuoteDark\n\t\t),\n\t\tstyle?.color && {\n\t\t\tborderLeftColor: style.color,\n\t\t},\n\t\tstyle,\n\t\tstyle?.backgroundColor && styles.paddingWithBackground,\n\t];\n\tconst colorStyle = style?.color ? { color: style.color } : {};\n\n\tconst newChildren = Children.map( props.children, ( child ) => {\n\t\tif ( child && child.props.identifier === 'citation' ) {\n\t\t\treturn cloneElement( child, {\n\t\t\t\tstyle: {\n\t\t\t\t\t...styles.wpBlockQuoteCitation,\n\t\t\t\t\t...colorStyle,\n\t\t\t\t},\n\t\t\t} );\n\t\t}\n\t\tif ( child && child.props.identifier === 'value' ) {\n\t\t\treturn cloneElement( child, {\n\t\t\t\ttagsToEliminate: [ 'div' ],\n\t\t\t\tstyle: colorStyle,\n\t\t\t} );\n\t\t}\n\t\treturn child;\n\t} );\n\treturn (\n\t\t<View ref={ ref } style={ blockQuoteStyle }>\n\t\t\t{ newChildren }\n\t\t</View>\n\t);\n} );\n"]}
@@ -1,10 +1,9 @@
1
- import _extends from "@babel/runtime/helpers/esm/extends";
2
1
  import { createElement } from "@wordpress/element";
3
2
 
4
3
  /**
5
4
  * External dependencies
6
5
  */
7
- import Hr from 'react-native-hr';
6
+ import { Text, View } from 'react-native';
8
7
  /**
9
8
  * WordPress dependencies
10
9
  */
@@ -16,17 +15,41 @@ import { withPreferredColorScheme } from '@wordpress/compose';
16
15
 
17
16
  import styles from './styles.scss';
18
17
 
19
- const HR = _ref => {
20
- let {
21
- getStylesFromColorScheme,
18
+ const HR = ({
19
+ getStylesFromColorScheme,
20
+ lineStyle,
21
+ marginLeft,
22
+ marginRight,
23
+ textStyle,
24
+ text,
25
+ ...props
26
+ }) => {
27
+ const renderLine = key => createElement(View, {
28
+ key: key,
29
+ style: getStylesFromColorScheme(styles.line, styles.lineDark)
30
+ });
31
+
32
+ const renderText = key => createElement(View, {
33
+ key: key
34
+ }, createElement(Text, {
35
+ style: [styles.text, textStyle]
36
+ }, text));
37
+
38
+ const renderInner = () => {
39
+ if (!text) {
40
+ return renderLine();
41
+ }
42
+
43
+ return [renderLine(1), renderText(2), renderLine(3)];
44
+ };
45
+
46
+ return createElement(View, {
47
+ style: [styles.container, {
48
+ marginLeft,
49
+ marginRight
50
+ }, props.style],
22
51
  ...props
23
- } = _ref;
24
- const lineStyle = getStylesFromColorScheme(styles.line, styles.lineDark);
25
- return createElement(Hr, _extends({}, props, {
26
- lineStyle: [lineStyle, props.lineStyle],
27
- marginLeft: 0,
28
- marginRight: 0
29
- }));
52
+ }, renderInner());
30
53
  };
31
54
 
32
55
  export const HorizontalRule = withPreferredColorScheme(HR);
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/primitives/src/horizontal-rule/index.native.js"],"names":["Hr","withPreferredColorScheme","styles","HR","getStylesFromColorScheme","props","lineStyle","line","lineDark","HorizontalRule"],"mappings":";;;AAAA;AACA;AACA;AACA,OAAOA,EAAP,MAAe,iBAAf;AAEA;AACA;AACA;;AACA,SAASC,wBAAT,QAAyC,oBAAzC;AAEA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,eAAnB;;AAEA,MAAMC,EAAE,GAAG,QAA8C;AAAA,MAA5C;AAAEC,IAAAA,wBAAF;AAA4B,OAAGC;AAA/B,GAA4C;AACxD,QAAMC,SAAS,GAAGF,wBAAwB,CAAEF,MAAM,CAACK,IAAT,EAAeL,MAAM,CAACM,QAAtB,CAA1C;AAEA,SACC,cAAC,EAAD,eACMH,KADN;AAEC,IAAA,SAAS,EAAG,CAAEC,SAAF,EAAaD,KAAK,CAACC,SAAnB,CAFb;AAGC,IAAA,UAAU,EAAG,CAHd;AAIC,IAAA,WAAW,EAAG;AAJf,KADD;AAQA,CAXD;;AAaA,OAAO,MAAMG,cAAc,GAAGR,wBAAwB,CAAEE,EAAF,CAA/C","sourcesContent":["/**\n * External dependencies\n */\nimport Hr from 'react-native-hr';\n\n/**\n * WordPress dependencies\n */\nimport { withPreferredColorScheme } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport styles from './styles.scss';\n\nconst HR = ( { getStylesFromColorScheme, ...props } ) => {\n\tconst lineStyle = getStylesFromColorScheme( styles.line, styles.lineDark );\n\n\treturn (\n\t\t<Hr\n\t\t\t{ ...props }\n\t\t\tlineStyle={ [ lineStyle, props.lineStyle ] }\n\t\t\tmarginLeft={ 0 }\n\t\t\tmarginRight={ 0 }\n\t\t/>\n\t);\n};\n\nexport const HorizontalRule = withPreferredColorScheme( HR );\n"]}
1
+ {"version":3,"sources":["@wordpress/primitives/src/horizontal-rule/index.native.js"],"names":["Text","View","withPreferredColorScheme","styles","HR","getStylesFromColorScheme","lineStyle","marginLeft","marginRight","textStyle","text","props","renderLine","key","line","lineDark","renderText","renderInner","container","style","HorizontalRule"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,IAAT,EAAeC,IAAf,QAA2B,cAA3B;AAEA;AACA;AACA;;AACA,SAASC,wBAAT,QAAyC,oBAAzC;AAEA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,eAAnB;;AAEA,MAAMC,EAAE,GAAG,CAAE;AACZC,EAAAA,wBADY;AAEZC,EAAAA,SAFY;AAGZC,EAAAA,UAHY;AAIZC,EAAAA,WAJY;AAKZC,EAAAA,SALY;AAMZC,EAAAA,IANY;AAOZ,KAAGC;AAPS,CAAF,KAQJ;AACN,QAAMC,UAAU,GAAKC,GAAF,IAClB,cAAC,IAAD;AACC,IAAA,GAAG,EAAGA,GADP;AAEC,IAAA,KAAK,EAAGR,wBAAwB,CAAEF,MAAM,CAACW,IAAT,EAAeX,MAAM,CAACY,QAAtB;AAFjC,IADD;;AAOA,QAAMC,UAAU,GAAKH,GAAF,IAClB,cAAC,IAAD;AAAM,IAAA,GAAG,EAAGA;AAAZ,KACC,cAAC,IAAD;AAAM,IAAA,KAAK,EAAG,CAAEV,MAAM,CAACO,IAAT,EAAeD,SAAf;AAAd,KAA6CC,IAA7C,CADD,CADD;;AAMA,QAAMO,WAAW,GAAG,MAAM;AACzB,QAAK,CAAEP,IAAP,EAAc;AACb,aAAOE,UAAU,EAAjB;AACA;;AACD,WAAO,CAAEA,UAAU,CAAE,CAAF,CAAZ,EAAmBI,UAAU,CAAE,CAAF,CAA7B,EAAoCJ,UAAU,CAAE,CAAF,CAA9C,CAAP;AACA,GALD;;AAOA,SACC,cAAC,IAAD;AACC,IAAA,KAAK,EAAG,CACPT,MAAM,CAACe,SADA,EAEP;AAAEX,MAAAA,UAAF;AAAcC,MAAAA;AAAd,KAFO,EAGPG,KAAK,CAACQ,KAHC,CADT;AAAA,OAMMR;AANN,KAQGM,WAAW,EARd,CADD;AAYA,CAzCD;;AA2CA,OAAO,MAAMG,cAAc,GAAGlB,wBAAwB,CAAEE,EAAF,CAA/C","sourcesContent":["/**\n * External dependencies\n */\nimport { Text, View } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { withPreferredColorScheme } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport styles from './styles.scss';\n\nconst HR = ( {\n\tgetStylesFromColorScheme,\n\tlineStyle,\n\tmarginLeft,\n\tmarginRight,\n\ttextStyle,\n\ttext,\n\t...props\n} ) => {\n\tconst renderLine = ( key ) => (\n\t\t<View\n\t\t\tkey={ key }\n\t\t\tstyle={ getStylesFromColorScheme( styles.line, styles.lineDark ) }\n\t\t/>\n\t);\n\n\tconst renderText = ( key ) => (\n\t\t<View key={ key }>\n\t\t\t<Text style={ [ styles.text, textStyle ] }>{ text }</Text>\n\t\t</View>\n\t);\n\n\tconst renderInner = () => {\n\t\tif ( ! text ) {\n\t\t\treturn renderLine();\n\t\t}\n\t\treturn [ renderLine( 1 ), renderText( 2 ), renderLine( 3 ) ];\n\t};\n\n\treturn (\n\t\t<View\n\t\t\tstyle={ [\n\t\t\t\tstyles.container,\n\t\t\t\t{ marginLeft, marginRight },\n\t\t\t\tprops.style,\n\t\t\t] }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t{ renderInner() }\n\t\t</View>\n\t);\n};\n\nexport const HorizontalRule = withPreferredColorScheme( HR );\n"]}
@@ -87,12 +87,11 @@ export const Stop = props => createElement('stop', props);
87
87
  * @return {JSX.Element} Stop component
88
88
  */
89
89
 
90
- export const SVG = _ref => {
91
- let {
92
- className,
93
- isPressed,
94
- ...props
95
- } = _ref;
90
+ export const SVG = ({
91
+ className,
92
+ isPressed,
93
+ ...props
94
+ }) => {
96
95
  const appliedProps = { ...props,
97
96
  className: classnames(className, {
98
97
  'is-pressed': isPressed
@@ -102,6 +101,7 @@ export const SVG = _ref => {
102
101
  }; // Disable reason: We need to have a way to render HTML tag for web.
103
102
  // eslint-disable-next-line react/forbid-elements
104
103
 
105
- return createElement("svg", appliedProps);
104
+ return createElement("svg", { ...appliedProps
105
+ });
106
106
  };
107
107
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/primitives/src/svg/index.js"],"names":["classnames","createElement","Circle","props","G","Line","Path","Polygon","Rect","Defs","RadialGradient","LinearGradient","Stop","SVG","className","isPressed","appliedProps","undefined","focusable"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,aAAT,QAA8B,oBAA9B;AAEA;;AAEA;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMC,MAAM,GAAKC,KAAF,IAAaF,aAAa,CAAE,QAAF,EAAYE,KAAZ,CAAzC;AAEP;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMC,CAAC,GAAKD,KAAF,IAAaF,aAAa,CAAE,GAAF,EAAOE,KAAP,CAApC;AAEP;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAME,IAAI,GAAKF,KAAF,IAAaF,aAAa,CAAE,MAAF,EAAUE,KAAV,CAAvC;AAEP;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMG,IAAI,GAAKH,KAAF,IAAaF,aAAa,CAAE,MAAF,EAAUE,KAAV,CAAvC;AAEP;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMI,OAAO,GAAKJ,KAAF,IAAaF,aAAa,CAAE,SAAF,EAAaE,KAAb,CAA1C;AAEP;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMK,IAAI,GAAKL,KAAF,IAAaF,aAAa,CAAE,MAAF,EAAUE,KAAV,CAAvC;AAEP;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMM,IAAI,GAAKN,KAAF,IAAaF,aAAa,CAAE,MAAF,EAAUE,KAAV,CAAvC;AAEP;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMO,cAAc,GAAKP,KAAF,IAC7BF,aAAa,CAAE,gBAAF,EAAoBE,KAApB,CADP;AAGP;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMQ,cAAc,GAAKR,KAAF,IAC7BF,aAAa,CAAE,gBAAF,EAAoBE,KAApB,CADP;AAGP;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMS,IAAI,GAAKT,KAAF,IAAaF,aAAa,CAAE,MAAF,EAAUE,KAAV,CAAvC;AAEP;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMU,GAAG,GAAG,QAA0C;AAAA,MAAxC;AAAEC,IAAAA,SAAF;AAAaC,IAAAA,SAAb;AAAwB,OAAGZ;AAA3B,GAAwC;AAC5D,QAAMa,YAAY,GAAG,EACpB,GAAGb,KADiB;AAEpBW,IAAAA,SAAS,EACRd,UAAU,CAAEc,SAAF,EAAa;AAAE,oBAAcC;AAAhB,KAAb,CAAV,IAAwDE,SAHrC;AAIpB,mBAAe,IAJK;AAKpBC,IAAAA,SAAS,EAAE;AALS,GAArB,CAD4D,CAS5D;AACA;;AACA,SAAO,qBAAUF,YAAV,CAAP;AACA,CAZM","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { createElement } from '@wordpress/element';\n\n/** @typedef {{isPressed?: boolean} & import('react').ComponentPropsWithoutRef<'svg'>} SVGProps */\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'circle'>} props\n *\n * @return {JSX.Element} Circle component\n */\nexport const Circle = ( props ) => createElement( 'circle', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'g'>} props\n *\n * @return {JSX.Element} G component\n */\nexport const G = ( props ) => createElement( 'g', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'line'>} props\n *\n * @return {JSX.Element} Path component\n */\nexport const Line = ( props ) => createElement( 'line', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'path'>} props\n *\n * @return {JSX.Element} Path component\n */\nexport const Path = ( props ) => createElement( 'path', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'polygon'>} props\n *\n * @return {JSX.Element} Polygon component\n */\nexport const Polygon = ( props ) => createElement( 'polygon', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'rect'>} props\n *\n * @return {JSX.Element} Rect component\n */\nexport const Rect = ( props ) => createElement( 'rect', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'defs'>} props\n *\n * @return {JSX.Element} Defs component\n */\nexport const Defs = ( props ) => createElement( 'defs', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'radialGradient'>} props\n *\n * @return {JSX.Element} RadialGradient component\n */\nexport const RadialGradient = ( props ) =>\n\tcreateElement( 'radialGradient', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'linearGradient'>} props\n *\n * @return {JSX.Element} LinearGradient component\n */\nexport const LinearGradient = ( props ) =>\n\tcreateElement( 'linearGradient', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'stop'>} props\n *\n * @return {JSX.Element} Stop component\n */\nexport const Stop = ( props ) => createElement( 'stop', props );\n\n/**\n *\n * @param {SVGProps} props isPressed indicates whether the SVG should appear as pressed.\n * Other props will be passed through to svg component.\n *\n * @return {JSX.Element} Stop component\n */\nexport const SVG = ( { className, isPressed, ...props } ) => {\n\tconst appliedProps = {\n\t\t...props,\n\t\tclassName:\n\t\t\tclassnames( className, { 'is-pressed': isPressed } ) || undefined,\n\t\t'aria-hidden': true,\n\t\tfocusable: false,\n\t};\n\n\t// Disable reason: We need to have a way to render HTML tag for web.\n\t// eslint-disable-next-line react/forbid-elements\n\treturn <svg { ...appliedProps } />;\n};\n"]}
1
+ {"version":3,"sources":["@wordpress/primitives/src/svg/index.js"],"names":["classnames","createElement","Circle","props","G","Line","Path","Polygon","Rect","Defs","RadialGradient","LinearGradient","Stop","SVG","className","isPressed","appliedProps","undefined","focusable"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,aAAT,QAA8B,oBAA9B;AAEA;;AAEA;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMC,MAAM,GAAKC,KAAF,IAAaF,aAAa,CAAE,QAAF,EAAYE,KAAZ,CAAzC;AAEP;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMC,CAAC,GAAKD,KAAF,IAAaF,aAAa,CAAE,GAAF,EAAOE,KAAP,CAApC;AAEP;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAME,IAAI,GAAKF,KAAF,IAAaF,aAAa,CAAE,MAAF,EAAUE,KAAV,CAAvC;AAEP;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMG,IAAI,GAAKH,KAAF,IAAaF,aAAa,CAAE,MAAF,EAAUE,KAAV,CAAvC;AAEP;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMI,OAAO,GAAKJ,KAAF,IAAaF,aAAa,CAAE,SAAF,EAAaE,KAAb,CAA1C;AAEP;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMK,IAAI,GAAKL,KAAF,IAAaF,aAAa,CAAE,MAAF,EAAUE,KAAV,CAAvC;AAEP;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMM,IAAI,GAAKN,KAAF,IAAaF,aAAa,CAAE,MAAF,EAAUE,KAAV,CAAvC;AAEP;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMO,cAAc,GAAKP,KAAF,IAC7BF,aAAa,CAAE,gBAAF,EAAoBE,KAApB,CADP;AAGP;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMQ,cAAc,GAAKR,KAAF,IAC7BF,aAAa,CAAE,gBAAF,EAAoBE,KAApB,CADP;AAGP;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMS,IAAI,GAAKT,KAAF,IAAaF,aAAa,CAAE,MAAF,EAAUE,KAAV,CAAvC;AAEP;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMU,GAAG,GAAG,CAAE;AAAEC,EAAAA,SAAF;AAAaC,EAAAA,SAAb;AAAwB,KAAGZ;AAA3B,CAAF,KAA0C;AAC5D,QAAMa,YAAY,GAAG,EACpB,GAAGb,KADiB;AAEpBW,IAAAA,SAAS,EACRd,UAAU,CAAEc,SAAF,EAAa;AAAE,oBAAcC;AAAhB,KAAb,CAAV,IAAwDE,SAHrC;AAIpB,mBAAe,IAJK;AAKpBC,IAAAA,SAAS,EAAE;AALS,GAArB,CAD4D,CAS5D;AACA;;AACA,SAAO,0BAAUF;AAAV,IAAP;AACA,CAZM","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { createElement } from '@wordpress/element';\n\n/** @typedef {{isPressed?: boolean} & import('react').ComponentPropsWithoutRef<'svg'>} SVGProps */\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'circle'>} props\n *\n * @return {JSX.Element} Circle component\n */\nexport const Circle = ( props ) => createElement( 'circle', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'g'>} props\n *\n * @return {JSX.Element} G component\n */\nexport const G = ( props ) => createElement( 'g', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'line'>} props\n *\n * @return {JSX.Element} Path component\n */\nexport const Line = ( props ) => createElement( 'line', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'path'>} props\n *\n * @return {JSX.Element} Path component\n */\nexport const Path = ( props ) => createElement( 'path', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'polygon'>} props\n *\n * @return {JSX.Element} Polygon component\n */\nexport const Polygon = ( props ) => createElement( 'polygon', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'rect'>} props\n *\n * @return {JSX.Element} Rect component\n */\nexport const Rect = ( props ) => createElement( 'rect', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'defs'>} props\n *\n * @return {JSX.Element} Defs component\n */\nexport const Defs = ( props ) => createElement( 'defs', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'radialGradient'>} props\n *\n * @return {JSX.Element} RadialGradient component\n */\nexport const RadialGradient = ( props ) =>\n\tcreateElement( 'radialGradient', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'linearGradient'>} props\n *\n * @return {JSX.Element} LinearGradient component\n */\nexport const LinearGradient = ( props ) =>\n\tcreateElement( 'linearGradient', props );\n\n/**\n * @param {import('react').ComponentPropsWithoutRef<'stop'>} props\n *\n * @return {JSX.Element} Stop component\n */\nexport const Stop = ( props ) => createElement( 'stop', props );\n\n/**\n *\n * @param {SVGProps} props isPressed indicates whether the SVG should appear as pressed.\n * Other props will be passed through to svg component.\n *\n * @return {JSX.Element} Stop component\n */\nexport const SVG = ( { className, isPressed, ...props } ) => {\n\tconst appliedProps = {\n\t\t...props,\n\t\tclassName:\n\t\t\tclassnames( className, { 'is-pressed': isPressed } ) || undefined,\n\t\t'aria-hidden': true,\n\t\tfocusable: false,\n\t};\n\n\t// Disable reason: We need to have a way to render HTML tag for web.\n\t// eslint-disable-next-line react/forbid-elements\n\treturn <svg { ...appliedProps } />;\n};\n"]}
@@ -1,4 +1,3 @@
1
- import _extends from "@babel/runtime/helpers/esm/extends";
2
1
  import { createElement } from "@wordpress/element";
3
2
 
4
3
  /**
@@ -17,16 +16,16 @@ import { forwardRef } from '@wordpress/element';
17
16
 
18
17
  import styles from './style.scss';
19
18
  export { Circle, G, Path, Polygon, Rect, Defs, RadialGradient, LinearGradient, Stop, Line } from 'react-native-svg';
20
- const AnimatedSvg = Animated.createAnimatedComponent(forwardRef((props, ref) => createElement(Svg, _extends({
21
- ref: ref
22
- }, props))));
23
- export const SVG = _ref => {
24
- let {
25
- className = '',
26
- isPressed,
27
- animated = false,
28
- ...props
29
- } = _ref;
19
+ const AnimatedSvg = Animated.createAnimatedComponent(forwardRef((props, ref) => createElement(Svg, {
20
+ ref: ref,
21
+ ...props
22
+ })));
23
+ export const SVG = ({
24
+ className = '',
25
+ isPressed,
26
+ animated = false,
27
+ ...props
28
+ }) => {
30
29
  const colorScheme = props.colorScheme || 'light';
31
30
  const stylesFromClasses = className.split(' ').map(element => styles[element]).filter(Boolean);
32
31
  const defaultStyle = isPressed ? styles['is-pressed'] : styles['components-toolbar__control-' + colorScheme];
@@ -41,10 +40,11 @@ export const SVG = _ref => {
41
40
  };
42
41
  const SvgWrapper = animated ? AnimatedSvg : Svg;
43
42
  return createElement(SvgWrapper // We want to re-render when style color is changed.
44
- , _extends({
43
+ , {
45
44
  key: appliedProps.style.color,
46
45
  height: "100%",
47
- width: "100%"
48
- }, appliedProps));
46
+ width: "100%",
47
+ ...appliedProps
48
+ });
49
49
  };
50
50
  //# sourceMappingURL=index.native.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/primitives/src/svg/index.native.js"],"names":["Svg","Animated","forwardRef","styles","Circle","G","Path","Polygon","Rect","Defs","RadialGradient","LinearGradient","Stop","Line","AnimatedSvg","createAnimatedComponent","props","ref","SVG","className","isPressed","animated","colorScheme","stylesFromClasses","split","map","element","filter","Boolean","defaultStyle","propStyle","Array","isArray","style","reduce","acc","el","styleValues","Object","assign","appliedProps","SvgWrapper","color"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,GAAT,QAAoB,kBAApB;AACA,SAASC,QAAT,QAAyB,cAAzB;AAEA;AACA;AACA;;AACA,SAASC,UAAT,QAA2B,oBAA3B;AAEA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,cAAnB;AAEA,SACCC,MADD,EAECC,CAFD,EAGCC,IAHD,EAICC,OAJD,EAKCC,IALD,EAMCC,IAND,EAOCC,cAPD,EAQCC,cARD,EASCC,IATD,EAUCC,IAVD,QAWO,kBAXP;AAaA,MAAMC,WAAW,GAAGb,QAAQ,CAACc,uBAAT,CACnBb,UAAU,CAAE,CAAEc,KAAF,EAASC,GAAT,KAAkB,cAAC,GAAD;AAAK,EAAA,GAAG,EAAGA;AAAX,GAAsBD,KAAtB,EAApB,CADS,CAApB;AAIA,OAAO,MAAME,GAAG,GAAG,QAKZ;AAAA,MALc;AACpBC,IAAAA,SAAS,GAAG,EADQ;AAEpBC,IAAAA,SAFoB;AAGpBC,IAAAA,QAAQ,GAAG,KAHS;AAIpB,OAAGL;AAJiB,GAKd;AACN,QAAMM,WAAW,GAAGN,KAAK,CAACM,WAAN,IAAqB,OAAzC;AACA,QAAMC,iBAAiB,GAAGJ,SAAS,CACjCK,KADwB,CACjB,GADiB,EAExBC,GAFwB,CAEjBC,OAAF,IAAevB,MAAM,CAAEuB,OAAF,CAFF,EAGxBC,MAHwB,CAGhBC,OAHgB,CAA1B;AAIA,QAAMC,YAAY,GAAGT,SAAS,GAC3BjB,MAAM,CAAE,YAAF,CADqB,GAE3BA,MAAM,CAAE,iCAAiCmB,WAAnC,CAFT;AAGA,QAAMQ,SAAS,GAAGC,KAAK,CAACC,OAAN,CAAehB,KAAK,CAACiB,KAArB,IACfjB,KAAK,CAACiB,KAAN,CAAYC,MAAZ,CAAoB,CAAEC,GAAF,EAAOC,EAAP,KAAe;AACnC,WAAO,EAAE,GAAGD,GAAL;AAAU,SAAGC;AAAb,KAAP;AACC,GAFD,EAEG,EAFH,CADe,GAIfpB,KAAK,CAACiB,KAJT;AAKA,QAAMI,WAAW,GAAGC,MAAM,CAACC,MAAP,CACnB,EADmB,EAEnBV,YAFmB,EAGnBC,SAHmB,EAInB,GAAGP,iBAJgB,CAApB;AAOA,QAAMiB,YAAY,GAAG,EAAE,GAAGxB,KAAL;AAAYiB,IAAAA,KAAK,EAAEI;AAAnB,GAArB;AAEA,QAAMI,UAAU,GAAGpB,QAAQ,GAAGP,WAAH,GAAiBd,GAA5C;AAEA,SACC,cAAC,UAAD,CACC;AADD;AAEC,IAAA,GAAG,EAAGwC,YAAY,CAACP,KAAb,CAAmBS,KAF1B;AAGC,IAAA,MAAM,EAAC,MAHR;AAIC,IAAA,KAAK,EAAC;AAJP,KAKMF,YALN,EADD;AASA,CAvCM","sourcesContent":["/**\n * External dependencies\n */\nimport { Svg } from 'react-native-svg';\nimport { Animated } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\n\nexport {\n\tCircle,\n\tG,\n\tPath,\n\tPolygon,\n\tRect,\n\tDefs,\n\tRadialGradient,\n\tLinearGradient,\n\tStop,\n\tLine,\n} from 'react-native-svg';\n\nconst AnimatedSvg = Animated.createAnimatedComponent(\n\tforwardRef( ( props, ref ) => <Svg ref={ ref } { ...props } /> )\n);\n\nexport const SVG = ( {\n\tclassName = '',\n\tisPressed,\n\tanimated = false,\n\t...props\n} ) => {\n\tconst colorScheme = props.colorScheme || 'light';\n\tconst stylesFromClasses = className\n\t\t.split( ' ' )\n\t\t.map( ( element ) => styles[ element ] )\n\t\t.filter( Boolean );\n\tconst defaultStyle = isPressed\n\t\t? styles[ 'is-pressed' ]\n\t\t: styles[ 'components-toolbar__control-' + colorScheme ];\n\tconst propStyle = Array.isArray( props.style )\n\t\t? props.style.reduce( ( acc, el ) => {\n\t\t\t\treturn { ...acc, ...el };\n\t\t }, {} )\n\t\t: props.style;\n\tconst styleValues = Object.assign(\n\t\t{},\n\t\tdefaultStyle,\n\t\tpropStyle,\n\t\t...stylesFromClasses\n\t);\n\n\tconst appliedProps = { ...props, style: styleValues };\n\n\tconst SvgWrapper = animated ? AnimatedSvg : Svg;\n\n\treturn (\n\t\t<SvgWrapper\n\t\t\t// We want to re-render when style color is changed.\n\t\t\tkey={ appliedProps.style.color }\n\t\t\theight=\"100%\"\n\t\t\twidth=\"100%\"\n\t\t\t{ ...appliedProps }\n\t\t/>\n\t);\n};\n"]}
1
+ {"version":3,"sources":["@wordpress/primitives/src/svg/index.native.js"],"names":["Svg","Animated","forwardRef","styles","Circle","G","Path","Polygon","Rect","Defs","RadialGradient","LinearGradient","Stop","Line","AnimatedSvg","createAnimatedComponent","props","ref","SVG","className","isPressed","animated","colorScheme","stylesFromClasses","split","map","element","filter","Boolean","defaultStyle","propStyle","Array","isArray","style","reduce","acc","el","styleValues","Object","assign","appliedProps","SvgWrapper","color"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,GAAT,QAAoB,kBAApB;AACA,SAASC,QAAT,QAAyB,cAAzB;AAEA;AACA;AACA;;AACA,SAASC,UAAT,QAA2B,oBAA3B;AAEA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,cAAnB;AAEA,SACCC,MADD,EAECC,CAFD,EAGCC,IAHD,EAICC,OAJD,EAKCC,IALD,EAMCC,IAND,EAOCC,cAPD,EAQCC,cARD,EASCC,IATD,EAUCC,IAVD,QAWO,kBAXP;AAaA,MAAMC,WAAW,GAAGb,QAAQ,CAACc,uBAAT,CACnBb,UAAU,CAAE,CAAEc,KAAF,EAASC,GAAT,KAAkB,cAAC,GAAD;AAAK,EAAA,GAAG,EAAGA,GAAX;AAAA,KAAsBD;AAAtB,EAApB,CADS,CAApB;AAIA,OAAO,MAAME,GAAG,GAAG,CAAE;AACpBC,EAAAA,SAAS,GAAG,EADQ;AAEpBC,EAAAA,SAFoB;AAGpBC,EAAAA,QAAQ,GAAG,KAHS;AAIpB,KAAGL;AAJiB,CAAF,KAKZ;AACN,QAAMM,WAAW,GAAGN,KAAK,CAACM,WAAN,IAAqB,OAAzC;AACA,QAAMC,iBAAiB,GAAGJ,SAAS,CACjCK,KADwB,CACjB,GADiB,EAExBC,GAFwB,CAEjBC,OAAF,IAAevB,MAAM,CAAEuB,OAAF,CAFF,EAGxBC,MAHwB,CAGhBC,OAHgB,CAA1B;AAIA,QAAMC,YAAY,GAAGT,SAAS,GAC3BjB,MAAM,CAAE,YAAF,CADqB,GAE3BA,MAAM,CAAE,iCAAiCmB,WAAnC,CAFT;AAGA,QAAMQ,SAAS,GAAGC,KAAK,CAACC,OAAN,CAAehB,KAAK,CAACiB,KAArB,IACfjB,KAAK,CAACiB,KAAN,CAAYC,MAAZ,CAAoB,CAAEC,GAAF,EAAOC,EAAP,KAAe;AACnC,WAAO,EAAE,GAAGD,GAAL;AAAU,SAAGC;AAAb,KAAP;AACC,GAFD,EAEG,EAFH,CADe,GAIfpB,KAAK,CAACiB,KAJT;AAKA,QAAMI,WAAW,GAAGC,MAAM,CAACC,MAAP,CACnB,EADmB,EAEnBV,YAFmB,EAGnBC,SAHmB,EAInB,GAAGP,iBAJgB,CAApB;AAOA,QAAMiB,YAAY,GAAG,EAAE,GAAGxB,KAAL;AAAYiB,IAAAA,KAAK,EAAEI;AAAnB,GAArB;AAEA,QAAMI,UAAU,GAAGpB,QAAQ,GAAGP,WAAH,GAAiBd,GAA5C;AAEA,SACC,cAAC,UAAD,CACC;AADD;AAEC,IAAA,GAAG,EAAGwC,YAAY,CAACP,KAAb,CAAmBS,KAF1B;AAGC,IAAA,MAAM,EAAC,MAHR;AAIC,IAAA,KAAK,EAAC,MAJP;AAAA,OAKMF;AALN,IADD;AASA,CAvCM","sourcesContent":["/**\n * External dependencies\n */\nimport { Svg } from 'react-native-svg';\nimport { Animated } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\n\nexport {\n\tCircle,\n\tG,\n\tPath,\n\tPolygon,\n\tRect,\n\tDefs,\n\tRadialGradient,\n\tLinearGradient,\n\tStop,\n\tLine,\n} from 'react-native-svg';\n\nconst AnimatedSvg = Animated.createAnimatedComponent(\n\tforwardRef( ( props, ref ) => <Svg ref={ ref } { ...props } /> )\n);\n\nexport const SVG = ( {\n\tclassName = '',\n\tisPressed,\n\tanimated = false,\n\t...props\n} ) => {\n\tconst colorScheme = props.colorScheme || 'light';\n\tconst stylesFromClasses = className\n\t\t.split( ' ' )\n\t\t.map( ( element ) => styles[ element ] )\n\t\t.filter( Boolean );\n\tconst defaultStyle = isPressed\n\t\t? styles[ 'is-pressed' ]\n\t\t: styles[ 'components-toolbar__control-' + colorScheme ];\n\tconst propStyle = Array.isArray( props.style )\n\t\t? props.style.reduce( ( acc, el ) => {\n\t\t\t\treturn { ...acc, ...el };\n\t\t }, {} )\n\t\t: props.style;\n\tconst styleValues = Object.assign(\n\t\t{},\n\t\tdefaultStyle,\n\t\tpropStyle,\n\t\t...stylesFromClasses\n\t);\n\n\tconst appliedProps = { ...props, style: styleValues };\n\n\tconst SvgWrapper = animated ? AnimatedSvg : Svg;\n\n\treturn (\n\t\t<SvgWrapper\n\t\t\t// We want to re-render when style color is changed.\n\t\t\tkey={ appliedProps.style.color }\n\t\t\theight=\"100%\"\n\t\t\twidth=\"100%\"\n\t\t\t{ ...appliedProps }\n\t\t/>\n\t);\n};\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wordpress/primitives",
3
- "version": "3.32.0",
3
+ "version": "3.33.1",
4
4
  "description": "WordPress cross-platform primitives.",
5
5
  "author": "The WordPress Contributors",
6
6
  "license": "GPL-2.0-or-later",
@@ -31,11 +31,11 @@
31
31
  "types": "build-types",
32
32
  "dependencies": {
33
33
  "@babel/runtime": "^7.16.0",
34
- "@wordpress/element": "^5.11.0",
34
+ "@wordpress/element": "^5.12.1",
35
35
  "classnames": "^2.3.1"
36
36
  },
37
37
  "publishConfig": {
38
38
  "access": "public"
39
39
  },
40
- "gitHead": "c7c79cb11b677adcbf06cf5f8cfb6c5ec1699f19"
40
+ "gitHead": "ce5639111c30763dbdf07f40eeb136ea6030ecf1"
41
41
  }
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * External dependencies
3
3
  */
4
- import Hr from 'react-native-hr';
4
+ import { Text, View } from 'react-native';
5
5
 
6
6
  /**
7
7
  * WordPress dependencies
@@ -13,16 +13,46 @@ import { withPreferredColorScheme } from '@wordpress/compose';
13
13
  */
14
14
  import styles from './styles.scss';
15
15
 
16
- const HR = ( { getStylesFromColorScheme, ...props } ) => {
17
- const lineStyle = getStylesFromColorScheme( styles.line, styles.lineDark );
16
+ const HR = ( {
17
+ getStylesFromColorScheme,
18
+ lineStyle,
19
+ marginLeft,
20
+ marginRight,
21
+ textStyle,
22
+ text,
23
+ ...props
24
+ } ) => {
25
+ const renderLine = ( key ) => (
26
+ <View
27
+ key={ key }
28
+ style={ getStylesFromColorScheme( styles.line, styles.lineDark ) }
29
+ />
30
+ );
31
+
32
+ const renderText = ( key ) => (
33
+ <View key={ key }>
34
+ <Text style={ [ styles.text, textStyle ] }>{ text }</Text>
35
+ </View>
36
+ );
37
+
38
+ const renderInner = () => {
39
+ if ( ! text ) {
40
+ return renderLine();
41
+ }
42
+ return [ renderLine( 1 ), renderText( 2 ), renderLine( 3 ) ];
43
+ };
18
44
 
19
45
  return (
20
- <Hr
46
+ <View
47
+ style={ [
48
+ styles.container,
49
+ { marginLeft, marginRight },
50
+ props.style,
51
+ ] }
21
52
  { ...props }
22
- lineStyle={ [ lineStyle, props.lineStyle ] }
23
- marginLeft={ 0 }
24
- marginRight={ 0 }
25
- />
53
+ >
54
+ { renderInner() }
55
+ </View>
26
56
  );
27
57
  };
28
58
 
@@ -1,8 +1,23 @@
1
+ .container {
2
+ align-items: center;
3
+ flex-direction: row;
4
+ margin-left: 0;
5
+ margin-right: 0;
6
+ }
7
+
1
8
  .line {
2
9
  background-color: $gray-lighten-20;
10
+ flex: 1;
3
11
  height: 2;
4
12
  }
5
13
 
6
14
  .lineDark {
7
15
  background-color: $gray-50;
8
16
  }
17
+
18
+ .text {
19
+ flex: 1;
20
+ margin-left: 15px;
21
+ margin-right: 15px;
22
+ text-align: center;
23
+ }