@nice-digital/nds-action-banner 2.0.2-alpha.0 → 2.0.5-alpha.0

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/README.md CHANGED
@@ -2,18 +2,18 @@
2
2
 
3
3
  > Action banner component for the NICE Design System
4
4
 
5
- - [`@nice-digital/nds-action-banner`](#nice-digitalnds-action-banner)
6
- - [Installation](#installation)
7
- - [Usage](#usage)
8
- - [React](#react)
9
- - [Props](#props)
10
- - [children](#children)
11
- - [title](#title)
12
- - [variant](#variant)
13
- - [cta](#cta)
14
- - [onClosing](#onclosing)
15
- - [SCSS](#scss)
16
- - [HTML](#html)
5
+ - [Installation](#installation)
6
+ - [Usage](#usage)
7
+ - [React](#react)
8
+ - [Props](#props)
9
+ - [children](#children)
10
+ - [title](#title)
11
+ - [variant](#variant)
12
+ - [cta](#cta)
13
+ - [onClosing](#onclosing)
14
+ - [className](#classname)
15
+ - [SCSS](#scss)
16
+ - [HTML](#html)
17
17
 
18
18
  ## Installation
19
19
 
@@ -99,7 +99,7 @@ Any additional className will be merged on to the container.
99
99
  If you're not using [React](#react), then import the SCSS directly into your application by:
100
100
 
101
101
  ```scss
102
- @import '~@nice-digital/nds-action-banner/scss/action-banner';
102
+ @forward '@nice-digital/nds-action-banner/scss/action-banner';
103
103
  ```
104
104
 
105
105
  ### HTML
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/ActionBanner.js"],"names":["React","PropTypes","classnames","RemoveIcon","ActionBanner","props","state","isClosed","closeClickHandler","bind","setState","onClosing","Error","render","variant","title","children","cta","className","rest","classes","Component","propTypes","string","isRequired","oneOf","oneOfType","arrayOf","node","func","defaultProps"],"mappings":"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","sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport classnames from \"classnames\";\nimport RemoveIcon from \"@nice-digital/icons/lib/Remove\";\n\nimport \"../scss/action-banner.scss\";\n\nexport class ActionBanner extends React.Component {\n\tconstructor(props) {\n\t\tsuper(props);\n\n\t\tthis.state = {\n\t\t\tisClosed: false\n\t\t};\n\n\t\tthis.closeClickHandler = this.closeClickHandler.bind(this);\n\t}\n\n\tcloseClickHandler() {\n\t\tthis.setState({\n\t\t\tisClosed: true\n\t\t});\n\n\t\tif (typeof this.props.onClosing === \"function\") this.props.onClosing(this);\n\t\telse throw new Error(\"The onClosing prop should be a function\");\n\t}\n\n\trender() {\n\t\tif (this.state.isClosed) return null;\n\n\t\tconst {\n\t\t\tvariant,\n\t\t\tonClosing,\n\t\t\ttitle,\n\t\t\tchildren,\n\t\t\tcta,\n\t\t\tclassName,\n\t\t\t...rest\n\t\t} = this.props;\n\n\t\tconst classes = {\n\t\t\t\"action-banner\": true,\n\t\t\t\"action-banner--closeable\": onClosing,\n\t\t\t[`action-banner--${variant}`]: variant,\n\t\t\t[className]: className\n\t\t};\n\n\t\treturn (\n\t\t\t<section className={classnames(classes)} {...rest}>\n\t\t\t\t<div className=\"action-banner__container\">\n\t\t\t\t\t<div className=\"action-banner__inner\">\n\t\t\t\t\t\t<div className=\"action-banner__text\">\n\t\t\t\t\t\t\t<h2 className=\"action-banner__title\">{title}</h2>\n\t\t\t\t\t\t\t{children && <p className=\"action-banner__intro\">{children}</p>}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{cta && <div className=\"action-banner__actions\">{cta}</div>}\n\t\t\t\t\t\t{onClosing && (\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\tclassName=\"action-banner__close\"\n\t\t\t\t\t\t\t\tonClick={this.closeClickHandler}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<RemoveIcon />\n\t\t\t\t\t\t\t\t<span className=\"visually-hidden\">Close {title}</span>\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</section>\n\t\t);\n\t}\n}\n\nActionBanner.propTypes = {\n\ttitle: PropTypes.string.isRequired,\n\tvariant: PropTypes.oneOf([\"default\", \"subtle\"]),\n\tchildren: PropTypes.oneOfType([\n\t\tPropTypes.arrayOf(PropTypes.node),\n\t\tPropTypes.node\n\t]).isRequired,\n\tcta: PropTypes.node,\n\tonClosing: PropTypes.func,\n\tclassName: PropTypes.string\n};\n\nActionBanner.defaultProps = {\n\tvariant: \"default\"\n};\n"],"file":"ActionBanner.js"}
1
+ {"version":3,"file":"ActionBanner.js","names":["React","PropTypes","classnames","RemoveIcon","ActionBanner","props","state","isClosed","closeClickHandler","bind","setState","onClosing","Error","render","variant","title","children","cta","className","rest","classes","Component","propTypes","string","isRequired","oneOf","oneOfType","arrayOf","node","func","defaultProps"],"sources":["../src/ActionBanner.js"],"sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport classnames from \"classnames\";\nimport RemoveIcon from \"@nice-digital/icons/lib/Remove\";\n\nimport \"../scss/action-banner.scss\";\n\nexport class ActionBanner extends React.Component {\n\tconstructor(props) {\n\t\tsuper(props);\n\n\t\tthis.state = {\n\t\t\tisClosed: false\n\t\t};\n\n\t\tthis.closeClickHandler = this.closeClickHandler.bind(this);\n\t}\n\n\tcloseClickHandler() {\n\t\tthis.setState({\n\t\t\tisClosed: true\n\t\t});\n\n\t\tif (typeof this.props.onClosing === \"function\") this.props.onClosing(this);\n\t\telse throw new Error(\"The onClosing prop should be a function\");\n\t}\n\n\trender() {\n\t\tif (this.state.isClosed) return null;\n\n\t\tconst { variant, onClosing, title, children, cta, className, ...rest } =\n\t\t\tthis.props;\n\n\t\tconst classes = {\n\t\t\t\"action-banner\": true,\n\t\t\t\"action-banner--closeable\": onClosing,\n\t\t\t[`action-banner--${variant}`]: variant,\n\t\t\t[className]: className\n\t\t};\n\n\t\treturn (\n\t\t\t<section className={classnames(classes)} {...rest}>\n\t\t\t\t<div className=\"action-banner__container\">\n\t\t\t\t\t<div className=\"action-banner__inner\">\n\t\t\t\t\t\t<div className=\"action-banner__text\">\n\t\t\t\t\t\t\t<h2 className=\"action-banner__title\">{title}</h2>\n\t\t\t\t\t\t\t{children && <p className=\"action-banner__intro\">{children}</p>}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{cta && <div className=\"action-banner__actions\">{cta}</div>}\n\t\t\t\t\t\t{onClosing && (\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\tclassName=\"action-banner__close\"\n\t\t\t\t\t\t\t\tonClick={this.closeClickHandler}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<RemoveIcon />\n\t\t\t\t\t\t\t\t<span className=\"visually-hidden\">Close {title}</span>\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</section>\n\t\t);\n\t}\n}\n\nActionBanner.propTypes = {\n\ttitle: PropTypes.string.isRequired,\n\tvariant: PropTypes.oneOf([\"default\", \"subtle\"]),\n\tchildren: PropTypes.oneOfType([\n\t\tPropTypes.arrayOf(PropTypes.node),\n\t\tPropTypes.node\n\t]).isRequired,\n\tcta: PropTypes.node,\n\tonClosing: PropTypes.func,\n\tclassName: PropTypes.string\n};\n\nActionBanner.defaultProps = {\n\tvariant: \"default\"\n};\n"],"mappings":";;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,UAAP,MAAuB,gCAAvB;AAEA,OAAO,4BAAP;AAEA,WAAaC,YAAb;EAAA;;EACC,sBAAYC,KAAZ,EAAmB;IAAA;;IAClB,oCAAMA,KAAN;IAEA,MAAKC,KAAL,GAAa;MACZC,QAAQ,EAAE;IADE,CAAb;IAIA,MAAKC,iBAAL,GAAyB,MAAKA,iBAAL,CAAuBC,IAAvB,+BAAzB;IAPkB;EAQlB;;EATF;;EAAA,OAWCD,iBAXD,GAWC,6BAAoB;IACnB,KAAKE,QAAL,CAAc;MACbH,QAAQ,EAAE;IADG,CAAd;IAIA,IAAI,OAAO,KAAKF,KAAL,CAAWM,SAAlB,KAAgC,UAApC,EAAgD,KAAKN,KAAL,CAAWM,SAAX,CAAqB,IAArB,EAAhD,KACK,MAAM,IAAIC,KAAJ,CAAU,yCAAV,CAAN;EACL,CAlBF;;EAAA,OAoBCC,MApBD,GAoBC,kBAAS;IAAA;;IACR,IAAI,KAAKP,KAAL,CAAWC,QAAf,EAAyB,OAAO,IAAP;;IAEzB,kBACC,KAAKF,KADN;IAAA,IAAQS,OAAR,eAAQA,OAAR;IAAA,IAAiBH,SAAjB,eAAiBA,SAAjB;IAAA,IAA4BI,KAA5B,eAA4BA,KAA5B;IAAA,IAAmCC,QAAnC,eAAmCA,QAAnC;IAAA,IAA6CC,GAA7C,eAA6CA,GAA7C;IAAA,IAAkDC,SAAlD,eAAkDA,SAAlD;IAAA,IAAgEC,IAAhE;;IAGA,IAAMC,OAAO;MACZ,iBAAiB,IADL;MAEZ,4BAA4BT;IAFhB,gCAGOG,OAHP,IAGmBA,OAHnB,WAIXI,SAJW,IAICA,SAJD,WAAb;IAOA,oBACC;MAAS,SAAS,EAAEhB,UAAU,CAACkB,OAAD;IAA9B,GAA6CD,IAA7C,gBACC;MAAK,SAAS,EAAC;IAAf,gBACC;MAAK,SAAS,EAAC;IAAf,gBACC;MAAK,SAAS,EAAC;IAAf,gBACC;MAAI,SAAS,EAAC;IAAd,GAAsCJ,KAAtC,CADD,EAEEC,QAAQ,iBAAI;MAAG,SAAS,EAAC;IAAb,GAAqCA,QAArC,CAFd,CADD,EAKEC,GAAG,iBAAI;MAAK,SAAS,EAAC;IAAf,GAAyCA,GAAzC,CALT,EAMEN,SAAS,iBACT;MACC,IAAI,EAAC,QADN;MAEC,SAAS,EAAC,sBAFX;MAGC,OAAO,EAAE,KAAKH;IAHf,gBAKC,oBAAC,UAAD,OALD,eAMC;MAAM,SAAS,EAAC;IAAhB,aAAyCO,KAAzC,CAND,CAPF,CADD,CADD,CADD;EAuBA,CAxDF;;EAAA;AAAA,EAAkCf,KAAK,CAACqB,SAAxC;AA2DAjB,YAAY,CAACkB,SAAb,GAAyB;EACxBP,KAAK,EAAEd,SAAS,CAACsB,MAAV,CAAiBC,UADA;EAExBV,OAAO,EAAEb,SAAS,CAACwB,KAAV,CAAgB,CAAC,SAAD,EAAY,QAAZ,CAAhB,CAFe;EAGxBT,QAAQ,EAAEf,SAAS,CAACyB,SAAV,CAAoB,CAC7BzB,SAAS,CAAC0B,OAAV,CAAkB1B,SAAS,CAAC2B,IAA5B,CAD6B,EAE7B3B,SAAS,CAAC2B,IAFmB,CAApB,EAGPJ,UANqB;EAOxBP,GAAG,EAAEhB,SAAS,CAAC2B,IAPS;EAQxBjB,SAAS,EAAEV,SAAS,CAAC4B,IARG;EASxBX,SAAS,EAAEjB,SAAS,CAACsB;AATG,CAAzB;AAYAnB,YAAY,CAAC0B,YAAb,GAA4B;EAC3BhB,OAAO,EAAE;AADkB,CAA5B"}
@@ -71,7 +71,7 @@ var ActionBanner = /*#__PURE__*/function (_React$Component) {
71
71
  __self: this,
72
72
  __source: {
73
73
  fileName: _jsxFileName,
74
- lineNumber: 49,
74
+ lineNumber: 42,
75
75
  columnNumber: 4
76
76
  }
77
77
  }), /*#__PURE__*/_react["default"].createElement("div", {
@@ -79,7 +79,7 @@ var ActionBanner = /*#__PURE__*/function (_React$Component) {
79
79
  __self: this,
80
80
  __source: {
81
81
  fileName: _jsxFileName,
82
- lineNumber: 50,
82
+ lineNumber: 43,
83
83
  columnNumber: 5
84
84
  }
85
85
  }, /*#__PURE__*/_react["default"].createElement("div", {
@@ -87,7 +87,7 @@ var ActionBanner = /*#__PURE__*/function (_React$Component) {
87
87
  __self: this,
88
88
  __source: {
89
89
  fileName: _jsxFileName,
90
- lineNumber: 51,
90
+ lineNumber: 44,
91
91
  columnNumber: 6
92
92
  }
93
93
  }, /*#__PURE__*/_react["default"].createElement("div", {
@@ -95,7 +95,7 @@ var ActionBanner = /*#__PURE__*/function (_React$Component) {
95
95
  __self: this,
96
96
  __source: {
97
97
  fileName: _jsxFileName,
98
- lineNumber: 52,
98
+ lineNumber: 45,
99
99
  columnNumber: 7
100
100
  }
101
101
  }, /*#__PURE__*/_react["default"].createElement("h2", {
@@ -103,7 +103,7 @@ var ActionBanner = /*#__PURE__*/function (_React$Component) {
103
103
  __self: this,
104
104
  __source: {
105
105
  fileName: _jsxFileName,
106
- lineNumber: 53,
106
+ lineNumber: 46,
107
107
  columnNumber: 8
108
108
  }
109
109
  }, title), children && /*#__PURE__*/_react["default"].createElement("p", {
@@ -111,7 +111,7 @@ var ActionBanner = /*#__PURE__*/function (_React$Component) {
111
111
  __self: this,
112
112
  __source: {
113
113
  fileName: _jsxFileName,
114
- lineNumber: 54,
114
+ lineNumber: 47,
115
115
  columnNumber: 21
116
116
  }
117
117
  }, children)), cta && /*#__PURE__*/_react["default"].createElement("div", {
@@ -119,7 +119,7 @@ var ActionBanner = /*#__PURE__*/function (_React$Component) {
119
119
  __self: this,
120
120
  __source: {
121
121
  fileName: _jsxFileName,
122
- lineNumber: 56,
122
+ lineNumber: 49,
123
123
  columnNumber: 15
124
124
  }
125
125
  }, cta), onClosing && /*#__PURE__*/_react["default"].createElement("button", {
@@ -129,14 +129,14 @@ var ActionBanner = /*#__PURE__*/function (_React$Component) {
129
129
  __self: this,
130
130
  __source: {
131
131
  fileName: _jsxFileName,
132
- lineNumber: 58,
132
+ lineNumber: 51,
133
133
  columnNumber: 8
134
134
  }
135
135
  }, /*#__PURE__*/_react["default"].createElement(_Remove["default"], {
136
136
  __self: this,
137
137
  __source: {
138
138
  fileName: _jsxFileName,
139
- lineNumber: 63,
139
+ lineNumber: 56,
140
140
  columnNumber: 9
141
141
  }
142
142
  }), /*#__PURE__*/_react["default"].createElement("span", {
@@ -144,7 +144,7 @@ var ActionBanner = /*#__PURE__*/function (_React$Component) {
144
144
  __self: this,
145
145
  __source: {
146
146
  fileName: _jsxFileName,
147
- lineNumber: 64,
147
+ lineNumber: 57,
148
148
  columnNumber: 9
149
149
  }
150
150
  }, "Close ", title)))));
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/ActionBanner.js"],"names":["ActionBanner","props","state","isClosed","closeClickHandler","bind","setState","onClosing","Error","render","variant","title","children","cta","className","rest","classes","React","Component","propTypes","PropTypes","string","isRequired","oneOf","oneOfType","arrayOf","node","func","defaultProps"],"mappings":";;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AAEA;;;;;IAEaA,Y;;;AACZ,wBAAYC,KAAZ,EAAmB;AAAA;;AAClB,wCAAMA,KAAN;AAEA,UAAKC,KAAL,GAAa;AACZC,MAAAA,QAAQ,EAAE;AADE,KAAb;AAIA,UAAKC,iBAAL,GAAyB,MAAKA,iBAAL,CAAuBC,IAAvB,gDAAzB;AAPkB;AAQlB;;;;SAEDD,iB,GAAA,6BAAoB;AACnB,SAAKE,QAAL,CAAc;AACbH,MAAAA,QAAQ,EAAE;AADG,KAAd;AAIA,QAAI,OAAO,KAAKF,KAAL,CAAWM,SAAlB,KAAgC,UAApC,EAAgD,KAAKN,KAAL,CAAWM,SAAX,CAAqB,IAArB,EAAhD,KACK,MAAM,IAAIC,KAAJ,CAAU,yCAAV,CAAN;AACL,G;;SAEDC,M,GAAA,kBAAS;AAAA;;AACR,QAAI,KAAKP,KAAL,CAAWC,QAAf,EAAyB,OAAO,IAAP;AAEzB,sBAQI,KAAKF,KART;AAAA,QACCS,OADD,eACCA,OADD;AAAA,QAECH,SAFD,eAECA,SAFD;AAAA,QAGCI,KAHD,eAGCA,KAHD;AAAA,QAICC,QAJD,eAICA,QAJD;AAAA,QAKCC,GALD,eAKCA,GALD;AAAA,QAMCC,SAND,eAMCA,SAND;AAAA,QAOIC,IAPJ;AAUA,QAAMC,OAAO;AACZ,uBAAiB,IADL;AAEZ,kCAA4BT;AAFhB,oCAGOG,OAHP,IAGmBA,OAHnB,WAIXI,SAJW,IAICA,SAJD,WAAb;AAOA,wBACC;AAAS,MAAA,SAAS,EAAE,4BAAWE,OAAX;AAApB,OAA6CD,IAA7C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBACC;AAAK,MAAA,SAAS,EAAC,0BAAf;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBACC;AAAK,MAAA,SAAS,EAAC,sBAAf;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBACC;AAAK,MAAA,SAAS,EAAC,qBAAf;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBACC;AAAI,MAAA,SAAS,EAAC,sBAAd;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,OAAsCJ,KAAtC,CADD,EAEEC,QAAQ,iBAAI;AAAG,MAAA,SAAS,EAAC,sBAAb;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,OAAqCA,QAArC,CAFd,CADD,EAKEC,GAAG,iBAAI;AAAK,MAAA,SAAS,EAAC,wBAAf;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,OAAyCA,GAAzC,CALT,EAMEN,SAAS,iBACT;AACC,MAAA,IAAI,EAAC,QADN;AAEC,MAAA,SAAS,EAAC,sBAFX;AAGC,MAAA,OAAO,EAAE,KAAKH,iBAHf;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAKC,gCAAC,kBAAD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MALD,eAMC;AAAM,MAAA,SAAS,EAAC,iBAAhB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAAyCO,KAAzC,CAND,CAPF,CADD,CADD,CADD;AAuBA,G;;;EA/DgCM,kBAAMC,S;;;AAkExClB,YAAY,CAACmB,SAAb,GAAyB;AACxBR,EAAAA,KAAK,EAAES,sBAAUC,MAAV,CAAiBC,UADA;AAExBZ,EAAAA,OAAO,EAAEU,sBAAUG,KAAV,CAAgB,CAAC,SAAD,EAAY,QAAZ,CAAhB,CAFe;AAGxBX,EAAAA,QAAQ,EAAEQ,sBAAUI,SAAV,CAAoB,CAC7BJ,sBAAUK,OAAV,CAAkBL,sBAAUM,IAA5B,CAD6B,EAE7BN,sBAAUM,IAFmB,CAApB,EAGPJ,UANqB;AAOxBT,EAAAA,GAAG,EAAEO,sBAAUM,IAPS;AAQxBnB,EAAAA,SAAS,EAAEa,sBAAUO,IARG;AASxBb,EAAAA,SAAS,EAAEM,sBAAUC;AATG,CAAzB;AAYArB,YAAY,CAAC4B,YAAb,GAA4B;AAC3BlB,EAAAA,OAAO,EAAE;AADkB,CAA5B","sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport classnames from \"classnames\";\nimport RemoveIcon from \"@nice-digital/icons/lib/Remove\";\n\nimport \"../scss/action-banner.scss\";\n\nexport class ActionBanner extends React.Component {\n\tconstructor(props) {\n\t\tsuper(props);\n\n\t\tthis.state = {\n\t\t\tisClosed: false\n\t\t};\n\n\t\tthis.closeClickHandler = this.closeClickHandler.bind(this);\n\t}\n\n\tcloseClickHandler() {\n\t\tthis.setState({\n\t\t\tisClosed: true\n\t\t});\n\n\t\tif (typeof this.props.onClosing === \"function\") this.props.onClosing(this);\n\t\telse throw new Error(\"The onClosing prop should be a function\");\n\t}\n\n\trender() {\n\t\tif (this.state.isClosed) return null;\n\n\t\tconst {\n\t\t\tvariant,\n\t\t\tonClosing,\n\t\t\ttitle,\n\t\t\tchildren,\n\t\t\tcta,\n\t\t\tclassName,\n\t\t\t...rest\n\t\t} = this.props;\n\n\t\tconst classes = {\n\t\t\t\"action-banner\": true,\n\t\t\t\"action-banner--closeable\": onClosing,\n\t\t\t[`action-banner--${variant}`]: variant,\n\t\t\t[className]: className\n\t\t};\n\n\t\treturn (\n\t\t\t<section className={classnames(classes)} {...rest}>\n\t\t\t\t<div className=\"action-banner__container\">\n\t\t\t\t\t<div className=\"action-banner__inner\">\n\t\t\t\t\t\t<div className=\"action-banner__text\">\n\t\t\t\t\t\t\t<h2 className=\"action-banner__title\">{title}</h2>\n\t\t\t\t\t\t\t{children && <p className=\"action-banner__intro\">{children}</p>}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{cta && <div className=\"action-banner__actions\">{cta}</div>}\n\t\t\t\t\t\t{onClosing && (\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\tclassName=\"action-banner__close\"\n\t\t\t\t\t\t\t\tonClick={this.closeClickHandler}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<RemoveIcon />\n\t\t\t\t\t\t\t\t<span className=\"visually-hidden\">Close {title}</span>\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</section>\n\t\t);\n\t}\n}\n\nActionBanner.propTypes = {\n\ttitle: PropTypes.string.isRequired,\n\tvariant: PropTypes.oneOf([\"default\", \"subtle\"]),\n\tchildren: PropTypes.oneOfType([\n\t\tPropTypes.arrayOf(PropTypes.node),\n\t\tPropTypes.node\n\t]).isRequired,\n\tcta: PropTypes.node,\n\tonClosing: PropTypes.func,\n\tclassName: PropTypes.string\n};\n\nActionBanner.defaultProps = {\n\tvariant: \"default\"\n};\n"],"file":"ActionBanner.js"}
1
+ {"version":3,"file":"ActionBanner.js","names":["ActionBanner","props","state","isClosed","closeClickHandler","bind","setState","onClosing","Error","render","variant","title","children","cta","className","rest","classes","classnames","React","Component","propTypes","PropTypes","string","isRequired","oneOf","oneOfType","arrayOf","node","func","defaultProps"],"sources":["../src/ActionBanner.js"],"sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport classnames from \"classnames\";\nimport RemoveIcon from \"@nice-digital/icons/lib/Remove\";\n\nimport \"../scss/action-banner.scss\";\n\nexport class ActionBanner extends React.Component {\n\tconstructor(props) {\n\t\tsuper(props);\n\n\t\tthis.state = {\n\t\t\tisClosed: false\n\t\t};\n\n\t\tthis.closeClickHandler = this.closeClickHandler.bind(this);\n\t}\n\n\tcloseClickHandler() {\n\t\tthis.setState({\n\t\t\tisClosed: true\n\t\t});\n\n\t\tif (typeof this.props.onClosing === \"function\") this.props.onClosing(this);\n\t\telse throw new Error(\"The onClosing prop should be a function\");\n\t}\n\n\trender() {\n\t\tif (this.state.isClosed) return null;\n\n\t\tconst { variant, onClosing, title, children, cta, className, ...rest } =\n\t\t\tthis.props;\n\n\t\tconst classes = {\n\t\t\t\"action-banner\": true,\n\t\t\t\"action-banner--closeable\": onClosing,\n\t\t\t[`action-banner--${variant}`]: variant,\n\t\t\t[className]: className\n\t\t};\n\n\t\treturn (\n\t\t\t<section className={classnames(classes)} {...rest}>\n\t\t\t\t<div className=\"action-banner__container\">\n\t\t\t\t\t<div className=\"action-banner__inner\">\n\t\t\t\t\t\t<div className=\"action-banner__text\">\n\t\t\t\t\t\t\t<h2 className=\"action-banner__title\">{title}</h2>\n\t\t\t\t\t\t\t{children && <p className=\"action-banner__intro\">{children}</p>}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{cta && <div className=\"action-banner__actions\">{cta}</div>}\n\t\t\t\t\t\t{onClosing && (\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\tclassName=\"action-banner__close\"\n\t\t\t\t\t\t\t\tonClick={this.closeClickHandler}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<RemoveIcon />\n\t\t\t\t\t\t\t\t<span className=\"visually-hidden\">Close {title}</span>\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</section>\n\t\t);\n\t}\n}\n\nActionBanner.propTypes = {\n\ttitle: PropTypes.string.isRequired,\n\tvariant: PropTypes.oneOf([\"default\", \"subtle\"]),\n\tchildren: PropTypes.oneOfType([\n\t\tPropTypes.arrayOf(PropTypes.node),\n\t\tPropTypes.node\n\t]).isRequired,\n\tcta: PropTypes.node,\n\tonClosing: PropTypes.func,\n\tclassName: PropTypes.string\n};\n\nActionBanner.defaultProps = {\n\tvariant: \"default\"\n};\n"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nice-digital/nds-action-banner",
3
- "version": "2.0.2-alpha.0",
3
+ "version": "2.0.5-alpha.0",
4
4
  "description": "Action banner component for the NICE Design System",
5
5
  "keywords": [
6
6
  "banner"
@@ -34,8 +34,8 @@
34
34
  "url": "https://github.com/nice-digital/nice-design-system/issues"
35
35
  },
36
36
  "dependencies": {
37
- "@nice-digital/icons": "^4.0.0-alpha.0",
38
- "@nice-digital/nds-core": "^2.0.2-alpha.0",
37
+ "@nice-digital/icons": "^4.0.1-alpha.0",
38
+ "@nice-digital/nds-core": "^2.0.5-alpha.0",
39
39
  "classnames": "^2.3.1",
40
40
  "prop-types": "^15.7.2"
41
41
  },
@@ -46,5 +46,5 @@
46
46
  "devDependencies": {
47
47
  "@babel/cli": "^7.5.0"
48
48
  },
49
- "gitHead": "04839cc13ae0a0fbd0baeefff5996943285dafab"
49
+ "gitHead": "c560cb90c31f1c8d2e3085df9b32bc4e47a37929"
50
50
  }
@@ -24,8 +24,8 @@
24
24
  background: colours.$action-banner-default-background;
25
25
  border: 1px solid colours.$action-banner-default-border;
26
26
  color: colours.$text-inverse;
27
- margin: utils.em(0 0 spacing.$large);
28
- padding: utils.em(spacing.$medium 0);
27
+ margin: utils.rem(0 0 spacing.$large);
28
+ padding: utils.rem(spacing.$medium 0);
29
29
  position: relative;
30
30
 
31
31
  &__container {
@@ -33,13 +33,13 @@
33
33
  }
34
34
 
35
35
  &__text {
36
- margin-bottom: utils.em(spacing.$medium);
36
+ margin-bottom: utils.rem(spacing.$medium);
37
37
  }
38
38
 
39
39
  &__title {
40
40
  @include typography.font-size(3);
41
41
  color: colours.$text-inverse;
42
- margin: utils.em(0 0 spacing.$x-small);
42
+ margin: utils.rem(0 0 spacing.$x-small);
43
43
  }
44
44
 
45
45
  &__intro {
@@ -48,6 +48,7 @@
48
48
 
49
49
  &__actions {
50
50
  @include focus.inverse-button-focus;
51
+
51
52
  .btn {
52
53
  margin: 0;
53
54
  }