@contentful/f36-modal 4.2.7 → 4.2.10

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
@@ -3,6 +3,33 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [4.2.10](https://github.com/contentful/forma-36/compare/@contentful/f36-modal@4.2.9...@contentful/f36-modal@4.2.10) (2022-03-14)
7
+
8
+ **Note:** Version bump only for package @contentful/f36-modal
9
+
10
+
11
+
12
+
13
+
14
+ ## [4.2.9](https://github.com/contentful/forma-36/compare/@contentful/f36-modal@4.2.8...@contentful/f36-modal@4.2.9) (2022-03-10)
15
+
16
+ **Note:** Version bump only for package @contentful/f36-modal
17
+
18
+
19
+
20
+
21
+
22
+ ## [4.2.8](https://github.com/contentful/forma-36/compare/@contentful/f36-modal@4.2.7...@contentful/f36-modal@4.2.8) (2022-03-09)
23
+
24
+
25
+ ### Bug Fixes
26
+
27
+ * flickering in modal close animation ([#1940](https://github.com/contentful/forma-36/issues/1940)) ([1ba910e](https://github.com/contentful/forma-36/commit/1ba910e6206991c7596ca75620c3da00aee3e0d4))
28
+
29
+
30
+
31
+
32
+
6
33
  ## [4.2.7](https://github.com/contentful/forma-36/compare/@contentful/f36-modal@4.2.6...@contentful/f36-modal@4.2.7) (2022-03-09)
7
34
 
8
35
  **Note:** Version bump only for package @contentful/f36-modal
package/dist/main.js CHANGED
@@ -139,10 +139,7 @@ $66391c55bbcf9065$export$6da19a24bf249f17.displayName = 'ModalContent';
139
139
 
140
140
  function $a1d799ea27882387$export$9af97f4b0b4c597a(props) {
141
141
  const modal = $7x5iO$emotion.cx(/*#__PURE__*/ $7x5iO$emotion.css({
142
- transition: `opacity ${($parcel$interopDefault($7x5iO$contentfulf36tokens)).transitionDurationLong} ${($parcel$interopDefault($7x5iO$contentfulf36tokens)).transitionEasingDefault}, transform ${($parcel$interopDefault($7x5iO$contentfulf36tokens)).transitionDurationDefault} ${($parcel$interopDefault($7x5iO$contentfulf36tokens)).transitionEasingCubicBezier}`,
143
- opacity: '0.5',
144
142
  margin: ($parcel$interopDefault($7x5iO$contentfulf36tokens)).spacing2Xl,
145
- transform: 'scale(0.85)',
146
143
  backgroundColor: ($parcel$interopDefault($7x5iO$contentfulf36tokens)).colorWhite,
147
144
  borderRadius: ($parcel$interopDefault($7x5iO$contentfulf36tokens)).borderRadiusMedium,
148
145
  boxShadow: ($parcel$interopDefault($7x5iO$contentfulf36tokens)).boxShadowHeavy,
@@ -171,18 +168,20 @@ function $a1d799ea27882387$export$9af97f4b0b4c597a(props) {
171
168
  display: 'inline-block',
172
169
  margin: '0 auto',
173
170
  textAlign: 'left',
174
- outline: 'none'
171
+ outline: 'none',
172
+ transform: 'scale(0.85)',
173
+ transition: `transform ${($parcel$interopDefault($7x5iO$contentfulf36tokens)).transitionDurationDefault} ${($parcel$interopDefault($7x5iO$contentfulf36tokens)).transitionEasingDefault}`
175
174
  }), props.size === 'zen' ? /*#__PURE__*/ $7x5iO$emotion.css({
176
175
  name: "uwwqev",
177
176
  styles: "width:100%;height:100%;"
178
177
  }) : null),
179
178
  afterOpen: /*#__PURE__*/ $7x5iO$emotion.css({
180
- name: "rdgc1",
181
- styles: "[data-modal-root]{transform:scale(1);opacity:1;}"
179
+ name: "41q668",
180
+ styles: "transform:scale(1);"
182
181
  }),
183
182
  beforeClose: /*#__PURE__*/ $7x5iO$emotion.css({
184
- name: "e66ys1",
185
- styles: "[data-modal-root]{opacity:0.5;transform:scale(0.85);}"
183
+ name: "ncrqc5",
184
+ styles: "transform:scale(0.85);"
186
185
  })
187
186
  },
188
187
  modalOverlay: {
@@ -206,8 +205,8 @@ function $a1d799ea27882387$export$9af97f4b0b4c597a(props) {
206
205
  styles: "align-items:center;justify-content:center;"
207
206
  }) : null),
208
207
  afterOpen: /*#__PURE__*/ $7x5iO$emotion.css({
209
- name: "mcmk46",
210
- styles: "opacity:1 !important;"
208
+ name: "whh5e5",
209
+ styles: "opacity:1;"
211
210
  }),
212
211
  beforeClose: /*#__PURE__*/ $7x5iO$emotion.css({
213
212
  name: "q7lffx",
@@ -282,22 +281,22 @@ function $854b6d713fe70fc9$export$2b77a92f1a5ad772({ allowHeightOverflow: allowH
282
281
  shouldFocusAfterRender: true,
283
282
  shouldReturnFocusAfterClose: true,
284
283
  portalClassName: styles.portal,
285
- className: {
286
- base: styles.base.root,
287
- afterOpen: styles.base.afterOpen,
288
- beforeClose: styles.base.beforeClose
289
- },
290
284
  style: {
291
285
  content: {
292
286
  top: position === 'center' ? 0 : topOffset
293
287
  }
294
288
  },
289
+ className: {
290
+ base: styles.base.root,
291
+ afterOpen: styles.base.afterOpen,
292
+ beforeClose: styles.base.beforeClose
293
+ },
295
294
  overlayClassName: {
296
295
  base: styles.modalOverlay.root,
297
296
  afterOpen: styles.modalOverlay.afterOpen,
298
297
  beforeClose: styles.modalOverlay.beforeClose
299
298
  },
300
- closeTimeoutMS: 300,
299
+ closeTimeoutMS: 200,
301
300
  contentRef: (ref)=>{
302
301
  contentRef.current = ref;
303
302
  }
package/dist/main.js.map CHANGED
@@ -1 +1 @@
1
- {"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;SKGgBuF,yCAAT,GAAgC,CAAvC;IACE,MAAA,CAAO,CAAP;QACEf,IAAI,EAAA,EAAE,AAAF,SAAE,AAAF,EAAE,CAAA,kBAAA,CAAI,CAAVA;YACEpC,QAAQ,EAAE,CADF;YAERyD,OAAO,KAAKD,oDAAM,CAACE,QAAS,CAAA,CAAA,EAAGF,oDAAM,CAACE,QAAS,CAAA,CAAA,EAAGF,oDAAM,CAACE,QAAS,CAAA,CAAA,EAAGF,oDAAM,CAACG,QAAS;YACrFC,YAAY,KAAKJ,oDAAM,CAACK,kBAAmB,CAAA,CAAA,EAAGL,oDAAM,CAACK,kBAAmB,CAAA,IAAA;YACxEC,YAAY,GAAG,UAAA,EAAYN,oDAAM,CAACO,OAAQ;QAJlC,CAAJ;QAMNR,eAAe,EAAA,EAAE,AAAF,SAAE,AAAF,EAAE,CAAA,kBAAA,CAAI,CAArBA;YACEvD,QAAQ,EAAE,CADS;YAEnB2C,KAAK,EAAEa,oDAAM,CAACQ,UAFK;YAGnBC,MAAM,EAAET,oDAAM,CAACG,QAHI;YAInBO,MAAM,EAAE,CAARA;gBACElE,QAAQ,EAAE,CADJ;gBAENwC,GAAG,GAAG,UAAA,EAAYgB,oDAAM,CAACW,UAAW,CAAA,CAAA;gBACpCC,KAAK,EAAE,CAAPA;YAHM,CAAA;QAJW,CAAJ;IAPZ,CAAP;AAkBD,CAAA;;;SDFehG,yCAAT,CAAqB,CAA5B,UACEsB,OAD0B,UAE1BQ,KAF0B,WAG1BoB,MAAM,GAAG,CAHiB,iCAI1BO,SAJ0B,MAKvBN,UAAH,CACClD,CANI,EAMkC,CANb;IAO1B,KAAA,CAAMuD,MAAM,GAAGuB,yCAAoB;IAEnC,MAAA,oEACG,6BAAD;WACM5B,UAAJ;QACA,SAAA,EAAW,iBAAA,CAAGK,MAAM,CAACQ,IAAV,EAAgBP,SAAhB;QACX,MAAA,EAAQP,MAAD;QACP,UAAA,EAAW,CAJb;QAKE,cAAA,EAAe,CALjB;0EAOG,yCAAD;QAAY,EAAA,EAAG,CAAf;QAAoB,WAApB,EAAoB,IAApB;QAAgC,YAAA,EAAa,CAA7C;OACGpB,KAAD,GAEDR,OAAO,uEACL,6BAAD;QAAM,UAAA,EAAW,CAAjB;QAA0B,SAAA,EAAWkC,MAAM,CAAC2B,eAAR;0EACjC,iCAAD;QACE,OAAA,EAAQ,CADV;QAEE,CAAA,aAAW,CAFb;QAGE,SAAA,qEAAY,mCAAD;YAAW,IAAA,EAAK,CAAhB;;QACX,OAAA,MAAe,CAJ3B;YAKc7D,OAAO;QACR,CAFO;QAGR,IAAA,EAAK,CAPP;;AAaT,CAAA;AAEDtB,yCAAW,CAACyE,WAAZ,GAA0B,CAA1B;;;;;;;;SGtDgBwB,yCAAT,GAAiC,CAAxC;IACE,MAAA,CAAO,CAAP;QACEjC,IAAI,EAAA,EAAE,AAAF,SAAE,AAAF,EAAE,CAAA,kBAAA,CAAI,CAAVA;YACEqB,OAAO,KAAKD,oDAAM,CAACE,QAAS,CAAA,CAAA,EAAGF,oDAAM,CAACG,QAAS;YAC/CY,KAAK,EAAEf,oDAAM,CAACgB,OAFN;YAGRC,QAAQ,EAAEjB,oDAAM,CAACkB,SAHT;YAIRC,UAAU,EAAEnB,oDAAM,CAACoB,gBAJX;YAKRC,UAAU,EAAErB,oDAAM,CAACsB,WALX;YAMRC,SAAS,EAAE,CANH;YAORC,SAAS,EAAE,CAPH;YAQRC,SAAS,EAAE,CAAXA;QARQ,CAAJ;IADD,CAAP;AAYD,CAAA;;;SDDejH,yCAAT,CAAsB,CAA7B,SACEsD,MAAM,GAAG,CADkB,kCAE3BO,SAF2B,aAG3BlB,QAH2B,MAIxBY,UAAH,CACCtD,CALI,EAKe,CALO;IAM3B,KAAA,CAAM2D,MAAM,GAAGyC,yCAAqB;IACpC,MAAA,oEACG,4BAAD;WACM9C,UAAJ;QACA,EAAA,EAAG,CAFL;QAGE,SAAA,EAAW,iBAAA,CAAGK,MAAM,CAACQ,IAAV,EAAgBP,SAAhB;QACX,MAAA,EAAQP,MAAD;OAENX,QAAD;AAGL,CAAA;AAED3C,yCAAY,CAAC6E,WAAb,GAA2B,CAA3B;;;;;;SE9BgB7D,yCAAT,CAAwB2C,KAAxB,EAKJ,CALmC;IAMpC,KAAA,CAAMiB,KAAK,GAAG,iBAAA,CAAA,EACZ,AADY,SACZ,AADY,EACZ,CAAA,kBAAA,CAAI,CADN;QAEIsC,UAAU,GAAG,QAAA,EAAU1B,oDAAM,CAAC2B,sBAAuB,CAAA,CAAA,EAAG3B,oDAAM,CAAC4B,uBAAwB,CAAA,YAAA,EAAc5B,oDAAM,CAAC6B,yBAA0B,CAAA,CAAA,EAAG7B,oDAAM,CAAC8B,2BAA4B;QAC5KC,OAAO,EAAE,CAFP;QAGFC,MAAM,EAAEhC,oDAAM,CAACQ,UAHb;QAIFyB,SAAS,EAAE,CAJT;QAKFC,eAAe,EAAElC,oDAAM,CAACmC,UALtB;QAMF/B,YAAY,EAAEJ,oDAAM,CAACK,kBANnB;QAOF+B,SAAS,EAAEpC,oDAAM,CAACqC,cAPhB;QAQFC,SAAS,GAAG,2BAAA,EAA6BtC,oDAAM,CAACuC,eAAgB,CAAA,EAAA;QAChEC,QAAQ,GAAG,2BAAA,EAA6BxC,oDAAM,CAACuC,eAAgB,CAAA,EAAA;QAC/DE,QAAQ,EAAE,CAVR;QAWFC,OAAO,EAAE,CAXP;QAYFC,aAAa,EAAE,CAAfA;IAZE,CAAJ,GAcAxE,KAAK,CAACvB,mBAAN,GAAA,EACI,AADJ,SACI,AADJ,EACI,CAAA,kBAfA,CAAA,CAAA;QAeA,IAAA,EAAA,CAAA;QAAA,MAAA,EAAA,CAAA;IAAA,CAAA,IAIA,IApBQ,EAqBZuB,KAAK,CAACxB,IAAN,KAAe,CAAf,OAAA,EACI,AADJ,SACI,AADJ,EACI,CAAA,kBANA,CAAA,CAAA;QAMA,IAAA,EAAA,CAAA;QAAA,MAAA,EAAA,CAAA;IAAA,CAAA,IAOA,IA7BQ,EA8BZwB,KAAK,CAACE,SA9BM;IAiCd,MAAA,CAAO,CAAP;QACEK,MAAM,EAAA,EAAE,AAAF,SAAE,AAAF,EAAE,CAAA,kBAARA,CAAAA,CAAAA;YAAQ,IAAA,EAAA,CAAA;YAAA,MAAA,EAAA,CAAA;QAAA,CAAA;QAGRC,IAAI,EAAE,CAANA;YACEC,IAAI,EAAE,iBAAA,CAAA,EACJ,AADI,SACJ,AADI,EACJ,CAAA,kBAAA,CAAI,CADNA;gBAEIgE,MAAM,EAAE5C,oDAAM,CAAC6C,kBADb;gBAEFrG,QAAQ,EAAE,CAFR;gBAGFyD,OAAO,EAAE,CAHP;gBAIFyC,OAAO,EAAE,CAJP;gBAKFV,MAAM,EAAE,CALN;gBAMFc,SAAS,EAAE,CANT;gBAOFC,OAAO,EAAE,CAATA;YAPE,CAAJ,GASA5E,KAAK,CAACxB,IAAN,KAAe,CAAf,OAAA,EACI,AADJ,SACI,AADJ,EACI,CAAA,kBAVA,CAAA,CAAA;gBAUA,IAAA,EAAA,CAAA;gBAAA,MAAA,EAAA,CAAA;YAAA,CAAA,IAIA,IAfA;YAiBNkC,SAAS,EAAA,EAAE,AAAF,SAAE,AAAF,EAAE,CAAA,kBAAXA,CAAAA,CAAAA;gBAAW,IAAA,EAAA,CAAA;gBAAA,MAAA,EAAA,CAAA;YAAA,CAAA;YAMXC,WAAW,EAAA,EAAE,AAAF,SAAE,AAAF,EAAE,CAAA,kBAAbA,CAAAA,CAAAA;gBAAa,IAAA,EAAA,CAAA;gBAAA,MAAA,EAAA,CAAA;YAAA,CAAA;QAxBT,CAJD;QAmCLG,YAAY,EAAE,CAAdA;YACEL,IAAI,EAAE,iBAAA,CAAA,EACJ,AADI,SACJ,AADI,EACJ,CAAA,kBAAA,CAAI,CADNA;gBAEI8D,OAAO,EAAE,CADP;gBAEFM,UAAU,EAAE,CAFV;gBAGFC,QAAQ,EAAE,CAHR;gBAIFjE,GAAG,EAAE,CAJH;gBAKF4B,KAAK,EAAE,CALL;gBAMFsC,MAAM,EAAE,CANN;gBAOFC,IAAI,EAAE,CAPJ;gBAQFP,MAAM,EAAE5C,oDAAM,CAACoD,WARb;gBASFrB,OAAO,EAAE,CATP;gBAUFL,UAAU,GAAG,QAAA,EAAU1B,oDAAM,CAAC6B,yBAA0B,CAAA,CAAA,EAAG7B,oDAAM,CAAC4B,uBAAwB;gBAC1FpF,QAAQ,EAAE,CAXR;gBAYF+E,SAAS,EAAE,CAZT;gBAaFW,eAAe,EAAE,CAbf;gBAcFY,SAAS,EAAE,CAAXA;YAdE,CAAJ,GAgBA3E,KAAK,CAAC3B,QAAN,KAAmB,CAAnB,UAAA,EACI,AADJ,SACI,AADJ,EACI,CAAA,kBAjBA,CAAA,CAAA;gBAiBA,IAAA,EAAA,CAAA;gBAAA,MAAA,EAAA,CAAA;YAAA,CAAA,IAIA,IAtBA;YAwBNqC,SAAS,EAAA,EAAE,AAAF,SAAE,AAAF,EAAE,CAAA,kBAAXA,CAAAA,CAAAA;gBAAW,IAAA,EAAA,CAAA;gBAAA,MAAA,EAAA,CAAA;YAAA,CAAA;YAGXC,WAAW,EAAA,EAAE,AAAF,SAAE,AAAF,EAAE,CAAA,kBAAbA,CAAAA,CAAAA;gBAAa,IAAA,EAAA,CAAA;gBAAA,MAAA,EAAA,CAAA;YAAA,CAAA;QA5BD,CAnCT;eAmELM,KAAAA;IAnEK,CAAP;AAqED,CAAA;;;ALrGD,KAAA,CAAMzD,sCAAgB,GAAG,CAAzB;IACEC,MAAM,EAAE,CADe;IAEvBC,KAAK,EAAE,CAFgB;IAGvBC,KAAK,EAAE,CAHgB;IAIvBC,SAAS,EAAE,CAJY;IAKvBC,GAAG,EAAE,CAALA;AALuB,CAAzB;SAoFSuB,0CAAT,CAA8BC,IAA9B,EAAiD,CAAjD;IACE,EAAA,EAAIA,IAAI,IAAIA,IAAI,CAACC,gBAAjB,EAAmC,CAAnC;QACE,KAAA,CAAMC,QAAQ,GAAGF,IAAI,CAACC,gBAAL,CAAsB,CAAtB;QACjB,EAAA,EAAIC,QAAQ,CAACC,MAAT,GAAkB,CAAtB,EAAyB,CAAzB;YACE,KAAA,CAAMC,YAAY,GAAGF,QAAQ,CAAC,CAAD,EAC7B,CADA,AACA,EADA,AACA,wCADA;YAEA,EAAA,EAAI,MAAA,CAAOE,YAAY,CAACC,KAApB,KAA8B,CAAlC,WACE,EAAA,AAAA,wCAAA;YACAD,YAAY,CAACC,KAAb;QAEH,CAAA;IACF,CAAA;AACF,CAAA;SAEezD,yCAAT,CAAe,CAAtB,sBACEwC,mBAAmB,GAAG,KADF,aAEpBJ,QAAQ,GAAG,CAFS,oCAGpBD,wBAAwB,GAAG,IAHP,8BAIpBD,yBAAyB,GAAG,IAJR,SAKpBK,IAAI,GAAG,CALa,kBAMpBmB,MAAM,GAAG,CANW,0BAOpBrB,SAAS,GAAG,CAPQ,cAQpBJ,IARoB,MASjB0B,UAAH,CACC1D,CAVI,EAUQ,CAVO;IAWpB,KAAA,CAAM2D,UAAU,GAAG5C,mBAAY,CAAiB,IAA7B;IAEnB,KAAA,CAAM+C,KAAK,GAAG,CAAA;WACTJ,UADS;6BAEZnB,mBAFY;kBAGZJ,QAHY;kCAIZD,wBAJY;mCAKZD,yBALY;cAMZK,IANY;gBAOZmB,MAPY;mBAQZrB,SAAAA;IARY,CAAd;IAWA,KAAA,CAAM2B,MAAM,GAAG5C,yCAAc,CAAC,CAA9B;kBACEgB,QAD4B;cAE5BG,IAF4B;6BAG5BC,mBAH4B;QAI5ByB,SAAS,EAAEN,UAAU,CAACM,SAAtBA;IAJ4B,CAAD;IAO7BjD,sBAAA,KAAsB,CAAtBA;QACE,EAAA,EAAI+C,KAAK,CAAClC,OAAV,EACEsC,UAAU,KAAO,CAAjBA;YACE,EAAA,EAAIJ,KAAK,CAACnB,eAAN,IAAyBmB,KAAK,CAACnB,eAAN,CAAsBwB,OAAnD,EACE,CAAA;gBAAA,EAAA,EAAIL,KAAK,CAACnB,eAAN,CAAsBwB,OAAtB,CAA8BX,KAAlC,EACEM,KAAK,CAACnB,eAAN,CAAsBwB,OAAtB,CAA8BX,KAA9B;YACD,CAAA,MACI,EAAA,EAAIG,UAAU,CAACQ,OAAf,EACLjB,0CAAoB,CAACS,UAAU,CAACQ,OAAZ;QAEvB,CARS,EAQP,GARO;IAUb,CAZD,EAYG,CAACL;QAAAA,KAAK,CAAClC,OAAP;QAAgBkC,KAAK,CAACnB,eAAtB;IAAA,CAZH;IAcA,KAAA,CAAMyB,aAAa,OAAS,CAA5B;QACE,MAAA,0CACG,qBAAD,QACGV,UAAU,CAACrB,KAAX,6CACE,yCAAD;YACE,KAAA,EAAOqB,UAAU,CAACrB,KAAZ;YACN,OAAA,EAASyB,KAAK,CAACjC,OAAP;eACJ6B,UAAU,CAAClB,gBAAf;qDAGH,yCAAD,EAAkBkB,UAAU,CAAChB,iBAAf,EACXgB,UAAU,CAACZ,QAAZ;IAIP,CAfD;IAiBA,MAAA,0CACG,2CAAD;QACE,WAAA,EAAa,KAAD;QACZ,IAAA,EAAMd,IAAD;QACL,cAAA,EAAgB8B,KAAK,CAACjC,OAAP;QACf,MAAA,EAAQ6B,UAAU,CAAC9B,OAAZ;QACP,WAAA,EAAakC,KAAK,CAAC/B,WAAP;QACZ,gBAAA,EAAkBG,wBAAD;QACjB,yBAAA,EAA2BD,yBAAD;QAC1B,sBARF,EAQE,IARF;QASE,2BATF,EASE,IATF;QAUE,eAAA,EAAiB8B,MAAM,CAACM,MAAR;QAChB,SAAA,EAAW,CAZf;YAaMC,IAAI,EAAEP,MAAM,CAACO,IAAP,CAAYC,IADT;YAETC,SAAS,EAAET,MAAM,CAACO,IAAP,CAAYE,SAFd;YAGTC,WAAW,EAAEV,MAAM,CAACO,IAAP,CAAYG,WAAzBA;QAHS,CAAD;QAKV,KAAA,EAAO,CALI;YAMTC,OAAO,EAAE,CAATA;gBACEC,GAAG,EAAExC,QAAQ,KAAK,CAAb,UAAwB,CAAxB,GAA4BC,SAAjCuC;YADO,CAAA;QADJ,CAAD;QAKN,gBAAA,EAAkB,CALX;YAMLL,IAAI,EAAEP,MAAM,CAACa,YAAP,CAAoBL,IADV;YAEhBC,SAAS,EAAET,MAAM,CAACa,YAAP,CAAoBJ,SAFf;YAGhBC,WAAW,EAAEV,MAAM,CAACa,YAAP,CAAoBH,WAAjCA;QAHgB,CAAD;QAKjB,cAAA,EAAgB,GAAD;QACf,UAAA,GAAaI,GAAD,GAAS,CANH;YAOhBlB,UAAU,CAACQ,OAAX,GAAqBU,GAArB;QACD,CAFU;gDAIV,4BAAD;QACE,MAAA,EAAQpB,MAAD;QACP,KAAA,EAAO,CAFf;YAGUqB,KAAK,EAAExD,sCAAgB,CAACgB,IAAD,KAAUA,IAAjCwC;QADK,CAAD;QAGN,SAAA,EAAWf,MAAM,CAACgB,KAAR;QACV,CANF,kBAME,IANF;OAQG,MAAA,CAAOrB,UAAU,CAACZ,QAAlB,KAA+B,CAA/B,YACGY,UAAU,CAACZ,QAAX,CAAoBgB,KAApB,IACAM,aAAa;AAIxB,CAAA;AAEDrE,yCAAK,CAACiF,WAAN,GAAoB,CAApB;;;;;;;;SM5MgB3E,yCAAT,CAAuB,CAA9B,SACEoD,MAAM,GAAG,CADmB,mCAE5BO,SAF4B,aAG5BlB,QAH4B,MAIzBY,UAAH,CACCpD,CALI,EAKoC,CALb;IAM5B,MAAA,oEACG,6BAAD;WACMoD,UAAJ;QACA,SAAA,EAAWM,SAAD;QACV,MAAA,EAAQP,MAAD;QACP,aAAA,EAAc,CAJhB;QAKE,cAAA,EAAe,CALjB;QAME,MAAA,EAAO,CANT;QAOE,SAAA,EAAU,CAPZ;0EASG,sCAAD;QAAa,OAAA,EAAQ,CAArB;QAA8B,OAAA,EAAQ,CAAtC;OACGX,QAAD;AAIP,CAAA;AAEDzC,yCAAa,CAAC2E,WAAd,GAA4B,CAA5B;;;AP3BO,KAAA,CAAMjF,yCAAK,GAAGW,yCAAa;AAClCX,yCAAK,CAACa,OAAN,GAAgBT,yCAAhB;AACAJ,yCAAK,CAACc,MAAN,GAAeN,yCAAf;AACAR,yCAAK,CAACe,QAAN,GAAiBT,yCAAjB;;;;;;SQ4EgBJ,yCAAT,CAAsB,CAA7B,sBACEsC,mBAAmB,GAAG,KADK,gBAE3B8G,WAAW,GAAG,CAFa,wBAG3BM,YAAY,GAAG,CAHY,+CAI3B7G,QAJ2B,iBAK3BsG,YAAY,GAAG,CALY,0BAM3BM,aAAa,GAAG,CANW,8CAO3BJ,MAAM,GAAG,CAPkB,+BAQ3BC,iBAAiB,GAAG,KARO,qBAS3BC,gBAAgB,GAAG,KATQ,YAU3B5H,OAV2B,sBAW3Bc,iBAX2B,uBAY3B+G,kBAZ2B,qBAa3BjH,gBAb2B,aAc3B2G,QAd2B,cAe3BD,SAf2B,6BAgB3BhH,wBAAwB,GAAG,IAhBA,8BAiB3BD,yBAAyB,GAAG,IAjBD,SAkB3BK,IAAI,GAAG,CAlBoB,kBAmB3BmB,MAAM,GAAG,CAnBkB,8BAoB3BpB,KAAK,GAAG,CApBmB,kCAqB3BM,eAAAA,EACCzC,CAtBI,EAsBe,CAtBO;IAuB3B,KAAA,CAAM0J,SAAS,GAAG7I,sCAAK,CAAC6C,MAAN,CAAa,IAAb;IAElB,KAAA,CAAMiG,aAAa,GAAGT,YAAY,sEAC/B,iCAAD;QACE,MAAA,EAAQM,aAAD;QACP,UAAA,EAAYH,iBAAD;QACX,SAAA,EAAWC,gBAAD;QACV,OAAA,EAASF,MAAD;QACR,IAAA,EAAK,CALP;QAME,OAAA,MAAeJ,SAAS;OAEvBE,YAAD,IAEA,IAXJ;IAaA,KAAA,CAAMU,YAAY,GAAGT,WAAW,sEAC7B,iCAAD;QACE,MAAA,EAAQM,YAAD;QACP,OAAA,EAAQ,CAFV;QAGE,OAAA,EAASR,QAAD;QACR,IAAA,EAAK,CAJP;QAKE,GAAA,EAAKxG,eAAe,IAAIiH,SAApB;OAEHP,WAAD,IAEA,IAVJ;IAYA,MAAA,oEACG,yCAAD;QACE,MAAA,EAAQ5F,MAAD;QACP,OAAA,EAAS7B,OAAD;QACR,OAAA,EAASuH,QAAD;QACR,IAAA,EAAM7G,IAAD;QACL,yBAAA,EAA2BL,yBAAD;QAC1B,wBAAA,EAA0BC,wBAAD;QACzB,mBAAA,EAAqBK,mBAAD;QACpB,eAAA,EAAiBqH,SAAD;WAET,CAAb;QACQ,MAAA,oEACG,sCAAA,CAAM,QAAP,2EACG,yCAAA,CAAM,MAAP;YAAc,KAAA,EAAOvH,KAAK,IAAI,CAAV;eAAkBG,gBAAJ;+EACjC,yCAAA,CAAM,OAAP,EAAmBE,iBAAJ,EAAwBI,QAAD,sEACrC,yCAAA,CAAM,QAAP,EAAoB2G,kBAAJ,EACbK,YAAD,EACCD,aAAD;IAIP,CAXD;AAcL,CAAA;AAED5J,yCAAY,CAAC+E,WAAb,GAA2B,CAA3B;;;;;;;AC3IA,KAAA,CAAM0F,6BAAO,IAAIC,QAAD,GAAmC,CAAnD;IACE,EAAA,AAAA,kCAAA;IACA,GAAA,CAAIC,OAAO,GAAGC,QAAQ,CAACC,cAAT,CAAwBH,QAAxB;IACd,EAAA,EAAIC,OAAO,KAAK,IAAhB,EACE,MAAA,CAAOA,OAAP;IAGF,CAFC,AAED,EAFC,AAED,oBAFC;IAGDA,OAAO,GAAGC,QAAQ,CAACE,aAAT,CAAuB,CAAvB;IACVH,OAAO,CAACI,YAAR,CAAqB,CAArB,KAA2BL,QAA3B;IACAE,QAAQ,CAACI,IAAT,CAAcC,WAAd,CAA0BN,OAA1B;IACA,MAAA,CAAOA,OAAP;AACD,CAZD;AAcA,KAAA,CAAMO,mCAAa,GAAgC,GAAA,CAAIC,GAAJ;SAC1CC,8BAAT,GAAoB,CAApB;IACEF,mCAAa,CAACG,OAAd,QAA6B,CAA7BH,SAA+BZ,MAAF,kBAAUE,aAAV,UAAyBJ,KAAAA,EAAzB,CAAP,EAAyCM,QAAzC,GAAsD,CAA/C;QAC3B,KAAA,CAAMY,MAAM,GAAG,CAAA;eAAKd,aAAL;YAAoB7I,OAAO,EAAE,KAATA;QAApB,CAAf;QACA2I,MAAM,CAACgB,MAAD;QACN,KAAA,CAAM,GAAA,CAAIC,OAAJ,EAAaC,YAAD,GAAkBvH,UAAU,CAACuH,YAAD,EAAepB,KAAf;;QAC9CN,yCAAQ,CAAC2B,sBAAT,CAAgChB,6BAAO,CAACC,QAAD;QACvCQ,mCAAa,CAACQ,MAAd,CAAqBhB,QAArB;IACD,CAND;AAOD,C,AAED,CAFC,AAED,EAFC,AAED,4DAFC;SAGQiB,0BAAI,CACXC,iBADF,EAIEG,OAAiC,GAAG,CAAA;AAAA,CAJtC,EAKc,CALd;IAMEA,OAAO,GAAG,CAAVA;QAAY3B,KAAK,EAAE,GAAT;WAAiB2B,OAAH;IAAd,CAAV,CAEA,CAFU,AAEV,EAFU,AAEV,sEAFU;IAGV,KAAA,CAAMrB,QAAQ,IAAI,WAAA,EAAaqB,OAAO,CAAC5B,OAAR,IAAmB6B,IAAI,CAACC,GAAL;IAClD,KAAA,CAAMtB,OAAO,GAAGF,6BAAO,CAACC,QAAD;IAEvB,MAAA,CAAO,GAAA,CAAIa,OAAJ,EAAaW,OAAD,GAAa,CAAhC;QACE,GAAA,CAAI1B,aAAa,GAAG,CAApB;qBAAsB5I,QAAF;YAAWD,OAAO,EAAE,IAATA;QAAX,CAApB;iBAES2I,MAAT,CAAgB,CAAhB,UACE1I,OADc,YAEdD,OAAAA,EACoC,CAHtC,EAG2C,CAH3B;YAIdmI,yCAAQ,CAACQ,MAAT,CAAgBsB,iBAAiB,CAAC,CAAlC9B;yBAAoClI,OAAF;yBAAWD,OAAAA;YAAX,CAAD,GAAwBgJ,OAAzD;QACD,CAAA;uBAEc/I,QAAf,CAAuBuK,GAAvB,EAAgC,CAAhC;YACE3B,aAAa,GAAG,CAAA;mBACXA,aADW;gBAEd7I,OAAO,EAAE,KAATA;YAFc,CAAhB;YAIA2I,MAAM,CAACE,aAAD;YACN,KAAA,CAAM,GAAA,CAAIe,OAAJ,EAAaC,YAAD,GAChBvH,UAAU,CAACuH,YAAD,EAAeO,OAAO,CAAC3B,KAAvB;;YAEZN,yCAAQ,CAAC2B,sBAAT,CAAgCd,OAAhC;YACAA,OAAO,CAACyB,MAAR;YACAlB,mCAAa,CAACQ,MAAd,CAAqBhB,QAArB;YACAwB,OAAO,CAACC,GAAD;QACR,CAAA;QAED7B,MAAM,CAACE,aAAD;QACNU,mCAAa,CAACmB,GAAd,CAAkB3B,QAAlB,EAA4B,CAA5BQ;oBACEZ,MAD0B;2BAE1BE,aAF0B;YAG1BJ,KAAK,EAAE2B,OAAO,CAAC3B,KAAfA;QAH0B,CAA5B;IAKD,CA/BM;AAgCR,CAAA;AAEM,KAAA,CAAM5J,yCAAa,GAAG,CAA7B;UACEmL,0BAD2B;cAE3BP,8BAAAA;AAF2B,CAAtB;;","sources":["packages/components/modal/index.ts","packages/components/modal/src/index.ts","packages/components/modal/src/CompoundModal.tsx","packages/components/modal/src/Modal.tsx","packages/components/modal/src/ModalHeader/ModalHeader.tsx","packages/components/modal/src/ModalHeader/ModalHeader.styles.ts","packages/components/modal/src/ModalContent/ModalContent.tsx","packages/components/modal/src/ModalContent/ModalContent.styles.ts","packages/components/modal/src/Modal.styles.ts","packages/components/modal/src/ModalControls/ModalControls.tsx","packages/components/modal/src/ModalConfirm/ModalConfirm.tsx","packages/components/modal/src/ModalLauncher/ModalLauncher.tsx"],"sourcesContent":["export * from './src/index';\n","export { Modal } from './CompoundModal';\nexport type { ModalProps } from './Modal';\nexport { ModalConfirm } from './ModalConfirm/ModalConfirm';\nexport type { ModalConfirmProps } from './ModalConfirm/ModalConfirm';\nexport { ModalContent } from './ModalContent/ModalContent';\nexport type { ModalContentProps } from './ModalContent/ModalContent';\nexport { ModalControls } from './ModalControls/ModalControls';\nexport type { ModalControlsProps } from './ModalControls/ModalControls';\nexport { ModalHeader } from './ModalHeader/ModalHeader';\nexport type { ModalHeaderProps } from './ModalHeader/ModalHeader';\nexport { ModalLauncher } from './ModalLauncher/ModalLauncher';\n","import { Modal as OriginalModal } from './Modal';\nimport { ModalContent } from './ModalContent/ModalContent';\nimport { ModalHeader } from './ModalHeader/ModalHeader';\nimport { ModalControls } from './ModalControls/ModalControls';\n\ntype CompoundModal = typeof OriginalModal & {\n Content: typeof ModalContent;\n Header: typeof ModalHeader;\n Controls: typeof ModalControls;\n};\n\nexport const Modal = OriginalModal as CompoundModal;\nModal.Content = ModalContent;\nModal.Header = ModalHeader;\nModal.Controls = ModalControls;\n","import * as React from 'react';\nimport ReactModal from 'react-modal';\n\nimport { Box } from '@contentful/f36-core';\nimport type { CommonProps } from '@contentful/f36-core';\n\nimport { ModalHeader, ModalHeaderProps } from './ModalHeader/ModalHeader';\nimport { ModalContent, ModalContentProps } from './ModalContent/ModalContent';\nimport { getModalStyles } from './Modal.styles';\nimport type { ModalSizeType, ModalPositionType } from './types';\n\nconst ModalSizesMapper = {\n medium: '520px',\n small: '400px',\n large: '700px',\n fullWidth: '100vw',\n zen: '100vw',\n};\n\nexport interface ModalProps extends CommonProps {\n /**\n * When true, the dialog is shown.\n */\n isShown: boolean;\n\n /**\n * Function that will be run when the modal is requested to be closed, prior to actually closing.\n */\n onClose: ReactModal.Props['onRequestClose'];\n\n /**\n * Function that will be run after the modal has opened.\n */\n onAfterOpen?: ReactModal.Props['onAfterOpen'];\n\n /**\n * Additional aria attributes\n */\n aria?: ReactModal.Props['aria'];\n\n /**\n * Boolean indicating if clicking the overlay should close the overlay.\n * @default true\n */\n shouldCloseOnOverlayClick?: boolean;\n /**\n * Boolean indicating if pressing the esc key should close the overlay.\n * @default true\n */\n shouldCloseOnEscapePress?: boolean;\n /**\n * Indicating if modal is centered or linked to the top\n * @default center\n */\n position?: ModalPositionType;\n /**\n * Top offset if position is 'top'\n * @default 50px\n */\n topOffset?: number | string;\n /**\n * Modal title that is used in header\n */\n title?: string;\n /**\n * Size of the modal window\n * @default medium\n */\n size?: ModalSizeType;\n /**\n * Are modals higher than viewport allowed\n * @default false\n */\n allowHeightOverflow?: boolean;\n\n /**\n * Optional props to override ModalHeader behaviour\n */\n modalHeaderProps?: Partial<ModalHeaderProps>;\n\n /**\n * Optional props to override ModalContent behaviour\n */\n modalContentProps?: Partial<ModalContentProps>;\n\n /**\n * Optional property to set initial focus\n */\n initialFocusRef?: React.RefObject<HTMLElement>;\n\n children: React.ReactNode | RenderModal;\n}\n\ntype RenderModal = (modalProps: ModalProps) => React.ReactNode;\n\nfunction focusFirstWithinNode(node: HTMLElement) {\n if (node && node.querySelectorAll) {\n const elements = node.querySelectorAll('input, button');\n if (elements.length > 0) {\n const firstElement = elements[0];\n // @ts-expect-error focus might be missing\n if (typeof firstElement.focus === 'function') {\n // @ts-expect-error focus might be missing\n firstElement.focus();\n }\n }\n }\n}\n\nexport function Modal({\n allowHeightOverflow = false,\n position = 'center',\n shouldCloseOnEscapePress = true,\n shouldCloseOnOverlayClick = true,\n size = 'medium',\n testId = 'cf-ui-modal',\n topOffset = '50px',\n aria,\n ...otherProps\n}: ModalProps) {\n const contentRef = React.useRef<HTMLDivElement>(null);\n\n const props = {\n ...otherProps,\n allowHeightOverflow,\n position,\n shouldCloseOnEscapePress,\n shouldCloseOnOverlayClick,\n size,\n testId,\n topOffset,\n };\n\n const styles = getModalStyles({\n position,\n size,\n allowHeightOverflow,\n className: otherProps.className,\n });\n\n React.useEffect(() => {\n if (props.isShown) {\n setTimeout(() => {\n if (props.initialFocusRef && props.initialFocusRef.current) {\n if (props.initialFocusRef.current.focus) {\n props.initialFocusRef.current.focus();\n }\n } else if (contentRef.current) {\n focusFirstWithinNode(contentRef.current);\n }\n }, 100);\n }\n }, [props.isShown, props.initialFocusRef]);\n\n const renderDefault = () => {\n return (\n <React.Fragment>\n {otherProps.title && (\n <ModalHeader\n title={otherProps.title}\n onClose={props.onClose}\n {...otherProps.modalHeaderProps}\n />\n )}\n <ModalContent {...otherProps.modalContentProps}>\n {otherProps.children}\n </ModalContent>\n </React.Fragment>\n );\n };\n\n return (\n <ReactModal\n ariaHideApp={false}\n aria={aria}\n onRequestClose={props.onClose}\n isOpen={otherProps.isShown}\n onAfterOpen={props.onAfterOpen}\n shouldCloseOnEsc={shouldCloseOnEscapePress}\n shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n shouldFocusAfterRender\n shouldReturnFocusAfterClose\n portalClassName={styles.portal}\n className={{\n base: styles.base.root,\n afterOpen: styles.base.afterOpen,\n beforeClose: styles.base.beforeClose,\n }}\n style={{\n content: {\n top: position === 'center' ? 0 : topOffset,\n },\n }}\n overlayClassName={{\n base: styles.modalOverlay.root,\n afterOpen: styles.modalOverlay.afterOpen,\n beforeClose: styles.modalOverlay.beforeClose,\n }}\n closeTimeoutMS={300}\n contentRef={(ref) => {\n contentRef.current = ref;\n }}\n >\n <Box\n testId={testId}\n style={{\n width: ModalSizesMapper[size] || size,\n }}\n className={styles.modal}\n data-modal-root\n >\n {typeof otherProps.children === 'function'\n ? otherProps.children(props)\n : renderDefault()}\n </Box>\n </ReactModal>\n );\n}\n\nModal.displayName = 'Modal';\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { CloseIcon } from '@contentful/f36-icons';\nimport { Flex } from '@contentful/f36-core';\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Button } from '@contentful/f36-button';\nimport { Subheading } from '@contentful/f36-typography';\n\nimport { getModalHeaderStyles } from './ModalHeader.styles';\n\ninterface ModalHeaderInternalProps extends CommonProps {\n title: string;\n onClose?: Function;\n}\n\nexport type ModalHeaderProps = PropsWithHTMLElement<\n ModalHeaderInternalProps,\n 'div'\n>;\n\nexport function ModalHeader({\n onClose,\n title,\n testId = 'cf-ui-modal-header',\n className,\n ...otherProps\n}: ModalHeaderProps): React.ReactElement {\n const styles = getModalHeaderStyles();\n\n return (\n <Flex\n {...otherProps}\n className={cx(styles.root, className)}\n testId={testId}\n alignItems=\"center\"\n justifyContent=\"space-between\"\n >\n <Subheading as=\"h1\" isTruncated marginBottom=\"none\">\n {title}\n </Subheading>\n {onClose && (\n <Flex alignItems=\"center\" className={styles.buttonContainer}>\n <Button\n variant=\"transparent\"\n aria-label=\"Close\"\n startIcon={<CloseIcon size=\"small\" />}\n onClick={() => {\n onClose();\n }}\n size=\"small\"\n />\n </Flex>\n )}\n </Flex>\n );\n}\n\nModalHeader.displayName = 'ModalHeader';\n","import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\n\nexport function getModalHeaderStyles() {\n return {\n root: css({\n position: 'relative',\n padding: `${tokens.spacingM} ${tokens.spacingM} ${tokens.spacingM} ${tokens.spacingL}`,\n borderRadius: `${tokens.borderRadiusMedium} ${tokens.borderRadiusMedium} 0 0`,\n borderBottom: `1px solid ${tokens.gray300}`,\n }),\n buttonContainer: css({\n position: 'relative',\n width: tokens.spacing2Xl,\n height: tokens.spacingL,\n button: {\n position: 'absolute',\n top: `calc(-1 * ${tokens.spacing2Xs})`,\n right: 0,\n },\n }),\n };\n}\n","import React from 'react';\nimport { cx } from 'emotion';\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Box } from '@contentful/f36-core';\nimport { getModalContentStyles } from './ModalContent.styles';\n\ninterface ModalContentInternalProps extends CommonProps {\n children: React.ReactNode;\n}\n\nexport type ModalContentProps = PropsWithHTMLElement<\n ModalContentInternalProps,\n 'div'\n>;\n\nexport function ModalContent({\n testId = 'cf-ui-modal-content',\n className,\n children,\n ...otherProps\n}: ModalContentProps) {\n const styles = getModalContentStyles();\n return (\n <Box\n {...otherProps}\n as=\"div\"\n className={cx(styles.root, className)}\n testId={testId}\n >\n {children}\n </Box>\n );\n}\n\nModalContent.displayName = 'ModalContent';\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport function getModalContentStyles() {\n return {\n root: css({\n padding: `${tokens.spacingM} ${tokens.spacingL}`,\n color: tokens.gray700,\n fontSize: tokens.fontSizeM,\n fontFamily: tokens.fontStackPrimary,\n lineHeight: tokens.lineHeightM,\n overflowY: 'auto',\n overflowX: 'auto',\n boxSizing: 'border-box',\n }),\n };\n}\n","import tokens from '@contentful/f36-tokens';\nimport { css, cx } from 'emotion';\nimport type { ModalPositionType, ModalSizeType } from './types';\n\nexport function getModalStyles(props: {\n size: ModalSizeType;\n position: ModalPositionType;\n allowHeightOverflow?: boolean;\n className?: string;\n}) {\n const modal = cx(\n css({\n transition: `opacity ${tokens.transitionDurationLong} ${tokens.transitionEasingDefault}, transform ${tokens.transitionDurationDefault} ${tokens.transitionEasingCubicBezier}`,\n opacity: '0.5',\n margin: tokens.spacing2Xl,\n transform: 'scale(0.85)',\n backgroundColor: tokens.colorWhite,\n borderRadius: tokens.borderRadiusMedium,\n boxShadow: tokens.boxShadowHeavy,\n maxHeight: `calc(100vh - 1rem * (100 / ${tokens.fontBaseDefault}))`,\n maxWidth: `calc(100vw - 1rem * (100 / ${tokens.fontBaseDefault}))`,\n overflow: 'hidden',\n display: 'flex',\n flexDirection: 'column',\n }),\n props.allowHeightOverflow\n ? css({\n overflow: 'auto',\n maxHeight: 'none',\n })\n : null,\n props.size === 'zen'\n ? css({\n maxWidth: 'none',\n maxHeight: 'none',\n margin: 0,\n height: '100%',\n width: '100%',\n })\n : null,\n props.className,\n );\n\n return {\n portal: css({\n display: 'block',\n }),\n base: {\n root: cx(\n css({\n zIndex: tokens.zIndexModalContent,\n position: 'relative',\n padding: 0,\n display: 'inline-block',\n margin: '0 auto',\n textAlign: 'left',\n outline: 'none',\n }),\n props.size === 'zen'\n ? css({\n width: '100%',\n height: '100%',\n })\n : null,\n ),\n afterOpen: css({\n '[data-modal-root]': {\n transform: 'scale(1)',\n opacity: '1',\n },\n }),\n beforeClose: css({\n '[data-modal-root]': {\n opacity: '0.5',\n transform: 'scale(0.85)',\n },\n }),\n },\n modalOverlay: {\n root: cx(\n css({\n display: 'flex',\n alignItems: 'baseline',\n flexWrap: 'wrap',\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n zIndex: tokens.zIndexModal,\n opacity: 0,\n transition: `opacity ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n position: 'fixed',\n overflowY: 'auto',\n backgroundColor: 'rgba(12, 20, 28, 0.74902)',\n textAlign: 'center',\n }),\n props.position === 'center'\n ? css({\n alignItems: 'center',\n justifyContent: 'center',\n })\n : null,\n ),\n afterOpen: css({\n opacity: '1 !important',\n }),\n beforeClose: css({\n opacity: 0,\n }),\n },\n modal,\n };\n}\n","import React from 'react';\n\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Flex } from '@contentful/f36-core';\nimport { ButtonGroup } from '@contentful/f36-button';\n\ninterface ModalControlsInternalProps extends CommonProps {\n children: React.ReactElement[] | React.ReactElement;\n}\n\nexport type ModalControlsProps = PropsWithHTMLElement<\n ModalControlsInternalProps,\n 'div'\n>;\n\nexport function ModalControls({\n testId = 'cf-ui-modal-controls',\n className,\n children,\n ...otherProps\n}: ModalControlsProps): React.ReactElement {\n return (\n <Flex\n {...otherProps}\n className={className}\n testId={testId}\n flexDirection=\"row\"\n justifyContent=\"flex-end\"\n margin=\"spacingL\"\n marginTop=\"none\"\n >\n <ButtonGroup variant=\"spaced\" spacing=\"spacingS\">\n {children}\n </ButtonGroup>\n </Flex>\n );\n}\n\nModalControls.displayName = 'ModalControls';\n","import React from 'react';\n\nimport { Modal } from '../CompoundModal';\nimport { ModalProps } from '../Modal';\nimport type { ModalSizeType } from '../types';\nimport type { ModalHeaderProps } from '../ModalHeader/ModalHeader';\nimport type { ModalContentProps } from '../ModalContent/ModalContent';\nimport type { ModalControlsProps } from '../ModalControls/ModalControls';\nimport { Button } from '@contentful/f36-button';\n\nexport interface ModalConfirmProps {\n /**\n * When true, the dialog is shown.\n */\n isShown: boolean;\n /**\n * Function that will be called when the confirm button is clicked. This does not close the ModalConfirm.\n */\n onConfirm(): void;\n /**\n * Function that will be called when the cancel button is clicked. This does not close the ModalConfirm.\n */\n onCancel: ModalProps['onClose'];\n /**\n Modal title that is used in header\n */\n title?: string;\n /**\n * Label of the confirm button\n */\n confirmLabel?: string | false;\n /**\n * Label of the cancel button\n */\n cancelLabel?: string | false;\n /**\n * The intent of the ModalConfirm. Used for the Button.\n */\n intent?: 'primary' | 'positive' | 'negative';\n /**\n Size of the modal window\n */\n size?: ModalSizeType;\n /**\n * Boolean indicating if clicking the overlay should close the overlay.\n */\n shouldCloseOnOverlayClick?: boolean;\n /**\n * Boolean indicating if pressing the esc key should close the overlay.\n */\n shouldCloseOnEscapePress?: boolean;\n /**\n * When true, the confirm button is set to disabled.\n */\n isConfirmDisabled?: boolean;\n /**\n * When true, the confirm button is set to loading.\n */\n isConfirmLoading?: boolean;\n /**\n * Are modals higher than viewport allowed\n */\n allowHeightOverflow?: boolean;\n\n /**\n * Optional props to override ModalHeader behaviour\n */\n modalHeaderProps?: Partial<ModalHeaderProps>;\n\n /**\n * Optional props to override ModalContent behaviour\n */\n modalContentProps?: Partial<ModalContentProps>;\n\n /**\n * Optional props to override ModalControl behaviour\n */\n modalControlsProps?: Partial<ModalControlsProps>;\n\n /**\n * Optional property to set initial focus\n */\n initialFocusRef?: React.RefObject<HTMLElement>;\n\n testId?: string;\n confirmTestId?: string;\n cancelTestId?: string;\n children: React.ReactNode;\n}\n\nexport function ModalConfirm({\n allowHeightOverflow = false,\n cancelLabel = 'Cancel',\n cancelTestId = 'cf-ui-modal-confirm-cancel-button',\n children,\n confirmLabel = 'Confirm',\n confirmTestId = 'cf-ui-modal-confirm-confirm-button',\n intent = 'positive',\n isConfirmDisabled = false,\n isConfirmLoading = false,\n isShown,\n modalContentProps,\n modalControlsProps,\n modalHeaderProps,\n onCancel,\n onConfirm,\n shouldCloseOnEscapePress = true,\n shouldCloseOnOverlayClick = true,\n size = 'medium',\n testId = 'cf-ui-modal-confirm',\n title = 'Are you sure?',\n initialFocusRef,\n}: ModalConfirmProps) {\n const cancelRef = React.useRef(null);\n\n const confirmButton = confirmLabel ? (\n <Button\n testId={confirmTestId}\n isDisabled={isConfirmDisabled}\n isLoading={isConfirmLoading}\n variant={intent}\n size=\"small\"\n onClick={() => onConfirm()}\n >\n {confirmLabel}\n </Button>\n ) : null;\n\n const cancelButton = cancelLabel ? (\n <Button\n testId={cancelTestId}\n variant=\"secondary\"\n onClick={onCancel}\n size=\"small\"\n ref={initialFocusRef || cancelRef}\n >\n {cancelLabel}\n </Button>\n ) : null;\n\n return (\n <Modal\n testId={testId}\n isShown={isShown}\n onClose={onCancel}\n size={size}\n shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n shouldCloseOnEscapePress={shouldCloseOnEscapePress}\n allowHeightOverflow={allowHeightOverflow}\n initialFocusRef={cancelRef}\n >\n {() => {\n return (\n <React.Fragment>\n <Modal.Header title={title || ''} {...modalHeaderProps} />\n <Modal.Content {...modalContentProps}>{children}</Modal.Content>\n <Modal.Controls {...modalControlsProps}>\n {cancelButton}\n {confirmButton}\n </Modal.Controls>\n </React.Fragment>\n );\n }}\n </Modal>\n );\n}\n\nModalConfirm.displayName = 'ModalConfirm';\n","/* global Promise */\nimport ReactDOM from 'react-dom';\n\n// @todo: change any to unknown\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ninterface ModalLauncherComponentRendererProps<T = any> {\n isShown: boolean;\n onClose: (result?: T) => void;\n}\n\ninterface ModalLauncherOpenOptions {\n /**\n * Unique id to be used as identifier for the modal contianer\n */\n modalId?: string;\n /**\n * ms before removing the component from the tree\n * @default 300\n */\n delay?: number;\n}\n\ninterface CloseModalData {\n delay: number;\n render: (args: ModalLauncherComponentRendererProps<any>) => void;\n currentConfig: ModalLauncherComponentRendererProps<any>;\n}\n\nconst getRoot = (rootElId: string): HTMLElement => {\n // Reuse the container if we find it\n let rootDom = document.getElementById(rootElId);\n if (rootDom !== null) {\n return rootDom;\n }\n\n // Otherwise create it\n rootDom = document.createElement('div');\n rootDom.setAttribute('id', rootElId);\n document.body.appendChild(rootDom);\n return rootDom;\n};\n\nconst openModalsIds: Map<string, CloseModalData> = new Map();\nfunction closeAll() {\n openModalsIds.forEach(async ({ render, currentConfig, delay }, rootElId) => {\n const config = { ...currentConfig, isShown: false };\n render(config);\n await new Promise((resolveDelay) => setTimeout(resolveDelay, delay));\n ReactDOM.unmountComponentAtNode(getRoot(rootElId));\n openModalsIds.delete(rootElId);\n });\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction open<T = any>(\n componentRenderer: (\n props: ModalLauncherComponentRendererProps<T>,\n ) => JSX.Element,\n options: ModalLauncherOpenOptions = {},\n): Promise<T> {\n options = { delay: 300, ...options };\n\n // Allow components to specify if they wish to reuse the modal container\n const rootElId = `modals-root${options.modalId || Date.now()}`;\n const rootDom = getRoot(rootElId);\n\n return new Promise((resolve) => {\n let currentConfig = { onClose, isShown: true };\n\n function render({\n onClose,\n isShown,\n }: ModalLauncherComponentRendererProps<T>) {\n ReactDOM.render(componentRenderer({ onClose, isShown }), rootDom);\n }\n\n async function onClose(arg?: T) {\n currentConfig = {\n ...currentConfig,\n isShown: false,\n };\n render(currentConfig);\n await new Promise((resolveDelay) =>\n setTimeout(resolveDelay, options.delay),\n );\n ReactDOM.unmountComponentAtNode(rootDom);\n rootDom.remove();\n openModalsIds.delete(rootElId);\n resolve(arg);\n }\n\n render(currentConfig);\n openModalsIds.set(rootElId, {\n render,\n currentConfig,\n delay: options.delay,\n });\n });\n}\n\nexport const ModalLauncher = {\n open,\n closeAll,\n};\n"],"names":["Modal","ModalProps","ModalConfirm","ModalConfirmProps","ModalContent","ModalContentProps","ModalControls","ModalControlsProps","ModalHeader","ModalHeaderProps","ModalLauncher","OriginalModal","CompoundModal","Content","Header","Controls","React","ReactModal","Box","CommonProps","getModalStyles","ModalSizeType","ModalPositionType","ModalSizesMapper","medium","small","large","fullWidth","zen","isShown","onClose","Props","onAfterOpen","aria","shouldCloseOnOverlayClick","shouldCloseOnEscapePress","position","topOffset","title","size","allowHeightOverflow","modalHeaderProps","Partial","modalContentProps","initialFocusRef","RefObject","HTMLElement","children","ReactNode","RenderModal","modalProps","focusFirstWithinNode","node","querySelectorAll","elements","length","firstElement","focus","testId","otherProps","contentRef","useRef","HTMLDivElement","props","styles","className","useEffect","setTimeout","current","renderDefault","portal","base","root","afterOpen","beforeClose","content","top","modalOverlay","ref","width","modal","displayName","CloseIcon","Flex","PropsWithHTMLElement","Button","Subheading","getModalHeaderStyles","ModalHeaderInternalProps","Function","ReactElement","buttonContainer","tokens","padding","spacingM","spacingL","borderRadius","borderRadiusMedium","borderBottom","gray300","spacing2Xl","height","button","spacing2Xs","right","getModalContentStyles","ModalContentInternalProps","color","gray700","fontSize","fontSizeM","fontFamily","fontStackPrimary","lineHeight","lineHeightM","overflowY","overflowX","boxSizing","transition","transitionDurationLong","transitionEasingDefault","transitionDurationDefault","transitionEasingCubicBezier","opacity","margin","transform","backgroundColor","colorWhite","boxShadow","boxShadowHeavy","maxHeight","fontBaseDefault","maxWidth","overflow","display","flexDirection","zIndex","zIndexModalContent","textAlign","outline","alignItems","flexWrap","bottom","left","zIndexModal","ButtonGroup","ModalControlsInternalProps","onConfirm","onCancel","confirmLabel","cancelLabel","intent","isConfirmDisabled","isConfirmLoading","modalControlsProps","confirmTestId","cancelTestId","cancelRef","confirmButton","cancelButton","ReactDOM","ModalLauncherComponentRendererProps","result","T","ModalLauncherOpenOptions","modalId","delay","CloseModalData","render","args","currentConfig","getRoot","rootElId","rootDom","document","getElementById","createElement","setAttribute","body","appendChild","openModalsIds","Map","closeAll","forEach","config","Promise","resolveDelay","unmountComponentAtNode","delete","open","componentRenderer","JSX","Element","options","Date","now","resolve","arg","remove","set"],"version":3,"file":"main.js.map"}
1
+ {"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;SKGgBuF,yCAAT,GAAgC,CAAvC;IACE,MAAA,CAAO,CAAP;QACEb,IAAI,EAAA,EAAE,AAAF,SAAE,AAAF,EAAE,CAAA,kBAAA,CAAI,CAAVA;YACEtC,QAAQ,EAAE,CADF;YAERyD,OAAO,KAAKD,oDAAM,CAACE,QAAS,CAAA,CAAA,EAAGF,oDAAM,CAACE,QAAS,CAAA,CAAA,EAAGF,oDAAM,CAACE,QAAS,CAAA,CAAA,EAAGF,oDAAM,CAACG,QAAS;YACrFC,YAAY,KAAKJ,oDAAM,CAACK,kBAAmB,CAAA,CAAA,EAAGL,oDAAM,CAACK,kBAAmB,CAAA,IAAA;YACxEC,YAAY,GAAG,UAAA,EAAYN,oDAAM,CAACO,OAAQ;QAJlC,CAAJ;QAMNR,eAAe,EAAA,EAAE,AAAF,SAAE,AAAF,EAAE,CAAA,kBAAA,CAAI,CAArBA;YACEvD,QAAQ,EAAE,CADS;YAEnB2C,KAAK,EAAEa,oDAAM,CAACQ,UAFK;YAGnBC,MAAM,EAAET,oDAAM,CAACG,QAHI;YAInBO,MAAM,EAAE,CAARA;gBACElE,QAAQ,EAAE,CADJ;gBAENoC,GAAG,GAAG,UAAA,EAAYoB,oDAAM,CAACW,UAAW,CAAA,CAAA;gBACpCC,KAAK,EAAE,CAAPA;YAHM,CAAA;QAJW,CAAJ;IAPZ,CAAP;AAkBD,CAAA;;;SDFehG,yCAAT,CAAqB,CAA5B,UACEsB,OAD0B,UAE1BQ,KAF0B,WAG1BoB,MAAM,GAAG,CAHiB,iCAI1BO,SAJ0B,MAKvBN,UAAH,CACClD,CANI,EAMkC,CANb;IAO1B,KAAA,CAAMuD,MAAM,GAAGuB,yCAAoB;IAEnC,MAAA,oEACG,6BAAD;WACM5B,UAAJ;QACA,SAAA,EAAW,iBAAA,CAAGK,MAAM,CAACU,IAAV,EAAgBT,SAAhB;QACX,MAAA,EAAQP,MAAD;QACP,UAAA,EAAW,CAJb;QAKE,cAAA,EAAe,CALjB;0EAOG,yCAAD;QAAY,EAAA,EAAG,CAAf;QAAoB,WAApB,EAAoB,IAApB;QAAgC,YAAA,EAAa,CAA7C;OACGpB,KAAD,GAEDR,OAAO,uEACL,6BAAD;QAAM,UAAA,EAAW,CAAjB;QAA0B,SAAA,EAAWkC,MAAM,CAAC2B,eAAR;0EACjC,iCAAD;QACE,OAAA,EAAQ,CADV;QAEE,CAAA,aAAW,CAFb;QAGE,SAAA,qEAAY,mCAAD;YAAW,IAAA,EAAK,CAAhB;;QACX,OAAA,MAAe,CAJ3B;YAKc7D,OAAO;QACR,CAFO;QAGR,IAAA,EAAK,CAPP;;AAaT,CAAA;AAEDtB,yCAAW,CAACyE,WAAZ,GAA0B,CAA1B;;;;;;;;SGtDgBwB,yCAAT,GAAiC,CAAxC;IACE,MAAA,CAAO,CAAP;QACE/B,IAAI,EAAA,EAAE,AAAF,SAAE,AAAF,EAAE,CAAA,kBAAA,CAAI,CAAVA;YACEmB,OAAO,KAAKD,oDAAM,CAACE,QAAS,CAAA,CAAA,EAAGF,oDAAM,CAACG,QAAS;YAC/CY,KAAK,EAAEf,oDAAM,CAACgB,OAFN;YAGRC,QAAQ,EAAEjB,oDAAM,CAACkB,SAHT;YAIRC,UAAU,EAAEnB,oDAAM,CAACoB,gBAJX;YAKRC,UAAU,EAAErB,oDAAM,CAACsB,WALX;YAMRC,SAAS,EAAE,CANH;YAORC,SAAS,EAAE,CAPH;YAQRC,SAAS,EAAE,CAAXA;QARQ,CAAJ;IADD,CAAP;AAYD,CAAA;;;SDDejH,yCAAT,CAAsB,CAA7B,SACEsD,MAAM,GAAG,CADkB,kCAE3BO,SAF2B,aAG3BlB,QAH2B,MAIxBY,UAAH,CACCtD,CALI,EAKe,CALO;IAM3B,KAAA,CAAM2D,MAAM,GAAGyC,yCAAqB;IACpC,MAAA,oEACG,4BAAD;WACM9C,UAAJ;QACA,EAAA,EAAG,CAFL;QAGE,SAAA,EAAW,iBAAA,CAAGK,MAAM,CAACU,IAAV,EAAgBT,SAAhB;QACX,MAAA,EAAQP,MAAD;OAENX,QAAD;AAGL,CAAA;AAED3C,yCAAY,CAAC6E,WAAb,GAA2B,CAA3B;;;;;;SE9BgB7D,yCAAT,CAAwB2C,KAAxB,EAKJ,CALmC;IAMpC,KAAA,CAAMiB,KAAK,GAAG,iBAAA,CAAA,EACZ,AADY,SACZ,AADY,EACZ,CAAA,kBAAA,CAAI,CADN;QAEIsC,MAAM,EAAE1B,oDAAM,CAACQ,UADb;QAEFmB,eAAe,EAAE3B,oDAAM,CAAC4B,UAFtB;QAGFxB,YAAY,EAAEJ,oDAAM,CAACK,kBAHnB;QAIFwB,SAAS,EAAE7B,oDAAM,CAAC8B,cAJhB;QAKFC,SAAS,GAAG,2BAAA,EAA6B/B,oDAAM,CAACgC,eAAgB,CAAA,EAAA;QAChEC,QAAQ,GAAG,2BAAA,EAA6BjC,oDAAM,CAACgC,eAAgB,CAAA,EAAA;QAC/DE,QAAQ,EAAE,CAPR;QAQFC,OAAO,EAAE,CARP;QASFC,aAAa,EAAE,CAAfA;IATE,CAAJ,GAWAjE,KAAK,CAACvB,mBAAN,GAAA,EACI,AADJ,SACI,AADJ,EACI,CAAA,kBAZA,CAAA,CAAA;QAYA,IAAA,EAAA,CAAA;QAAA,MAAA,EAAA,CAAA;IAAA,CAAA,IAIA,IAjBQ,EAkBZuB,KAAK,CAACxB,IAAN,KAAe,CAAf,OAAA,EACI,AADJ,SACI,AADJ,EACI,CAAA,kBANA,CAAA,CAAA;QAMA,IAAA,EAAA,CAAA;QAAA,MAAA,EAAA,CAAA;IAAA,CAAA,IAOA,IA1BQ,EA2BZwB,KAAK,CAACE,SA3BM;IA8Bd,MAAA,CAAO,CAAP;QACEK,MAAM,EAAA,EAAE,AAAF,SAAE,AAAF,EAAE,CAAA,kBAARA,CAAAA,CAAAA;YAAQ,IAAA,EAAA,CAAA;YAAA,MAAA,EAAA,CAAA;QAAA,CAAA;QAGRG,IAAI,EAAE,CAANA;YACEC,IAAI,EAAE,iBAAA,CAAA,EACJ,AADI,SACJ,AADI,EACJ,CAAA,kBAAA,CAAI,CADNA;gBAEIuD,MAAM,EAAErC,oDAAM,CAACsC,kBADb;gBAEF9F,QAAQ,EAAE,CAFR;gBAGFyD,OAAO,EAAE,CAHP;gBAIFkC,OAAO,EAAE,CAJP;gBAKFT,MAAM,EAAE,CALN;gBAMFa,SAAS,EAAE,CANT;gBAOFC,OAAO,EAAE,CAPP;gBAQFC,SAAS,EAAE,CART;gBASFC,UAAU,GAAG,UAAA,EAAY1C,oDAAM,CAAC2C,yBAA0B,CAAA,CAAA,EAAG3C,oDAAM,CAAC4C,uBAAwB;YAT1F,CAAJ,GAWAzE,KAAK,CAACxB,IAAN,KAAe,CAAf,OAAA,EACI,AADJ,SACI,AADJ,EACI,CAAA,kBAZA,CAAA,CAAA;gBAYA,IAAA,EAAA,CAAA;gBAAA,MAAA,EAAA,CAAA;YAAA,CAAA,IAIA,IAjBA;YAmBNoC,SAAS,EAAA,EAAE,AAAF,SAAE,AAAF,EAAE,CAAA,kBAAXA,CAAAA,CAAAA;gBAAW,IAAA,EAAA,CAAA;gBAAA,MAAA,EAAA,CAAA;YAAA,CAAA;YAGXC,WAAW,EAAA,EAAE,AAAF,SAAE,AAAF,EAAE,CAAA,kBAAbA,CAAAA,CAAAA;gBAAa,IAAA,EAAA,CAAA;gBAAA,MAAA,EAAA,CAAA;YAAA,CAAA;QAvBT,CAJD;QA+BLC,YAAY,EAAE,CAAdA;YACEH,IAAI,EAAE,iBAAA,CAAA,EACJ,AADI,SACJ,AADI,EACJ,CAAA,kBAAA,CAAI,CADNA;gBAEIqD,OAAO,EAAE,CADP;gBAEFU,UAAU,EAAE,CAFV;gBAGFC,QAAQ,EAAE,CAHR;gBAIFlE,GAAG,EAAE,CAJH;gBAKFgC,KAAK,EAAE,CALL;gBAMFmC,MAAM,EAAE,CANN;gBAOFC,IAAI,EAAE,CAPJ;gBAQFX,MAAM,EAAErC,oDAAM,CAACiD,WARb;gBASFC,OAAO,EAAE,CATP;gBAUFR,UAAU,GAAG,QAAA,EAAU1C,oDAAM,CAAC2C,yBAA0B,CAAA,CAAA,EAAG3C,oDAAM,CAAC4C,uBAAwB;gBAC1FpG,QAAQ,EAAE,CAXR;gBAYF+E,SAAS,EAAE,CAZT;gBAaFI,eAAe,EAAE,CAbf;gBAcFY,SAAS,EAAE,CAAXA;YAdE,CAAJ,GAgBApE,KAAK,CAAC3B,QAAN,KAAmB,CAAnB,UAAA,EACI,AADJ,SACI,AADJ,EACI,CAAA,kBAjBA,CAAA,CAAA;gBAiBA,IAAA,EAAA,CAAA;gBAAA,MAAA,EAAA,CAAA;YAAA,CAAA,IAIA,IAtBA;YAwBNuC,SAAS,EAAA,EAAE,AAAF,SAAE,AAAF,EAAE,CAAA,kBAAXA,CAAAA,CAAAA;gBAAW,IAAA,EAAA,CAAA;gBAAA,MAAA,EAAA,CAAA;YAAA,CAAA;YAGXC,WAAW,EAAA,EAAE,AAAF,SAAE,AAAF,EAAE,CAAA,kBAAbA,CAAAA,CAAAA;gBAAa,IAAA,EAAA,CAAA;gBAAA,MAAA,EAAA,CAAA;YAAA,CAAA;QA5BD,CA/BT;eA+DLI,KAAAA;IA/DK,CAAP;AAiED,CAAA;;;AL9FD,KAAA,CAAMzD,sCAAgB,GAAG,CAAzB;IACEC,MAAM,EAAE,CADe;IAEvBC,KAAK,EAAE,CAFgB;IAGvBC,KAAK,EAAE,CAHgB;IAIvBC,SAAS,EAAE,CAJY;IAKvBC,GAAG,EAAE,CAALA;AALuB,CAAzB;SAoFSuB,0CAAT,CAA8BC,IAA9B,EAAiD,CAAjD;IACE,EAAA,EAAIA,IAAI,IAAIA,IAAI,CAACC,gBAAjB,EAAmC,CAAnC;QACE,KAAA,CAAMC,QAAQ,GAAGF,IAAI,CAACC,gBAAL,CAAsB,CAAtB;QACjB,EAAA,EAAIC,QAAQ,CAACC,MAAT,GAAkB,CAAtB,EAAyB,CAAzB;YACE,KAAA,CAAMC,YAAY,GAAGF,QAAQ,CAAC,CAAD,EAC7B,CADA,AACA,EADA,AACA,wCADA;YAEA,EAAA,EAAI,MAAA,CAAOE,YAAY,CAACC,KAApB,KAA8B,CAAlC,WACE,EAAA,AAAA,wCAAA;YACAD,YAAY,CAACC,KAAb;QAEH,CAAA;IACF,CAAA;AACF,CAAA;SAEezD,yCAAT,CAAe,CAAtB,sBACEwC,mBAAmB,GAAG,KADF,aAEpBJ,QAAQ,GAAG,CAFS,oCAGpBD,wBAAwB,GAAG,IAHP,8BAIpBD,yBAAyB,GAAG,IAJR,SAKpBK,IAAI,GAAG,CALa,kBAMpBmB,MAAM,GAAG,CANW,0BAOpBrB,SAAS,GAAG,CAPQ,cAQpBJ,IARoB,MASjB0B,UAAH,CACC1D,CAVI,EAUQ,CAVO;IAWpB,KAAA,CAAM2D,UAAU,GAAG5C,mBAAY,CAAiB,IAA7B;IAEnB,KAAA,CAAM+C,KAAK,GAAG,CAAA;WACTJ,UADS;6BAEZnB,mBAFY;kBAGZJ,QAHY;kCAIZD,wBAJY;mCAKZD,yBALY;cAMZK,IANY;gBAOZmB,MAPY;mBAQZrB,SAAAA;IARY,CAAd;IAWA,KAAA,CAAM2B,MAAM,GAAG5C,yCAAc,CAAC,CAA9B;kBACEgB,QAD4B;cAE5BG,IAF4B;6BAG5BC,mBAH4B;QAI5ByB,SAAS,EAAEN,UAAU,CAACM,SAAtBA;IAJ4B,CAAD;IAO7BjD,sBAAA,KAAsB,CAAtBA;QACE,EAAA,EAAI+C,KAAK,CAAClC,OAAV,EACEsC,UAAU,KAAO,CAAjBA;YACE,EAAA,EAAIJ,KAAK,CAACnB,eAAN,IAAyBmB,KAAK,CAACnB,eAAN,CAAsBwB,OAAnD,EACE,CAAA;gBAAA,EAAA,EAAIL,KAAK,CAACnB,eAAN,CAAsBwB,OAAtB,CAA8BX,KAAlC,EACEM,KAAK,CAACnB,eAAN,CAAsBwB,OAAtB,CAA8BX,KAA9B;YACD,CAAA,MACI,EAAA,EAAIG,UAAU,CAACQ,OAAf,EACLjB,0CAAoB,CAACS,UAAU,CAACQ,OAAZ;QAEvB,CARS,EAQP,GARO;IAUb,CAZD,EAYG,CAACL;QAAAA,KAAK,CAAClC,OAAP;QAAgBkC,KAAK,CAACnB,eAAtB;IAAA,CAZH;IAcA,KAAA,CAAMyB,aAAa,OAAS,CAA5B;QACE,MAAA,0CACG,qBAAD,QACGV,UAAU,CAACrB,KAAX,6CACE,yCAAD;YACE,KAAA,EAAOqB,UAAU,CAACrB,KAAZ;YACN,OAAA,EAASyB,KAAK,CAACjC,OAAP;eACJ6B,UAAU,CAAClB,gBAAf;qDAGH,yCAAD,EAAkBkB,UAAU,CAAChB,iBAAf,EACXgB,UAAU,CAACZ,QAAZ;IAIP,CAfD;IAiBA,MAAA,0CACG,2CAAD;QACE,WAAA,EAAa,KAAD;QACZ,IAAA,EAAMd,IAAD;QACL,cAAA,EAAgB8B,KAAK,CAACjC,OAAP;QACf,MAAA,EAAQ6B,UAAU,CAAC9B,OAAZ;QACP,WAAA,EAAakC,KAAK,CAAC/B,WAAP;QACZ,gBAAA,EAAkBG,wBAAD;QACjB,yBAAA,EAA2BD,yBAAD;QAC1B,sBARF,EAQE,IARF;QASE,2BATF,EASE,IATF;QAUE,eAAA,EAAiB8B,MAAM,CAACM,MAAR;QAChB,KAAA,EAAO,CAZX;YAaMC,OAAO,EAAE,CAATA;gBACEC,GAAG,EAAEpC,QAAQ,KAAK,CAAb,UAAwB,CAAxB,GAA4BC,SAAjCmC;YADO,CAAA;QADJ,CAAD;QAKN,SAAA,EAAW,CALJ;YAMLC,IAAI,EAAET,MAAM,CAACS,IAAP,CAAYC,IADT;YAETC,SAAS,EAAEX,MAAM,CAACS,IAAP,CAAYE,SAFd;YAGTC,WAAW,EAAEZ,MAAM,CAACS,IAAP,CAAYG,WAAzBA;QAHS,CAAD;QAKV,gBAAA,EAAkB,CALP;YAMTH,IAAI,EAAET,MAAM,CAACa,YAAP,CAAoBH,IADV;YAEhBC,SAAS,EAAEX,MAAM,CAACa,YAAP,CAAoBF,SAFf;YAGhBC,WAAW,EAAEZ,MAAM,CAACa,YAAP,CAAoBD,WAAjCA;QAHgB,CAAD;QAKjB,cAAA,EAAgB,GAAD;QACf,UAAA,GAAaE,GAAD,GAAS,CANH;YAOhBlB,UAAU,CAACQ,OAAX,GAAqBU,GAArB;QACD,CAFU;gDAIV,4BAAD;QACE,MAAA,EAAQpB,MAAD;QACP,KAAA,EAAO,CAFf;YAGUqB,KAAK,EAAExD,sCAAgB,CAACgB,IAAD,KAAUA,IAAjCwC;QADK,CAAD;QAGN,SAAA,EAAWf,MAAM,CAACgB,KAAR;QACV,CANF,kBAME,IANF;OAQG,MAAA,CAAOrB,UAAU,CAACZ,QAAlB,KAA+B,CAA/B,YACGY,UAAU,CAACZ,QAAX,CAAoBgB,KAApB,IACAM,aAAa;AAIxB,CAAA;AAEDrE,yCAAK,CAACiF,WAAN,GAAoB,CAApB;;;;;;;;SM5MgB3E,yCAAT,CAAuB,CAA9B,SACEoD,MAAM,GAAG,CADmB,mCAE5BO,SAF4B,aAG5BlB,QAH4B,MAIzBY,UAAH,CACCpD,CALI,EAKoC,CALb;IAM5B,MAAA,oEACG,6BAAD;WACMoD,UAAJ;QACA,SAAA,EAAWM,SAAD;QACV,MAAA,EAAQP,MAAD;QACP,aAAA,EAAc,CAJhB;QAKE,cAAA,EAAe,CALjB;QAME,MAAA,EAAO,CANT;QAOE,SAAA,EAAU,CAPZ;0EASG,sCAAD;QAAa,OAAA,EAAQ,CAArB;QAA8B,OAAA,EAAQ,CAAtC;OACGX,QAAD;AAIP,CAAA;AAEDzC,yCAAa,CAAC2E,WAAd,GAA4B,CAA5B;;;AP3BO,KAAA,CAAMjF,yCAAK,GAAGW,yCAAa;AAClCX,yCAAK,CAACa,OAAN,GAAgBT,yCAAhB;AACAJ,yCAAK,CAACc,MAAN,GAAeN,yCAAf;AACAR,yCAAK,CAACe,QAAN,GAAiBT,yCAAjB;;;;;;SQ4EgBJ,yCAAT,CAAsB,CAA7B,sBACEsC,mBAAmB,GAAG,KADK,gBAE3B4G,WAAW,GAAG,CAFa,wBAG3BM,YAAY,GAAG,CAHY,+CAI3B3G,QAJ2B,iBAK3BoG,YAAY,GAAG,CALY,0BAM3BM,aAAa,GAAG,CANW,8CAO3BJ,MAAM,GAAG,CAPkB,+BAQ3BC,iBAAiB,GAAG,KARO,qBAS3BC,gBAAgB,GAAG,KATQ,YAU3B1H,OAV2B,sBAW3Bc,iBAX2B,uBAY3B6G,kBAZ2B,qBAa3B/G,gBAb2B,aAc3ByG,QAd2B,cAe3BD,SAf2B,6BAgB3B9G,wBAAwB,GAAG,IAhBA,8BAiB3BD,yBAAyB,GAAG,IAjBD,SAkB3BK,IAAI,GAAG,CAlBoB,kBAmB3BmB,MAAM,GAAG,CAnBkB,8BAoB3BpB,KAAK,GAAG,CApBmB,kCAqB3BM,eAAAA,EACCzC,CAtBI,EAsBe,CAtBO;IAuB3B,KAAA,CAAMwJ,SAAS,GAAG3I,sCAAK,CAAC6C,MAAN,CAAa,IAAb;IAElB,KAAA,CAAM+F,aAAa,GAAGT,YAAY,sEAC/B,iCAAD;QACE,MAAA,EAAQM,aAAD;QACP,UAAA,EAAYH,iBAAD;QACX,SAAA,EAAWC,gBAAD;QACV,OAAA,EAASF,MAAD;QACR,IAAA,EAAK,CALP;QAME,OAAA,MAAeJ,SAAS;OAEvBE,YAAD,IAEA,IAXJ;IAaA,KAAA,CAAMU,YAAY,GAAGT,WAAW,sEAC7B,iCAAD;QACE,MAAA,EAAQM,YAAD;QACP,OAAA,EAAQ,CAFV;QAGE,OAAA,EAASR,QAAD;QACR,IAAA,EAAK,CAJP;QAKE,GAAA,EAAKtG,eAAe,IAAI+G,SAApB;OAEHP,WAAD,IAEA,IAVJ;IAYA,MAAA,oEACG,yCAAD;QACE,MAAA,EAAQ1F,MAAD;QACP,OAAA,EAAS7B,OAAD;QACR,OAAA,EAASqH,QAAD;QACR,IAAA,EAAM3G,IAAD;QACL,yBAAA,EAA2BL,yBAAD;QAC1B,wBAAA,EAA0BC,wBAAD;QACzB,mBAAA,EAAqBK,mBAAD;QACpB,eAAA,EAAiBmH,SAAD;WAET,CAAb;QACQ,MAAA,oEACG,sCAAA,CAAM,QAAP,2EACG,yCAAA,CAAM,MAAP;YAAc,KAAA,EAAOrH,KAAK,IAAI,CAAV;eAAkBG,gBAAJ;+EACjC,yCAAA,CAAM,OAAP,EAAmBE,iBAAJ,EAAwBI,QAAD,sEACrC,yCAAA,CAAM,QAAP,EAAoByG,kBAAJ,EACbK,YAAD,EACCD,aAAD;IAIP,CAXD;AAcL,CAAA;AAED1J,yCAAY,CAAC+E,WAAb,GAA2B,CAA3B;;;;;;;AC3IA,KAAA,CAAMwF,6BAAO,IAAIC,QAAD,GAAmC,CAAnD;IACE,EAAA,AAAA,kCAAA;IACA,GAAA,CAAIC,OAAO,GAAGC,QAAQ,CAACC,cAAT,CAAwBH,QAAxB;IACd,EAAA,EAAIC,OAAO,KAAK,IAAhB,EACE,MAAA,CAAOA,OAAP;IAGF,CAFC,AAED,EAFC,AAED,oBAFC;IAGDA,OAAO,GAAGC,QAAQ,CAACE,aAAT,CAAuB,CAAvB;IACVH,OAAO,CAACI,YAAR,CAAqB,CAArB,KAA2BL,QAA3B;IACAE,QAAQ,CAACI,IAAT,CAAcC,WAAd,CAA0BN,OAA1B;IACA,MAAA,CAAOA,OAAP;AACD,CAZD;AAcA,KAAA,CAAMO,mCAAa,GAAgC,GAAA,CAAIC,GAAJ;SAC1CC,8BAAT,GAAoB,CAApB;IACEF,mCAAa,CAACG,OAAd,QAA6B,CAA7BH,SAA+BZ,MAAF,kBAAUE,aAAV,UAAyBJ,KAAAA,EAAzB,CAAP,EAAyCM,QAAzC,GAAsD,CAA/C;QAC3B,KAAA,CAAMY,MAAM,GAAG,CAAA;eAAKd,aAAL;YAAoB3I,OAAO,EAAE,KAATA;QAApB,CAAf;QACAyI,MAAM,CAACgB,MAAD;QACN,KAAA,CAAM,GAAA,CAAIC,OAAJ,EAAaC,YAAD,GAAkBrH,UAAU,CAACqH,YAAD,EAAepB,KAAf;;QAC9CN,yCAAQ,CAAC2B,sBAAT,CAAgChB,6BAAO,CAACC,QAAD;QACvCQ,mCAAa,CAACQ,MAAd,CAAqBhB,QAArB;IACD,CAND;AAOD,C,AAED,CAFC,AAED,EAFC,AAED,4DAFC;SAGQiB,0BAAI,CACXC,iBADF,EAIEG,OAAiC,GAAG,CAAA;AAAA,CAJtC,EAKc,CALd;IAMEA,OAAO,GAAG,CAAVA;QAAY3B,KAAK,EAAE,GAAT;WAAiB2B,OAAH;IAAd,CAAV,CAEA,CAFU,AAEV,EAFU,AAEV,sEAFU;IAGV,KAAA,CAAMrB,QAAQ,IAAI,WAAA,EAAaqB,OAAO,CAAC5B,OAAR,IAAmB6B,IAAI,CAACC,GAAL;IAClD,KAAA,CAAMtB,OAAO,GAAGF,6BAAO,CAACC,QAAD;IAEvB,MAAA,CAAO,GAAA,CAAIa,OAAJ,EAAaW,OAAD,GAAa,CAAhC;QACE,GAAA,CAAI1B,aAAa,GAAG,CAApB;qBAAsB1I,QAAF;YAAWD,OAAO,EAAE,IAATA;QAAX,CAApB;iBAESyI,MAAT,CAAgB,CAAhB,UACExI,OADc,YAEdD,OAAAA,EACoC,CAHtC,EAG2C,CAH3B;YAIdiI,yCAAQ,CAACQ,MAAT,CAAgBsB,iBAAiB,CAAC,CAAlC9B;yBAAoChI,OAAF;yBAAWD,OAAAA;YAAX,CAAD,GAAwB8I,OAAzD;QACD,CAAA;uBAEc7I,QAAf,CAAuBqK,GAAvB,EAAgC,CAAhC;YACE3B,aAAa,GAAG,CAAA;mBACXA,aADW;gBAEd3I,OAAO,EAAE,KAATA;YAFc,CAAhB;YAIAyI,MAAM,CAACE,aAAD;YACN,KAAA,CAAM,GAAA,CAAIe,OAAJ,EAAaC,YAAD,GAChBrH,UAAU,CAACqH,YAAD,EAAeO,OAAO,CAAC3B,KAAvB;;YAEZN,yCAAQ,CAAC2B,sBAAT,CAAgCd,OAAhC;YACAA,OAAO,CAACyB,MAAR;YACAlB,mCAAa,CAACQ,MAAd,CAAqBhB,QAArB;YACAwB,OAAO,CAACC,GAAD;QACR,CAAA;QAED7B,MAAM,CAACE,aAAD;QACNU,mCAAa,CAACmB,GAAd,CAAkB3B,QAAlB,EAA4B,CAA5BQ;oBACEZ,MAD0B;2BAE1BE,aAF0B;YAG1BJ,KAAK,EAAE2B,OAAO,CAAC3B,KAAfA;QAH0B,CAA5B;IAKD,CA/BM;AAgCR,CAAA;AAEM,KAAA,CAAM1J,yCAAa,GAAG,CAA7B;UACEiL,0BAD2B;cAE3BP,8BAAAA;AAF2B,CAAtB;;","sources":["packages/components/modal/index.ts","packages/components/modal/src/index.ts","packages/components/modal/src/CompoundModal.tsx","packages/components/modal/src/Modal.tsx","packages/components/modal/src/ModalHeader/ModalHeader.tsx","packages/components/modal/src/ModalHeader/ModalHeader.styles.ts","packages/components/modal/src/ModalContent/ModalContent.tsx","packages/components/modal/src/ModalContent/ModalContent.styles.ts","packages/components/modal/src/Modal.styles.ts","packages/components/modal/src/ModalControls/ModalControls.tsx","packages/components/modal/src/ModalConfirm/ModalConfirm.tsx","packages/components/modal/src/ModalLauncher/ModalLauncher.tsx"],"sourcesContent":["export * from './src/index';\n","export { Modal } from './CompoundModal';\nexport type { ModalProps } from './Modal';\nexport { ModalConfirm } from './ModalConfirm/ModalConfirm';\nexport type { ModalConfirmProps } from './ModalConfirm/ModalConfirm';\nexport { ModalContent } from './ModalContent/ModalContent';\nexport type { ModalContentProps } from './ModalContent/ModalContent';\nexport { ModalControls } from './ModalControls/ModalControls';\nexport type { ModalControlsProps } from './ModalControls/ModalControls';\nexport { ModalHeader } from './ModalHeader/ModalHeader';\nexport type { ModalHeaderProps } from './ModalHeader/ModalHeader';\nexport { ModalLauncher } from './ModalLauncher/ModalLauncher';\n","import { Modal as OriginalModal } from './Modal';\nimport { ModalContent } from './ModalContent/ModalContent';\nimport { ModalHeader } from './ModalHeader/ModalHeader';\nimport { ModalControls } from './ModalControls/ModalControls';\n\ntype CompoundModal = typeof OriginalModal & {\n Content: typeof ModalContent;\n Header: typeof ModalHeader;\n Controls: typeof ModalControls;\n};\n\nexport const Modal = OriginalModal as CompoundModal;\nModal.Content = ModalContent;\nModal.Header = ModalHeader;\nModal.Controls = ModalControls;\n","import * as React from 'react';\nimport ReactModal from 'react-modal';\n\nimport { Box } from '@contentful/f36-core';\nimport type { CommonProps } from '@contentful/f36-core';\n\nimport { ModalHeader, ModalHeaderProps } from './ModalHeader/ModalHeader';\nimport { ModalContent, ModalContentProps } from './ModalContent/ModalContent';\nimport { getModalStyles } from './Modal.styles';\nimport type { ModalSizeType, ModalPositionType } from './types';\n\nconst ModalSizesMapper = {\n medium: '520px',\n small: '400px',\n large: '700px',\n fullWidth: '100vw',\n zen: '100vw',\n};\n\nexport interface ModalProps extends CommonProps {\n /**\n * When true, the dialog is shown.\n */\n isShown: boolean;\n\n /**\n * Function that will be run when the modal is requested to be closed, prior to actually closing.\n */\n onClose: ReactModal.Props['onRequestClose'];\n\n /**\n * Function that will be run after the modal has opened.\n */\n onAfterOpen?: ReactModal.Props['onAfterOpen'];\n\n /**\n * Additional aria attributes\n */\n aria?: ReactModal.Props['aria'];\n\n /**\n * Boolean indicating if clicking the overlay should close the overlay.\n * @default true\n */\n shouldCloseOnOverlayClick?: boolean;\n /**\n * Boolean indicating if pressing the esc key should close the overlay.\n * @default true\n */\n shouldCloseOnEscapePress?: boolean;\n /**\n * Indicating if modal is centered or linked to the top\n * @default center\n */\n position?: ModalPositionType;\n /**\n * Top offset if position is 'top'\n * @default 50px\n */\n topOffset?: number | string;\n /**\n * Modal title that is used in header\n */\n title?: string;\n /**\n * Size of the modal window\n * @default medium\n */\n size?: ModalSizeType;\n /**\n * Are modals higher than viewport allowed\n * @default false\n */\n allowHeightOverflow?: boolean;\n\n /**\n * Optional props to override ModalHeader behaviour\n */\n modalHeaderProps?: Partial<ModalHeaderProps>;\n\n /**\n * Optional props to override ModalContent behaviour\n */\n modalContentProps?: Partial<ModalContentProps>;\n\n /**\n * Optional property to set initial focus\n */\n initialFocusRef?: React.RefObject<HTMLElement>;\n\n children: React.ReactNode | RenderModal;\n}\n\ntype RenderModal = (modalProps: ModalProps) => React.ReactNode;\n\nfunction focusFirstWithinNode(node: HTMLElement) {\n if (node && node.querySelectorAll) {\n const elements = node.querySelectorAll('input, button');\n if (elements.length > 0) {\n const firstElement = elements[0];\n // @ts-expect-error focus might be missing\n if (typeof firstElement.focus === 'function') {\n // @ts-expect-error focus might be missing\n firstElement.focus();\n }\n }\n }\n}\n\nexport function Modal({\n allowHeightOverflow = false,\n position = 'center',\n shouldCloseOnEscapePress = true,\n shouldCloseOnOverlayClick = true,\n size = 'medium',\n testId = 'cf-ui-modal',\n topOffset = '50px',\n aria,\n ...otherProps\n}: ModalProps) {\n const contentRef = React.useRef<HTMLDivElement>(null);\n\n const props = {\n ...otherProps,\n allowHeightOverflow,\n position,\n shouldCloseOnEscapePress,\n shouldCloseOnOverlayClick,\n size,\n testId,\n topOffset,\n };\n\n const styles = getModalStyles({\n position,\n size,\n allowHeightOverflow,\n className: otherProps.className,\n });\n\n React.useEffect(() => {\n if (props.isShown) {\n setTimeout(() => {\n if (props.initialFocusRef && props.initialFocusRef.current) {\n if (props.initialFocusRef.current.focus) {\n props.initialFocusRef.current.focus();\n }\n } else if (contentRef.current) {\n focusFirstWithinNode(contentRef.current);\n }\n }, 100);\n }\n }, [props.isShown, props.initialFocusRef]);\n\n const renderDefault = () => {\n return (\n <React.Fragment>\n {otherProps.title && (\n <ModalHeader\n title={otherProps.title}\n onClose={props.onClose}\n {...otherProps.modalHeaderProps}\n />\n )}\n <ModalContent {...otherProps.modalContentProps}>\n {otherProps.children}\n </ModalContent>\n </React.Fragment>\n );\n };\n\n return (\n <ReactModal\n ariaHideApp={false}\n aria={aria}\n onRequestClose={props.onClose}\n isOpen={otherProps.isShown}\n onAfterOpen={props.onAfterOpen}\n shouldCloseOnEsc={shouldCloseOnEscapePress}\n shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n shouldFocusAfterRender\n shouldReturnFocusAfterClose\n portalClassName={styles.portal}\n style={{\n content: {\n top: position === 'center' ? 0 : topOffset,\n },\n }}\n className={{\n base: styles.base.root,\n afterOpen: styles.base.afterOpen,\n beforeClose: styles.base.beforeClose,\n }}\n overlayClassName={{\n base: styles.modalOverlay.root,\n afterOpen: styles.modalOverlay.afterOpen,\n beforeClose: styles.modalOverlay.beforeClose,\n }}\n closeTimeoutMS={200}\n contentRef={(ref) => {\n contentRef.current = ref;\n }}\n >\n <Box\n testId={testId}\n style={{\n width: ModalSizesMapper[size] || size,\n }}\n className={styles.modal}\n data-modal-root\n >\n {typeof otherProps.children === 'function'\n ? otherProps.children(props)\n : renderDefault()}\n </Box>\n </ReactModal>\n );\n}\n\nModal.displayName = 'Modal';\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { CloseIcon } from '@contentful/f36-icons';\nimport { Flex } from '@contentful/f36-core';\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Button } from '@contentful/f36-button';\nimport { Subheading } from '@contentful/f36-typography';\n\nimport { getModalHeaderStyles } from './ModalHeader.styles';\n\ninterface ModalHeaderInternalProps extends CommonProps {\n title: string;\n onClose?: Function;\n}\n\nexport type ModalHeaderProps = PropsWithHTMLElement<\n ModalHeaderInternalProps,\n 'div'\n>;\n\nexport function ModalHeader({\n onClose,\n title,\n testId = 'cf-ui-modal-header',\n className,\n ...otherProps\n}: ModalHeaderProps): React.ReactElement {\n const styles = getModalHeaderStyles();\n\n return (\n <Flex\n {...otherProps}\n className={cx(styles.root, className)}\n testId={testId}\n alignItems=\"center\"\n justifyContent=\"space-between\"\n >\n <Subheading as=\"h1\" isTruncated marginBottom=\"none\">\n {title}\n </Subheading>\n {onClose && (\n <Flex alignItems=\"center\" className={styles.buttonContainer}>\n <Button\n variant=\"transparent\"\n aria-label=\"Close\"\n startIcon={<CloseIcon size=\"small\" />}\n onClick={() => {\n onClose();\n }}\n size=\"small\"\n />\n </Flex>\n )}\n </Flex>\n );\n}\n\nModalHeader.displayName = 'ModalHeader';\n","import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\n\nexport function getModalHeaderStyles() {\n return {\n root: css({\n position: 'relative',\n padding: `${tokens.spacingM} ${tokens.spacingM} ${tokens.spacingM} ${tokens.spacingL}`,\n borderRadius: `${tokens.borderRadiusMedium} ${tokens.borderRadiusMedium} 0 0`,\n borderBottom: `1px solid ${tokens.gray300}`,\n }),\n buttonContainer: css({\n position: 'relative',\n width: tokens.spacing2Xl,\n height: tokens.spacingL,\n button: {\n position: 'absolute',\n top: `calc(-1 * ${tokens.spacing2Xs})`,\n right: 0,\n },\n }),\n };\n}\n","import React from 'react';\nimport { cx } from 'emotion';\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Box } from '@contentful/f36-core';\nimport { getModalContentStyles } from './ModalContent.styles';\n\ninterface ModalContentInternalProps extends CommonProps {\n children: React.ReactNode;\n}\n\nexport type ModalContentProps = PropsWithHTMLElement<\n ModalContentInternalProps,\n 'div'\n>;\n\nexport function ModalContent({\n testId = 'cf-ui-modal-content',\n className,\n children,\n ...otherProps\n}: ModalContentProps) {\n const styles = getModalContentStyles();\n return (\n <Box\n {...otherProps}\n as=\"div\"\n className={cx(styles.root, className)}\n testId={testId}\n >\n {children}\n </Box>\n );\n}\n\nModalContent.displayName = 'ModalContent';\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport function getModalContentStyles() {\n return {\n root: css({\n padding: `${tokens.spacingM} ${tokens.spacingL}`,\n color: tokens.gray700,\n fontSize: tokens.fontSizeM,\n fontFamily: tokens.fontStackPrimary,\n lineHeight: tokens.lineHeightM,\n overflowY: 'auto',\n overflowX: 'auto',\n boxSizing: 'border-box',\n }),\n };\n}\n","import tokens from '@contentful/f36-tokens';\nimport { css, cx } from 'emotion';\nimport type { ModalPositionType, ModalSizeType } from './types';\n\nexport function getModalStyles(props: {\n size: ModalSizeType;\n position: ModalPositionType;\n allowHeightOverflow?: boolean;\n className?: string;\n}) {\n const modal = cx(\n css({\n margin: tokens.spacing2Xl,\n backgroundColor: tokens.colorWhite,\n borderRadius: tokens.borderRadiusMedium,\n boxShadow: tokens.boxShadowHeavy,\n maxHeight: `calc(100vh - 1rem * (100 / ${tokens.fontBaseDefault}))`,\n maxWidth: `calc(100vw - 1rem * (100 / ${tokens.fontBaseDefault}))`,\n overflow: 'hidden',\n display: 'flex',\n flexDirection: 'column',\n }),\n props.allowHeightOverflow\n ? css({\n overflow: 'auto',\n maxHeight: 'none',\n })\n : null,\n props.size === 'zen'\n ? css({\n maxWidth: 'none',\n maxHeight: 'none',\n margin: 0,\n height: '100%',\n width: '100%',\n })\n : null,\n props.className,\n );\n\n return {\n portal: css({\n display: 'block',\n }),\n base: {\n root: cx(\n css({\n zIndex: tokens.zIndexModalContent,\n position: 'relative',\n padding: 0,\n display: 'inline-block',\n margin: '0 auto',\n textAlign: 'left',\n outline: 'none',\n transform: 'scale(0.85)',\n transition: `transform ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n }),\n props.size === 'zen'\n ? css({\n width: '100%',\n height: '100%',\n })\n : null,\n ),\n afterOpen: css({\n transform: 'scale(1)',\n }),\n beforeClose: css({\n transform: 'scale(0.85)',\n }),\n },\n modalOverlay: {\n root: cx(\n css({\n display: 'flex',\n alignItems: 'baseline',\n flexWrap: 'wrap',\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n zIndex: tokens.zIndexModal,\n opacity: 0,\n transition: `opacity ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n position: 'fixed',\n overflowY: 'auto',\n backgroundColor: 'rgba(12, 20, 28, 0.74902)',\n textAlign: 'center',\n }),\n props.position === 'center'\n ? css({\n alignItems: 'center',\n justifyContent: 'center',\n })\n : null,\n ),\n afterOpen: css({\n opacity: 1,\n }),\n beforeClose: css({\n opacity: 0,\n }),\n },\n modal,\n };\n}\n","import React from 'react';\n\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Flex } from '@contentful/f36-core';\nimport { ButtonGroup } from '@contentful/f36-button';\n\ninterface ModalControlsInternalProps extends CommonProps {\n children: React.ReactElement[] | React.ReactElement;\n}\n\nexport type ModalControlsProps = PropsWithHTMLElement<\n ModalControlsInternalProps,\n 'div'\n>;\n\nexport function ModalControls({\n testId = 'cf-ui-modal-controls',\n className,\n children,\n ...otherProps\n}: ModalControlsProps): React.ReactElement {\n return (\n <Flex\n {...otherProps}\n className={className}\n testId={testId}\n flexDirection=\"row\"\n justifyContent=\"flex-end\"\n margin=\"spacingL\"\n marginTop=\"none\"\n >\n <ButtonGroup variant=\"spaced\" spacing=\"spacingS\">\n {children}\n </ButtonGroup>\n </Flex>\n );\n}\n\nModalControls.displayName = 'ModalControls';\n","import React from 'react';\n\nimport { Modal } from '../CompoundModal';\nimport { ModalProps } from '../Modal';\nimport type { ModalSizeType } from '../types';\nimport type { ModalHeaderProps } from '../ModalHeader/ModalHeader';\nimport type { ModalContentProps } from '../ModalContent/ModalContent';\nimport type { ModalControlsProps } from '../ModalControls/ModalControls';\nimport { Button } from '@contentful/f36-button';\n\nexport interface ModalConfirmProps {\n /**\n * When true, the dialog is shown.\n */\n isShown: boolean;\n /**\n * Function that will be called when the confirm button is clicked. This does not close the ModalConfirm.\n */\n onConfirm(): void;\n /**\n * Function that will be called when the cancel button is clicked. This does not close the ModalConfirm.\n */\n onCancel: ModalProps['onClose'];\n /**\n Modal title that is used in header\n */\n title?: string;\n /**\n * Label of the confirm button\n */\n confirmLabel?: string | false;\n /**\n * Label of the cancel button\n */\n cancelLabel?: string | false;\n /**\n * The intent of the ModalConfirm. Used for the Button.\n */\n intent?: 'primary' | 'positive' | 'negative';\n /**\n Size of the modal window\n */\n size?: ModalSizeType;\n /**\n * Boolean indicating if clicking the overlay should close the overlay.\n */\n shouldCloseOnOverlayClick?: boolean;\n /**\n * Boolean indicating if pressing the esc key should close the overlay.\n */\n shouldCloseOnEscapePress?: boolean;\n /**\n * When true, the confirm button is set to disabled.\n */\n isConfirmDisabled?: boolean;\n /**\n * When true, the confirm button is set to loading.\n */\n isConfirmLoading?: boolean;\n /**\n * Are modals higher than viewport allowed\n */\n allowHeightOverflow?: boolean;\n\n /**\n * Optional props to override ModalHeader behaviour\n */\n modalHeaderProps?: Partial<ModalHeaderProps>;\n\n /**\n * Optional props to override ModalContent behaviour\n */\n modalContentProps?: Partial<ModalContentProps>;\n\n /**\n * Optional props to override ModalControl behaviour\n */\n modalControlsProps?: Partial<ModalControlsProps>;\n\n /**\n * Optional property to set initial focus\n */\n initialFocusRef?: React.RefObject<HTMLElement>;\n\n testId?: string;\n confirmTestId?: string;\n cancelTestId?: string;\n children: React.ReactNode;\n}\n\nexport function ModalConfirm({\n allowHeightOverflow = false,\n cancelLabel = 'Cancel',\n cancelTestId = 'cf-ui-modal-confirm-cancel-button',\n children,\n confirmLabel = 'Confirm',\n confirmTestId = 'cf-ui-modal-confirm-confirm-button',\n intent = 'positive',\n isConfirmDisabled = false,\n isConfirmLoading = false,\n isShown,\n modalContentProps,\n modalControlsProps,\n modalHeaderProps,\n onCancel,\n onConfirm,\n shouldCloseOnEscapePress = true,\n shouldCloseOnOverlayClick = true,\n size = 'medium',\n testId = 'cf-ui-modal-confirm',\n title = 'Are you sure?',\n initialFocusRef,\n}: ModalConfirmProps) {\n const cancelRef = React.useRef(null);\n\n const confirmButton = confirmLabel ? (\n <Button\n testId={confirmTestId}\n isDisabled={isConfirmDisabled}\n isLoading={isConfirmLoading}\n variant={intent}\n size=\"small\"\n onClick={() => onConfirm()}\n >\n {confirmLabel}\n </Button>\n ) : null;\n\n const cancelButton = cancelLabel ? (\n <Button\n testId={cancelTestId}\n variant=\"secondary\"\n onClick={onCancel}\n size=\"small\"\n ref={initialFocusRef || cancelRef}\n >\n {cancelLabel}\n </Button>\n ) : null;\n\n return (\n <Modal\n testId={testId}\n isShown={isShown}\n onClose={onCancel}\n size={size}\n shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n shouldCloseOnEscapePress={shouldCloseOnEscapePress}\n allowHeightOverflow={allowHeightOverflow}\n initialFocusRef={cancelRef}\n >\n {() => {\n return (\n <React.Fragment>\n <Modal.Header title={title || ''} {...modalHeaderProps} />\n <Modal.Content {...modalContentProps}>{children}</Modal.Content>\n <Modal.Controls {...modalControlsProps}>\n {cancelButton}\n {confirmButton}\n </Modal.Controls>\n </React.Fragment>\n );\n }}\n </Modal>\n );\n}\n\nModalConfirm.displayName = 'ModalConfirm';\n","/* global Promise */\nimport ReactDOM from 'react-dom';\n\n// @todo: change any to unknown\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ninterface ModalLauncherComponentRendererProps<T = any> {\n isShown: boolean;\n onClose: (result?: T) => void;\n}\n\ninterface ModalLauncherOpenOptions {\n /**\n * Unique id to be used as identifier for the modal contianer\n */\n modalId?: string;\n /**\n * ms before removing the component from the tree\n * @default 300\n */\n delay?: number;\n}\n\ninterface CloseModalData {\n delay: number;\n render: (args: ModalLauncherComponentRendererProps<any>) => void;\n currentConfig: ModalLauncherComponentRendererProps<any>;\n}\n\nconst getRoot = (rootElId: string): HTMLElement => {\n // Reuse the container if we find it\n let rootDom = document.getElementById(rootElId);\n if (rootDom !== null) {\n return rootDom;\n }\n\n // Otherwise create it\n rootDom = document.createElement('div');\n rootDom.setAttribute('id', rootElId);\n document.body.appendChild(rootDom);\n return rootDom;\n};\n\nconst openModalsIds: Map<string, CloseModalData> = new Map();\nfunction closeAll() {\n openModalsIds.forEach(async ({ render, currentConfig, delay }, rootElId) => {\n const config = { ...currentConfig, isShown: false };\n render(config);\n await new Promise((resolveDelay) => setTimeout(resolveDelay, delay));\n ReactDOM.unmountComponentAtNode(getRoot(rootElId));\n openModalsIds.delete(rootElId);\n });\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction open<T = any>(\n componentRenderer: (\n props: ModalLauncherComponentRendererProps<T>,\n ) => JSX.Element,\n options: ModalLauncherOpenOptions = {},\n): Promise<T> {\n options = { delay: 300, ...options };\n\n // Allow components to specify if they wish to reuse the modal container\n const rootElId = `modals-root${options.modalId || Date.now()}`;\n const rootDom = getRoot(rootElId);\n\n return new Promise((resolve) => {\n let currentConfig = { onClose, isShown: true };\n\n function render({\n onClose,\n isShown,\n }: ModalLauncherComponentRendererProps<T>) {\n ReactDOM.render(componentRenderer({ onClose, isShown }), rootDom);\n }\n\n async function onClose(arg?: T) {\n currentConfig = {\n ...currentConfig,\n isShown: false,\n };\n render(currentConfig);\n await new Promise((resolveDelay) =>\n setTimeout(resolveDelay, options.delay),\n );\n ReactDOM.unmountComponentAtNode(rootDom);\n rootDom.remove();\n openModalsIds.delete(rootElId);\n resolve(arg);\n }\n\n render(currentConfig);\n openModalsIds.set(rootElId, {\n render,\n currentConfig,\n delay: options.delay,\n });\n });\n}\n\nexport const ModalLauncher = {\n open,\n closeAll,\n};\n"],"names":["Modal","ModalProps","ModalConfirm","ModalConfirmProps","ModalContent","ModalContentProps","ModalControls","ModalControlsProps","ModalHeader","ModalHeaderProps","ModalLauncher","OriginalModal","CompoundModal","Content","Header","Controls","React","ReactModal","Box","CommonProps","getModalStyles","ModalSizeType","ModalPositionType","ModalSizesMapper","medium","small","large","fullWidth","zen","isShown","onClose","Props","onAfterOpen","aria","shouldCloseOnOverlayClick","shouldCloseOnEscapePress","position","topOffset","title","size","allowHeightOverflow","modalHeaderProps","Partial","modalContentProps","initialFocusRef","RefObject","HTMLElement","children","ReactNode","RenderModal","modalProps","focusFirstWithinNode","node","querySelectorAll","elements","length","firstElement","focus","testId","otherProps","contentRef","useRef","HTMLDivElement","props","styles","className","useEffect","setTimeout","current","renderDefault","portal","content","top","base","root","afterOpen","beforeClose","modalOverlay","ref","width","modal","displayName","CloseIcon","Flex","PropsWithHTMLElement","Button","Subheading","getModalHeaderStyles","ModalHeaderInternalProps","Function","ReactElement","buttonContainer","tokens","padding","spacingM","spacingL","borderRadius","borderRadiusMedium","borderBottom","gray300","spacing2Xl","height","button","spacing2Xs","right","getModalContentStyles","ModalContentInternalProps","color","gray700","fontSize","fontSizeM","fontFamily","fontStackPrimary","lineHeight","lineHeightM","overflowY","overflowX","boxSizing","margin","backgroundColor","colorWhite","boxShadow","boxShadowHeavy","maxHeight","fontBaseDefault","maxWidth","overflow","display","flexDirection","zIndex","zIndexModalContent","textAlign","outline","transform","transition","transitionDurationDefault","transitionEasingDefault","alignItems","flexWrap","bottom","left","zIndexModal","opacity","ButtonGroup","ModalControlsInternalProps","onConfirm","onCancel","confirmLabel","cancelLabel","intent","isConfirmDisabled","isConfirmLoading","modalControlsProps","confirmTestId","cancelTestId","cancelRef","confirmButton","cancelButton","ReactDOM","ModalLauncherComponentRendererProps","result","T","ModalLauncherOpenOptions","modalId","delay","CloseModalData","render","args","currentConfig","getRoot","rootElId","rootDom","document","getElementById","createElement","setAttribute","body","appendChild","openModalsIds","Map","closeAll","forEach","config","Promise","resolveDelay","unmountComponentAtNode","delete","open","componentRenderer","JSX","Element","options","Date","now","resolve","arg","remove","set"],"version":3,"file":"main.js.map"}
package/dist/module.js CHANGED
@@ -120,10 +120,7 @@ $2e16b6f9c0e7012d$export$6da19a24bf249f17.displayName = 'ModalContent';
120
120
 
121
121
  function $f482f3cd8cb551fb$export$9af97f4b0b4c597a(props) {
122
122
  const modal = $8jMle$cx(/*#__PURE__*/ $8jMle$css({
123
- transition: `opacity ${$8jMle$contentfulf36tokens.transitionDurationLong} ${$8jMle$contentfulf36tokens.transitionEasingDefault}, transform ${$8jMle$contentfulf36tokens.transitionDurationDefault} ${$8jMle$contentfulf36tokens.transitionEasingCubicBezier}`,
124
- opacity: '0.5',
125
123
  margin: $8jMle$contentfulf36tokens.spacing2Xl,
126
- transform: 'scale(0.85)',
127
124
  backgroundColor: $8jMle$contentfulf36tokens.colorWhite,
128
125
  borderRadius: $8jMle$contentfulf36tokens.borderRadiusMedium,
129
126
  boxShadow: $8jMle$contentfulf36tokens.boxShadowHeavy,
@@ -152,18 +149,20 @@ function $f482f3cd8cb551fb$export$9af97f4b0b4c597a(props) {
152
149
  display: 'inline-block',
153
150
  margin: '0 auto',
154
151
  textAlign: 'left',
155
- outline: 'none'
152
+ outline: 'none',
153
+ transform: 'scale(0.85)',
154
+ transition: `transform ${$8jMle$contentfulf36tokens.transitionDurationDefault} ${$8jMle$contentfulf36tokens.transitionEasingDefault}`
156
155
  }), props.size === 'zen' ? /*#__PURE__*/ $8jMle$css({
157
156
  name: "uwwqev",
158
157
  styles: "width:100%;height:100%;"
159
158
  }) : null),
160
159
  afterOpen: /*#__PURE__*/ $8jMle$css({
161
- name: "rdgc1",
162
- styles: "[data-modal-root]{transform:scale(1);opacity:1;}"
160
+ name: "41q668",
161
+ styles: "transform:scale(1);"
163
162
  }),
164
163
  beforeClose: /*#__PURE__*/ $8jMle$css({
165
- name: "e66ys1",
166
- styles: "[data-modal-root]{opacity:0.5;transform:scale(0.85);}"
164
+ name: "ncrqc5",
165
+ styles: "transform:scale(0.85);"
167
166
  })
168
167
  },
169
168
  modalOverlay: {
@@ -187,8 +186,8 @@ function $f482f3cd8cb551fb$export$9af97f4b0b4c597a(props) {
187
186
  styles: "align-items:center;justify-content:center;"
188
187
  }) : null),
189
188
  afterOpen: /*#__PURE__*/ $8jMle$css({
190
- name: "mcmk46",
191
- styles: "opacity:1 !important;"
189
+ name: "whh5e5",
190
+ styles: "opacity:1;"
192
191
  }),
193
192
  beforeClose: /*#__PURE__*/ $8jMle$css({
194
193
  name: "q7lffx",
@@ -263,22 +262,22 @@ function $bfd2aa2f2cc9e088$export$2b77a92f1a5ad772({ allowHeightOverflow: allowH
263
262
  shouldFocusAfterRender: true,
264
263
  shouldReturnFocusAfterClose: true,
265
264
  portalClassName: styles.portal,
266
- className: {
267
- base: styles.base.root,
268
- afterOpen: styles.base.afterOpen,
269
- beforeClose: styles.base.beforeClose
270
- },
271
265
  style: {
272
266
  content: {
273
267
  top: position === 'center' ? 0 : topOffset
274
268
  }
275
269
  },
270
+ className: {
271
+ base: styles.base.root,
272
+ afterOpen: styles.base.afterOpen,
273
+ beforeClose: styles.base.beforeClose
274
+ },
276
275
  overlayClassName: {
277
276
  base: styles.modalOverlay.root,
278
277
  afterOpen: styles.modalOverlay.afterOpen,
279
278
  beforeClose: styles.modalOverlay.beforeClose
280
279
  },
281
- closeTimeoutMS: 300,
280
+ closeTimeoutMS: 200,
282
281
  contentRef: (ref)=>{
283
282
  contentRef.current = ref;
284
283
  }
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/components/modal/index.ts","packages/components/modal/src/index.ts","packages/components/modal/src/CompoundModal.tsx","packages/components/modal/src/Modal.tsx","packages/components/modal/src/ModalHeader/ModalHeader.tsx","packages/components/modal/src/ModalHeader/ModalHeader.styles.ts","packages/components/modal/src/ModalContent/ModalContent.tsx","packages/components/modal/src/ModalContent/ModalContent.styles.ts","packages/components/modal/src/Modal.styles.ts","packages/components/modal/src/ModalControls/ModalControls.tsx","packages/components/modal/src/ModalConfirm/ModalConfirm.tsx","packages/components/modal/src/ModalLauncher/ModalLauncher.tsx"],"sourcesContent":["export * from './src/index';\n","export { Modal } from './CompoundModal';\nexport type { ModalProps } from './Modal';\nexport { ModalConfirm } from './ModalConfirm/ModalConfirm';\nexport type { ModalConfirmProps } from './ModalConfirm/ModalConfirm';\nexport { ModalContent } from './ModalContent/ModalContent';\nexport type { ModalContentProps } from './ModalContent/ModalContent';\nexport { ModalControls } from './ModalControls/ModalControls';\nexport type { ModalControlsProps } from './ModalControls/ModalControls';\nexport { ModalHeader } from './ModalHeader/ModalHeader';\nexport type { ModalHeaderProps } from './ModalHeader/ModalHeader';\nexport { ModalLauncher } from './ModalLauncher/ModalLauncher';\n","import { Modal as OriginalModal } from './Modal';\nimport { ModalContent } from './ModalContent/ModalContent';\nimport { ModalHeader } from './ModalHeader/ModalHeader';\nimport { ModalControls } from './ModalControls/ModalControls';\n\ntype CompoundModal = typeof OriginalModal & {\n Content: typeof ModalContent;\n Header: typeof ModalHeader;\n Controls: typeof ModalControls;\n};\n\nexport const Modal = OriginalModal as CompoundModal;\nModal.Content = ModalContent;\nModal.Header = ModalHeader;\nModal.Controls = ModalControls;\n","import * as React from 'react';\nimport ReactModal from 'react-modal';\n\nimport { Box } from '@contentful/f36-core';\nimport type { CommonProps } from '@contentful/f36-core';\n\nimport { ModalHeader, ModalHeaderProps } from './ModalHeader/ModalHeader';\nimport { ModalContent, ModalContentProps } from './ModalContent/ModalContent';\nimport { getModalStyles } from './Modal.styles';\nimport type { ModalSizeType, ModalPositionType } from './types';\n\nconst ModalSizesMapper = {\n medium: '520px',\n small: '400px',\n large: '700px',\n fullWidth: '100vw',\n zen: '100vw',\n};\n\nexport interface ModalProps extends CommonProps {\n /**\n * When true, the dialog is shown.\n */\n isShown: boolean;\n\n /**\n * Function that will be run when the modal is requested to be closed, prior to actually closing.\n */\n onClose: ReactModal.Props['onRequestClose'];\n\n /**\n * Function that will be run after the modal has opened.\n */\n onAfterOpen?: ReactModal.Props['onAfterOpen'];\n\n /**\n * Additional aria attributes\n */\n aria?: ReactModal.Props['aria'];\n\n /**\n * Boolean indicating if clicking the overlay should close the overlay.\n * @default true\n */\n shouldCloseOnOverlayClick?: boolean;\n /**\n * Boolean indicating if pressing the esc key should close the overlay.\n * @default true\n */\n shouldCloseOnEscapePress?: boolean;\n /**\n * Indicating if modal is centered or linked to the top\n * @default center\n */\n position?: ModalPositionType;\n /**\n * Top offset if position is 'top'\n * @default 50px\n */\n topOffset?: number | string;\n /**\n * Modal title that is used in header\n */\n title?: string;\n /**\n * Size of the modal window\n * @default medium\n */\n size?: ModalSizeType;\n /**\n * Are modals higher than viewport allowed\n * @default false\n */\n allowHeightOverflow?: boolean;\n\n /**\n * Optional props to override ModalHeader behaviour\n */\n modalHeaderProps?: Partial<ModalHeaderProps>;\n\n /**\n * Optional props to override ModalContent behaviour\n */\n modalContentProps?: Partial<ModalContentProps>;\n\n /**\n * Optional property to set initial focus\n */\n initialFocusRef?: React.RefObject<HTMLElement>;\n\n children: React.ReactNode | RenderModal;\n}\n\ntype RenderModal = (modalProps: ModalProps) => React.ReactNode;\n\nfunction focusFirstWithinNode(node: HTMLElement) {\n if (node && node.querySelectorAll) {\n const elements = node.querySelectorAll('input, button');\n if (elements.length > 0) {\n const firstElement = elements[0];\n // @ts-expect-error focus might be missing\n if (typeof firstElement.focus === 'function') {\n // @ts-expect-error focus might be missing\n firstElement.focus();\n }\n }\n }\n}\n\nexport function Modal({\n allowHeightOverflow = false,\n position = 'center',\n shouldCloseOnEscapePress = true,\n shouldCloseOnOverlayClick = true,\n size = 'medium',\n testId = 'cf-ui-modal',\n topOffset = '50px',\n aria,\n ...otherProps\n}: ModalProps) {\n const contentRef = React.useRef<HTMLDivElement>(null);\n\n const props = {\n ...otherProps,\n allowHeightOverflow,\n position,\n shouldCloseOnEscapePress,\n shouldCloseOnOverlayClick,\n size,\n testId,\n topOffset,\n };\n\n const styles = getModalStyles({\n position,\n size,\n allowHeightOverflow,\n className: otherProps.className,\n });\n\n React.useEffect(() => {\n if (props.isShown) {\n setTimeout(() => {\n if (props.initialFocusRef && props.initialFocusRef.current) {\n if (props.initialFocusRef.current.focus) {\n props.initialFocusRef.current.focus();\n }\n } else if (contentRef.current) {\n focusFirstWithinNode(contentRef.current);\n }\n }, 100);\n }\n }, [props.isShown, props.initialFocusRef]);\n\n const renderDefault = () => {\n return (\n <React.Fragment>\n {otherProps.title && (\n <ModalHeader\n title={otherProps.title}\n onClose={props.onClose}\n {...otherProps.modalHeaderProps}\n />\n )}\n <ModalContent {...otherProps.modalContentProps}>\n {otherProps.children}\n </ModalContent>\n </React.Fragment>\n );\n };\n\n return (\n <ReactModal\n ariaHideApp={false}\n aria={aria}\n onRequestClose={props.onClose}\n isOpen={otherProps.isShown}\n onAfterOpen={props.onAfterOpen}\n shouldCloseOnEsc={shouldCloseOnEscapePress}\n shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n shouldFocusAfterRender\n shouldReturnFocusAfterClose\n portalClassName={styles.portal}\n className={{\n base: styles.base.root,\n afterOpen: styles.base.afterOpen,\n beforeClose: styles.base.beforeClose,\n }}\n style={{\n content: {\n top: position === 'center' ? 0 : topOffset,\n },\n }}\n overlayClassName={{\n base: styles.modalOverlay.root,\n afterOpen: styles.modalOverlay.afterOpen,\n beforeClose: styles.modalOverlay.beforeClose,\n }}\n closeTimeoutMS={300}\n contentRef={(ref) => {\n contentRef.current = ref;\n }}\n >\n <Box\n testId={testId}\n style={{\n width: ModalSizesMapper[size] || size,\n }}\n className={styles.modal}\n data-modal-root\n >\n {typeof otherProps.children === 'function'\n ? otherProps.children(props)\n : renderDefault()}\n </Box>\n </ReactModal>\n );\n}\n\nModal.displayName = 'Modal';\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { CloseIcon } from '@contentful/f36-icons';\nimport { Flex } from '@contentful/f36-core';\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Button } from '@contentful/f36-button';\nimport { Subheading } from '@contentful/f36-typography';\n\nimport { getModalHeaderStyles } from './ModalHeader.styles';\n\ninterface ModalHeaderInternalProps extends CommonProps {\n title: string;\n onClose?: Function;\n}\n\nexport type ModalHeaderProps = PropsWithHTMLElement<\n ModalHeaderInternalProps,\n 'div'\n>;\n\nexport function ModalHeader({\n onClose,\n title,\n testId = 'cf-ui-modal-header',\n className,\n ...otherProps\n}: ModalHeaderProps): React.ReactElement {\n const styles = getModalHeaderStyles();\n\n return (\n <Flex\n {...otherProps}\n className={cx(styles.root, className)}\n testId={testId}\n alignItems=\"center\"\n justifyContent=\"space-between\"\n >\n <Subheading as=\"h1\" isTruncated marginBottom=\"none\">\n {title}\n </Subheading>\n {onClose && (\n <Flex alignItems=\"center\" className={styles.buttonContainer}>\n <Button\n variant=\"transparent\"\n aria-label=\"Close\"\n startIcon={<CloseIcon size=\"small\" />}\n onClick={() => {\n onClose();\n }}\n size=\"small\"\n />\n </Flex>\n )}\n </Flex>\n );\n}\n\nModalHeader.displayName = 'ModalHeader';\n","import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\n\nexport function getModalHeaderStyles() {\n return {\n root: css({\n position: 'relative',\n padding: `${tokens.spacingM} ${tokens.spacingM} ${tokens.spacingM} ${tokens.spacingL}`,\n borderRadius: `${tokens.borderRadiusMedium} ${tokens.borderRadiusMedium} 0 0`,\n borderBottom: `1px solid ${tokens.gray300}`,\n }),\n buttonContainer: css({\n position: 'relative',\n width: tokens.spacing2Xl,\n height: tokens.spacingL,\n button: {\n position: 'absolute',\n top: `calc(-1 * ${tokens.spacing2Xs})`,\n right: 0,\n },\n }),\n };\n}\n","import React from 'react';\nimport { cx } from 'emotion';\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Box } from '@contentful/f36-core';\nimport { getModalContentStyles } from './ModalContent.styles';\n\ninterface ModalContentInternalProps extends CommonProps {\n children: React.ReactNode;\n}\n\nexport type ModalContentProps = PropsWithHTMLElement<\n ModalContentInternalProps,\n 'div'\n>;\n\nexport function ModalContent({\n testId = 'cf-ui-modal-content',\n className,\n children,\n ...otherProps\n}: ModalContentProps) {\n const styles = getModalContentStyles();\n return (\n <Box\n {...otherProps}\n as=\"div\"\n className={cx(styles.root, className)}\n testId={testId}\n >\n {children}\n </Box>\n );\n}\n\nModalContent.displayName = 'ModalContent';\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport function getModalContentStyles() {\n return {\n root: css({\n padding: `${tokens.spacingM} ${tokens.spacingL}`,\n color: tokens.gray700,\n fontSize: tokens.fontSizeM,\n fontFamily: tokens.fontStackPrimary,\n lineHeight: tokens.lineHeightM,\n overflowY: 'auto',\n overflowX: 'auto',\n boxSizing: 'border-box',\n }),\n };\n}\n","import tokens from '@contentful/f36-tokens';\nimport { css, cx } from 'emotion';\nimport type { ModalPositionType, ModalSizeType } from './types';\n\nexport function getModalStyles(props: {\n size: ModalSizeType;\n position: ModalPositionType;\n allowHeightOverflow?: boolean;\n className?: string;\n}) {\n const modal = cx(\n css({\n transition: `opacity ${tokens.transitionDurationLong} ${tokens.transitionEasingDefault}, transform ${tokens.transitionDurationDefault} ${tokens.transitionEasingCubicBezier}`,\n opacity: '0.5',\n margin: tokens.spacing2Xl,\n transform: 'scale(0.85)',\n backgroundColor: tokens.colorWhite,\n borderRadius: tokens.borderRadiusMedium,\n boxShadow: tokens.boxShadowHeavy,\n maxHeight: `calc(100vh - 1rem * (100 / ${tokens.fontBaseDefault}))`,\n maxWidth: `calc(100vw - 1rem * (100 / ${tokens.fontBaseDefault}))`,\n overflow: 'hidden',\n display: 'flex',\n flexDirection: 'column',\n }),\n props.allowHeightOverflow\n ? css({\n overflow: 'auto',\n maxHeight: 'none',\n })\n : null,\n props.size === 'zen'\n ? css({\n maxWidth: 'none',\n maxHeight: 'none',\n margin: 0,\n height: '100%',\n width: '100%',\n })\n : null,\n props.className,\n );\n\n return {\n portal: css({\n display: 'block',\n }),\n base: {\n root: cx(\n css({\n zIndex: tokens.zIndexModalContent,\n position: 'relative',\n padding: 0,\n display: 'inline-block',\n margin: '0 auto',\n textAlign: 'left',\n outline: 'none',\n }),\n props.size === 'zen'\n ? css({\n width: '100%',\n height: '100%',\n })\n : null,\n ),\n afterOpen: css({\n '[data-modal-root]': {\n transform: 'scale(1)',\n opacity: '1',\n },\n }),\n beforeClose: css({\n '[data-modal-root]': {\n opacity: '0.5',\n transform: 'scale(0.85)',\n },\n }),\n },\n modalOverlay: {\n root: cx(\n css({\n display: 'flex',\n alignItems: 'baseline',\n flexWrap: 'wrap',\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n zIndex: tokens.zIndexModal,\n opacity: 0,\n transition: `opacity ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n position: 'fixed',\n overflowY: 'auto',\n backgroundColor: 'rgba(12, 20, 28, 0.74902)',\n textAlign: 'center',\n }),\n props.position === 'center'\n ? css({\n alignItems: 'center',\n justifyContent: 'center',\n })\n : null,\n ),\n afterOpen: css({\n opacity: '1 !important',\n }),\n beforeClose: css({\n opacity: 0,\n }),\n },\n modal,\n };\n}\n","import React from 'react';\n\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Flex } from '@contentful/f36-core';\nimport { ButtonGroup } from '@contentful/f36-button';\n\ninterface ModalControlsInternalProps extends CommonProps {\n children: React.ReactElement[] | React.ReactElement;\n}\n\nexport type ModalControlsProps = PropsWithHTMLElement<\n ModalControlsInternalProps,\n 'div'\n>;\n\nexport function ModalControls({\n testId = 'cf-ui-modal-controls',\n className,\n children,\n ...otherProps\n}: ModalControlsProps): React.ReactElement {\n return (\n <Flex\n {...otherProps}\n className={className}\n testId={testId}\n flexDirection=\"row\"\n justifyContent=\"flex-end\"\n margin=\"spacingL\"\n marginTop=\"none\"\n >\n <ButtonGroup variant=\"spaced\" spacing=\"spacingS\">\n {children}\n </ButtonGroup>\n </Flex>\n );\n}\n\nModalControls.displayName = 'ModalControls';\n","import React from 'react';\n\nimport { Modal } from '../CompoundModal';\nimport { ModalProps } from '../Modal';\nimport type { ModalSizeType } from '../types';\nimport type { ModalHeaderProps } from '../ModalHeader/ModalHeader';\nimport type { ModalContentProps } from '../ModalContent/ModalContent';\nimport type { ModalControlsProps } from '../ModalControls/ModalControls';\nimport { Button } from '@contentful/f36-button';\n\nexport interface ModalConfirmProps {\n /**\n * When true, the dialog is shown.\n */\n isShown: boolean;\n /**\n * Function that will be called when the confirm button is clicked. This does not close the ModalConfirm.\n */\n onConfirm(): void;\n /**\n * Function that will be called when the cancel button is clicked. This does not close the ModalConfirm.\n */\n onCancel: ModalProps['onClose'];\n /**\n Modal title that is used in header\n */\n title?: string;\n /**\n * Label of the confirm button\n */\n confirmLabel?: string | false;\n /**\n * Label of the cancel button\n */\n cancelLabel?: string | false;\n /**\n * The intent of the ModalConfirm. Used for the Button.\n */\n intent?: 'primary' | 'positive' | 'negative';\n /**\n Size of the modal window\n */\n size?: ModalSizeType;\n /**\n * Boolean indicating if clicking the overlay should close the overlay.\n */\n shouldCloseOnOverlayClick?: boolean;\n /**\n * Boolean indicating if pressing the esc key should close the overlay.\n */\n shouldCloseOnEscapePress?: boolean;\n /**\n * When true, the confirm button is set to disabled.\n */\n isConfirmDisabled?: boolean;\n /**\n * When true, the confirm button is set to loading.\n */\n isConfirmLoading?: boolean;\n /**\n * Are modals higher than viewport allowed\n */\n allowHeightOverflow?: boolean;\n\n /**\n * Optional props to override ModalHeader behaviour\n */\n modalHeaderProps?: Partial<ModalHeaderProps>;\n\n /**\n * Optional props to override ModalContent behaviour\n */\n modalContentProps?: Partial<ModalContentProps>;\n\n /**\n * Optional props to override ModalControl behaviour\n */\n modalControlsProps?: Partial<ModalControlsProps>;\n\n /**\n * Optional property to set initial focus\n */\n initialFocusRef?: React.RefObject<HTMLElement>;\n\n testId?: string;\n confirmTestId?: string;\n cancelTestId?: string;\n children: React.ReactNode;\n}\n\nexport function ModalConfirm({\n allowHeightOverflow = false,\n cancelLabel = 'Cancel',\n cancelTestId = 'cf-ui-modal-confirm-cancel-button',\n children,\n confirmLabel = 'Confirm',\n confirmTestId = 'cf-ui-modal-confirm-confirm-button',\n intent = 'positive',\n isConfirmDisabled = false,\n isConfirmLoading = false,\n isShown,\n modalContentProps,\n modalControlsProps,\n modalHeaderProps,\n onCancel,\n onConfirm,\n shouldCloseOnEscapePress = true,\n shouldCloseOnOverlayClick = true,\n size = 'medium',\n testId = 'cf-ui-modal-confirm',\n title = 'Are you sure?',\n initialFocusRef,\n}: ModalConfirmProps) {\n const cancelRef = React.useRef(null);\n\n const confirmButton = confirmLabel ? (\n <Button\n testId={confirmTestId}\n isDisabled={isConfirmDisabled}\n isLoading={isConfirmLoading}\n variant={intent}\n size=\"small\"\n onClick={() => onConfirm()}\n >\n {confirmLabel}\n </Button>\n ) : null;\n\n const cancelButton = cancelLabel ? (\n <Button\n testId={cancelTestId}\n variant=\"secondary\"\n onClick={onCancel}\n size=\"small\"\n ref={initialFocusRef || cancelRef}\n >\n {cancelLabel}\n </Button>\n ) : null;\n\n return (\n <Modal\n testId={testId}\n isShown={isShown}\n onClose={onCancel}\n size={size}\n shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n shouldCloseOnEscapePress={shouldCloseOnEscapePress}\n allowHeightOverflow={allowHeightOverflow}\n initialFocusRef={cancelRef}\n >\n {() => {\n return (\n <React.Fragment>\n <Modal.Header title={title || ''} {...modalHeaderProps} />\n <Modal.Content {...modalContentProps}>{children}</Modal.Content>\n <Modal.Controls {...modalControlsProps}>\n {cancelButton}\n {confirmButton}\n </Modal.Controls>\n </React.Fragment>\n );\n }}\n </Modal>\n );\n}\n\nModalConfirm.displayName = 'ModalConfirm';\n","/* global Promise */\nimport ReactDOM from 'react-dom';\n\n// @todo: change any to unknown\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ninterface ModalLauncherComponentRendererProps<T = any> {\n isShown: boolean;\n onClose: (result?: T) => void;\n}\n\ninterface ModalLauncherOpenOptions {\n /**\n * Unique id to be used as identifier for the modal contianer\n */\n modalId?: string;\n /**\n * ms before removing the component from the tree\n * @default 300\n */\n delay?: number;\n}\n\ninterface CloseModalData {\n delay: number;\n render: (args: ModalLauncherComponentRendererProps<any>) => void;\n currentConfig: ModalLauncherComponentRendererProps<any>;\n}\n\nconst getRoot = (rootElId: string): HTMLElement => {\n // Reuse the container if we find it\n let rootDom = document.getElementById(rootElId);\n if (rootDom !== null) {\n return rootDom;\n }\n\n // Otherwise create it\n rootDom = document.createElement('div');\n rootDom.setAttribute('id', rootElId);\n document.body.appendChild(rootDom);\n return rootDom;\n};\n\nconst openModalsIds: Map<string, CloseModalData> = new Map();\nfunction closeAll() {\n openModalsIds.forEach(async ({ render, currentConfig, delay }, rootElId) => {\n const config = { ...currentConfig, isShown: false };\n render(config);\n await new Promise((resolveDelay) => setTimeout(resolveDelay, delay));\n ReactDOM.unmountComponentAtNode(getRoot(rootElId));\n openModalsIds.delete(rootElId);\n });\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction open<T = any>(\n componentRenderer: (\n props: ModalLauncherComponentRendererProps<T>,\n ) => JSX.Element,\n options: ModalLauncherOpenOptions = {},\n): Promise<T> {\n options = { delay: 300, ...options };\n\n // Allow components to specify if they wish to reuse the modal container\n const rootElId = `modals-root${options.modalId || Date.now()}`;\n const rootDom = getRoot(rootElId);\n\n return new Promise((resolve) => {\n let currentConfig = { onClose, isShown: true };\n\n function render({\n onClose,\n isShown,\n }: ModalLauncherComponentRendererProps<T>) {\n ReactDOM.render(componentRenderer({ onClose, isShown }), rootDom);\n }\n\n async function onClose(arg?: T) {\n currentConfig = {\n ...currentConfig,\n isShown: false,\n };\n render(currentConfig);\n await new Promise((resolveDelay) =>\n setTimeout(resolveDelay, options.delay),\n );\n ReactDOM.unmountComponentAtNode(rootDom);\n rootDom.remove();\n openModalsIds.delete(rootElId);\n resolve(arg);\n }\n\n render(currentConfig);\n openModalsIds.set(rootElId, {\n render,\n currentConfig,\n delay: options.delay,\n });\n });\n}\n\nexport const ModalLauncher = {\n open,\n closeAll,\n};\n"],"names":["Modal","ModalProps","ModalConfirm","ModalConfirmProps","ModalContent","ModalContentProps","ModalControls","ModalControlsProps","ModalHeader","ModalHeaderProps","ModalLauncher","OriginalModal","CompoundModal","Content","Header","Controls","React","ReactModal","Box","CommonProps","getModalStyles","ModalSizeType","ModalPositionType","ModalSizesMapper","medium","small","large","fullWidth","zen","isShown","onClose","Props","onAfterOpen","aria","shouldCloseOnOverlayClick","shouldCloseOnEscapePress","position","topOffset","title","size","allowHeightOverflow","modalHeaderProps","Partial","modalContentProps","initialFocusRef","RefObject","HTMLElement","children","ReactNode","RenderModal","modalProps","focusFirstWithinNode","node","querySelectorAll","elements","length","firstElement","focus","testId","otherProps","contentRef","useRef","HTMLDivElement","props","styles","className","useEffect","setTimeout","current","renderDefault","portal","base","root","afterOpen","beforeClose","content","top","modalOverlay","ref","width","modal","displayName","CloseIcon","Flex","PropsWithHTMLElement","Button","Subheading","getModalHeaderStyles","ModalHeaderInternalProps","Function","ReactElement","buttonContainer","tokens","padding","spacingM","spacingL","borderRadius","borderRadiusMedium","borderBottom","gray300","spacing2Xl","height","button","spacing2Xs","right","getModalContentStyles","ModalContentInternalProps","color","gray700","fontSize","fontSizeM","fontFamily","fontStackPrimary","lineHeight","lineHeightM","overflowY","overflowX","boxSizing","transition","transitionDurationLong","transitionEasingDefault","transitionDurationDefault","transitionEasingCubicBezier","opacity","margin","transform","backgroundColor","colorWhite","boxShadow","boxShadowHeavy","maxHeight","fontBaseDefault","maxWidth","overflow","display","flexDirection","zIndex","zIndexModalContent","textAlign","outline","alignItems","flexWrap","bottom","left","zIndexModal","ButtonGroup","ModalControlsInternalProps","onConfirm","onCancel","confirmLabel","cancelLabel","intent","isConfirmDisabled","isConfirmLoading","modalControlsProps","confirmTestId","cancelTestId","cancelRef","confirmButton","cancelButton","ReactDOM","ModalLauncherComponentRendererProps","result","T","ModalLauncherOpenOptions","modalId","delay","CloseModalData","render","args","currentConfig","getRoot","rootElId","rootDom","document","getElementById","createElement","setAttribute","body","appendChild","openModalsIds","Map","closeAll","forEach","config","Promise","resolveDelay","unmountComponentAtNode","delete","open","componentRenderer","JSX","Element","options","Date","now","resolve","arg","remove","set"],"version":3,"file":"module.js.map"}
1
+ {"mappings":"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","sources":["packages/components/modal/index.ts","packages/components/modal/src/index.ts","packages/components/modal/src/CompoundModal.tsx","packages/components/modal/src/Modal.tsx","packages/components/modal/src/ModalHeader/ModalHeader.tsx","packages/components/modal/src/ModalHeader/ModalHeader.styles.ts","packages/components/modal/src/ModalContent/ModalContent.tsx","packages/components/modal/src/ModalContent/ModalContent.styles.ts","packages/components/modal/src/Modal.styles.ts","packages/components/modal/src/ModalControls/ModalControls.tsx","packages/components/modal/src/ModalConfirm/ModalConfirm.tsx","packages/components/modal/src/ModalLauncher/ModalLauncher.tsx"],"sourcesContent":["export * from './src/index';\n","export { Modal } from './CompoundModal';\nexport type { ModalProps } from './Modal';\nexport { ModalConfirm } from './ModalConfirm/ModalConfirm';\nexport type { ModalConfirmProps } from './ModalConfirm/ModalConfirm';\nexport { ModalContent } from './ModalContent/ModalContent';\nexport type { ModalContentProps } from './ModalContent/ModalContent';\nexport { ModalControls } from './ModalControls/ModalControls';\nexport type { ModalControlsProps } from './ModalControls/ModalControls';\nexport { ModalHeader } from './ModalHeader/ModalHeader';\nexport type { ModalHeaderProps } from './ModalHeader/ModalHeader';\nexport { ModalLauncher } from './ModalLauncher/ModalLauncher';\n","import { Modal as OriginalModal } from './Modal';\nimport { ModalContent } from './ModalContent/ModalContent';\nimport { ModalHeader } from './ModalHeader/ModalHeader';\nimport { ModalControls } from './ModalControls/ModalControls';\n\ntype CompoundModal = typeof OriginalModal & {\n Content: typeof ModalContent;\n Header: typeof ModalHeader;\n Controls: typeof ModalControls;\n};\n\nexport const Modal = OriginalModal as CompoundModal;\nModal.Content = ModalContent;\nModal.Header = ModalHeader;\nModal.Controls = ModalControls;\n","import * as React from 'react';\nimport ReactModal from 'react-modal';\n\nimport { Box } from '@contentful/f36-core';\nimport type { CommonProps } from '@contentful/f36-core';\n\nimport { ModalHeader, ModalHeaderProps } from './ModalHeader/ModalHeader';\nimport { ModalContent, ModalContentProps } from './ModalContent/ModalContent';\nimport { getModalStyles } from './Modal.styles';\nimport type { ModalSizeType, ModalPositionType } from './types';\n\nconst ModalSizesMapper = {\n medium: '520px',\n small: '400px',\n large: '700px',\n fullWidth: '100vw',\n zen: '100vw',\n};\n\nexport interface ModalProps extends CommonProps {\n /**\n * When true, the dialog is shown.\n */\n isShown: boolean;\n\n /**\n * Function that will be run when the modal is requested to be closed, prior to actually closing.\n */\n onClose: ReactModal.Props['onRequestClose'];\n\n /**\n * Function that will be run after the modal has opened.\n */\n onAfterOpen?: ReactModal.Props['onAfterOpen'];\n\n /**\n * Additional aria attributes\n */\n aria?: ReactModal.Props['aria'];\n\n /**\n * Boolean indicating if clicking the overlay should close the overlay.\n * @default true\n */\n shouldCloseOnOverlayClick?: boolean;\n /**\n * Boolean indicating if pressing the esc key should close the overlay.\n * @default true\n */\n shouldCloseOnEscapePress?: boolean;\n /**\n * Indicating if modal is centered or linked to the top\n * @default center\n */\n position?: ModalPositionType;\n /**\n * Top offset if position is 'top'\n * @default 50px\n */\n topOffset?: number | string;\n /**\n * Modal title that is used in header\n */\n title?: string;\n /**\n * Size of the modal window\n * @default medium\n */\n size?: ModalSizeType;\n /**\n * Are modals higher than viewport allowed\n * @default false\n */\n allowHeightOverflow?: boolean;\n\n /**\n * Optional props to override ModalHeader behaviour\n */\n modalHeaderProps?: Partial<ModalHeaderProps>;\n\n /**\n * Optional props to override ModalContent behaviour\n */\n modalContentProps?: Partial<ModalContentProps>;\n\n /**\n * Optional property to set initial focus\n */\n initialFocusRef?: React.RefObject<HTMLElement>;\n\n children: React.ReactNode | RenderModal;\n}\n\ntype RenderModal = (modalProps: ModalProps) => React.ReactNode;\n\nfunction focusFirstWithinNode(node: HTMLElement) {\n if (node && node.querySelectorAll) {\n const elements = node.querySelectorAll('input, button');\n if (elements.length > 0) {\n const firstElement = elements[0];\n // @ts-expect-error focus might be missing\n if (typeof firstElement.focus === 'function') {\n // @ts-expect-error focus might be missing\n firstElement.focus();\n }\n }\n }\n}\n\nexport function Modal({\n allowHeightOverflow = false,\n position = 'center',\n shouldCloseOnEscapePress = true,\n shouldCloseOnOverlayClick = true,\n size = 'medium',\n testId = 'cf-ui-modal',\n topOffset = '50px',\n aria,\n ...otherProps\n}: ModalProps) {\n const contentRef = React.useRef<HTMLDivElement>(null);\n\n const props = {\n ...otherProps,\n allowHeightOverflow,\n position,\n shouldCloseOnEscapePress,\n shouldCloseOnOverlayClick,\n size,\n testId,\n topOffset,\n };\n\n const styles = getModalStyles({\n position,\n size,\n allowHeightOverflow,\n className: otherProps.className,\n });\n\n React.useEffect(() => {\n if (props.isShown) {\n setTimeout(() => {\n if (props.initialFocusRef && props.initialFocusRef.current) {\n if (props.initialFocusRef.current.focus) {\n props.initialFocusRef.current.focus();\n }\n } else if (contentRef.current) {\n focusFirstWithinNode(contentRef.current);\n }\n }, 100);\n }\n }, [props.isShown, props.initialFocusRef]);\n\n const renderDefault = () => {\n return (\n <React.Fragment>\n {otherProps.title && (\n <ModalHeader\n title={otherProps.title}\n onClose={props.onClose}\n {...otherProps.modalHeaderProps}\n />\n )}\n <ModalContent {...otherProps.modalContentProps}>\n {otherProps.children}\n </ModalContent>\n </React.Fragment>\n );\n };\n\n return (\n <ReactModal\n ariaHideApp={false}\n aria={aria}\n onRequestClose={props.onClose}\n isOpen={otherProps.isShown}\n onAfterOpen={props.onAfterOpen}\n shouldCloseOnEsc={shouldCloseOnEscapePress}\n shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n shouldFocusAfterRender\n shouldReturnFocusAfterClose\n portalClassName={styles.portal}\n style={{\n content: {\n top: position === 'center' ? 0 : topOffset,\n },\n }}\n className={{\n base: styles.base.root,\n afterOpen: styles.base.afterOpen,\n beforeClose: styles.base.beforeClose,\n }}\n overlayClassName={{\n base: styles.modalOverlay.root,\n afterOpen: styles.modalOverlay.afterOpen,\n beforeClose: styles.modalOverlay.beforeClose,\n }}\n closeTimeoutMS={200}\n contentRef={(ref) => {\n contentRef.current = ref;\n }}\n >\n <Box\n testId={testId}\n style={{\n width: ModalSizesMapper[size] || size,\n }}\n className={styles.modal}\n data-modal-root\n >\n {typeof otherProps.children === 'function'\n ? otherProps.children(props)\n : renderDefault()}\n </Box>\n </ReactModal>\n );\n}\n\nModal.displayName = 'Modal';\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { CloseIcon } from '@contentful/f36-icons';\nimport { Flex } from '@contentful/f36-core';\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Button } from '@contentful/f36-button';\nimport { Subheading } from '@contentful/f36-typography';\n\nimport { getModalHeaderStyles } from './ModalHeader.styles';\n\ninterface ModalHeaderInternalProps extends CommonProps {\n title: string;\n onClose?: Function;\n}\n\nexport type ModalHeaderProps = PropsWithHTMLElement<\n ModalHeaderInternalProps,\n 'div'\n>;\n\nexport function ModalHeader({\n onClose,\n title,\n testId = 'cf-ui-modal-header',\n className,\n ...otherProps\n}: ModalHeaderProps): React.ReactElement {\n const styles = getModalHeaderStyles();\n\n return (\n <Flex\n {...otherProps}\n className={cx(styles.root, className)}\n testId={testId}\n alignItems=\"center\"\n justifyContent=\"space-between\"\n >\n <Subheading as=\"h1\" isTruncated marginBottom=\"none\">\n {title}\n </Subheading>\n {onClose && (\n <Flex alignItems=\"center\" className={styles.buttonContainer}>\n <Button\n variant=\"transparent\"\n aria-label=\"Close\"\n startIcon={<CloseIcon size=\"small\" />}\n onClick={() => {\n onClose();\n }}\n size=\"small\"\n />\n </Flex>\n )}\n </Flex>\n );\n}\n\nModalHeader.displayName = 'ModalHeader';\n","import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\n\nexport function getModalHeaderStyles() {\n return {\n root: css({\n position: 'relative',\n padding: `${tokens.spacingM} ${tokens.spacingM} ${tokens.spacingM} ${tokens.spacingL}`,\n borderRadius: `${tokens.borderRadiusMedium} ${tokens.borderRadiusMedium} 0 0`,\n borderBottom: `1px solid ${tokens.gray300}`,\n }),\n buttonContainer: css({\n position: 'relative',\n width: tokens.spacing2Xl,\n height: tokens.spacingL,\n button: {\n position: 'absolute',\n top: `calc(-1 * ${tokens.spacing2Xs})`,\n right: 0,\n },\n }),\n };\n}\n","import React from 'react';\nimport { cx } from 'emotion';\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Box } from '@contentful/f36-core';\nimport { getModalContentStyles } from './ModalContent.styles';\n\ninterface ModalContentInternalProps extends CommonProps {\n children: React.ReactNode;\n}\n\nexport type ModalContentProps = PropsWithHTMLElement<\n ModalContentInternalProps,\n 'div'\n>;\n\nexport function ModalContent({\n testId = 'cf-ui-modal-content',\n className,\n children,\n ...otherProps\n}: ModalContentProps) {\n const styles = getModalContentStyles();\n return (\n <Box\n {...otherProps}\n as=\"div\"\n className={cx(styles.root, className)}\n testId={testId}\n >\n {children}\n </Box>\n );\n}\n\nModalContent.displayName = 'ModalContent';\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport function getModalContentStyles() {\n return {\n root: css({\n padding: `${tokens.spacingM} ${tokens.spacingL}`,\n color: tokens.gray700,\n fontSize: tokens.fontSizeM,\n fontFamily: tokens.fontStackPrimary,\n lineHeight: tokens.lineHeightM,\n overflowY: 'auto',\n overflowX: 'auto',\n boxSizing: 'border-box',\n }),\n };\n}\n","import tokens from '@contentful/f36-tokens';\nimport { css, cx } from 'emotion';\nimport type { ModalPositionType, ModalSizeType } from './types';\n\nexport function getModalStyles(props: {\n size: ModalSizeType;\n position: ModalPositionType;\n allowHeightOverflow?: boolean;\n className?: string;\n}) {\n const modal = cx(\n css({\n margin: tokens.spacing2Xl,\n backgroundColor: tokens.colorWhite,\n borderRadius: tokens.borderRadiusMedium,\n boxShadow: tokens.boxShadowHeavy,\n maxHeight: `calc(100vh - 1rem * (100 / ${tokens.fontBaseDefault}))`,\n maxWidth: `calc(100vw - 1rem * (100 / ${tokens.fontBaseDefault}))`,\n overflow: 'hidden',\n display: 'flex',\n flexDirection: 'column',\n }),\n props.allowHeightOverflow\n ? css({\n overflow: 'auto',\n maxHeight: 'none',\n })\n : null,\n props.size === 'zen'\n ? css({\n maxWidth: 'none',\n maxHeight: 'none',\n margin: 0,\n height: '100%',\n width: '100%',\n })\n : null,\n props.className,\n );\n\n return {\n portal: css({\n display: 'block',\n }),\n base: {\n root: cx(\n css({\n zIndex: tokens.zIndexModalContent,\n position: 'relative',\n padding: 0,\n display: 'inline-block',\n margin: '0 auto',\n textAlign: 'left',\n outline: 'none',\n transform: 'scale(0.85)',\n transition: `transform ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n }),\n props.size === 'zen'\n ? css({\n width: '100%',\n height: '100%',\n })\n : null,\n ),\n afterOpen: css({\n transform: 'scale(1)',\n }),\n beforeClose: css({\n transform: 'scale(0.85)',\n }),\n },\n modalOverlay: {\n root: cx(\n css({\n display: 'flex',\n alignItems: 'baseline',\n flexWrap: 'wrap',\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n zIndex: tokens.zIndexModal,\n opacity: 0,\n transition: `opacity ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n position: 'fixed',\n overflowY: 'auto',\n backgroundColor: 'rgba(12, 20, 28, 0.74902)',\n textAlign: 'center',\n }),\n props.position === 'center'\n ? css({\n alignItems: 'center',\n justifyContent: 'center',\n })\n : null,\n ),\n afterOpen: css({\n opacity: 1,\n }),\n beforeClose: css({\n opacity: 0,\n }),\n },\n modal,\n };\n}\n","import React from 'react';\n\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Flex } from '@contentful/f36-core';\nimport { ButtonGroup } from '@contentful/f36-button';\n\ninterface ModalControlsInternalProps extends CommonProps {\n children: React.ReactElement[] | React.ReactElement;\n}\n\nexport type ModalControlsProps = PropsWithHTMLElement<\n ModalControlsInternalProps,\n 'div'\n>;\n\nexport function ModalControls({\n testId = 'cf-ui-modal-controls',\n className,\n children,\n ...otherProps\n}: ModalControlsProps): React.ReactElement {\n return (\n <Flex\n {...otherProps}\n className={className}\n testId={testId}\n flexDirection=\"row\"\n justifyContent=\"flex-end\"\n margin=\"spacingL\"\n marginTop=\"none\"\n >\n <ButtonGroup variant=\"spaced\" spacing=\"spacingS\">\n {children}\n </ButtonGroup>\n </Flex>\n );\n}\n\nModalControls.displayName = 'ModalControls';\n","import React from 'react';\n\nimport { Modal } from '../CompoundModal';\nimport { ModalProps } from '../Modal';\nimport type { ModalSizeType } from '../types';\nimport type { ModalHeaderProps } from '../ModalHeader/ModalHeader';\nimport type { ModalContentProps } from '../ModalContent/ModalContent';\nimport type { ModalControlsProps } from '../ModalControls/ModalControls';\nimport { Button } from '@contentful/f36-button';\n\nexport interface ModalConfirmProps {\n /**\n * When true, the dialog is shown.\n */\n isShown: boolean;\n /**\n * Function that will be called when the confirm button is clicked. This does not close the ModalConfirm.\n */\n onConfirm(): void;\n /**\n * Function that will be called when the cancel button is clicked. This does not close the ModalConfirm.\n */\n onCancel: ModalProps['onClose'];\n /**\n Modal title that is used in header\n */\n title?: string;\n /**\n * Label of the confirm button\n */\n confirmLabel?: string | false;\n /**\n * Label of the cancel button\n */\n cancelLabel?: string | false;\n /**\n * The intent of the ModalConfirm. Used for the Button.\n */\n intent?: 'primary' | 'positive' | 'negative';\n /**\n Size of the modal window\n */\n size?: ModalSizeType;\n /**\n * Boolean indicating if clicking the overlay should close the overlay.\n */\n shouldCloseOnOverlayClick?: boolean;\n /**\n * Boolean indicating if pressing the esc key should close the overlay.\n */\n shouldCloseOnEscapePress?: boolean;\n /**\n * When true, the confirm button is set to disabled.\n */\n isConfirmDisabled?: boolean;\n /**\n * When true, the confirm button is set to loading.\n */\n isConfirmLoading?: boolean;\n /**\n * Are modals higher than viewport allowed\n */\n allowHeightOverflow?: boolean;\n\n /**\n * Optional props to override ModalHeader behaviour\n */\n modalHeaderProps?: Partial<ModalHeaderProps>;\n\n /**\n * Optional props to override ModalContent behaviour\n */\n modalContentProps?: Partial<ModalContentProps>;\n\n /**\n * Optional props to override ModalControl behaviour\n */\n modalControlsProps?: Partial<ModalControlsProps>;\n\n /**\n * Optional property to set initial focus\n */\n initialFocusRef?: React.RefObject<HTMLElement>;\n\n testId?: string;\n confirmTestId?: string;\n cancelTestId?: string;\n children: React.ReactNode;\n}\n\nexport function ModalConfirm({\n allowHeightOverflow = false,\n cancelLabel = 'Cancel',\n cancelTestId = 'cf-ui-modal-confirm-cancel-button',\n children,\n confirmLabel = 'Confirm',\n confirmTestId = 'cf-ui-modal-confirm-confirm-button',\n intent = 'positive',\n isConfirmDisabled = false,\n isConfirmLoading = false,\n isShown,\n modalContentProps,\n modalControlsProps,\n modalHeaderProps,\n onCancel,\n onConfirm,\n shouldCloseOnEscapePress = true,\n shouldCloseOnOverlayClick = true,\n size = 'medium',\n testId = 'cf-ui-modal-confirm',\n title = 'Are you sure?',\n initialFocusRef,\n}: ModalConfirmProps) {\n const cancelRef = React.useRef(null);\n\n const confirmButton = confirmLabel ? (\n <Button\n testId={confirmTestId}\n isDisabled={isConfirmDisabled}\n isLoading={isConfirmLoading}\n variant={intent}\n size=\"small\"\n onClick={() => onConfirm()}\n >\n {confirmLabel}\n </Button>\n ) : null;\n\n const cancelButton = cancelLabel ? (\n <Button\n testId={cancelTestId}\n variant=\"secondary\"\n onClick={onCancel}\n size=\"small\"\n ref={initialFocusRef || cancelRef}\n >\n {cancelLabel}\n </Button>\n ) : null;\n\n return (\n <Modal\n testId={testId}\n isShown={isShown}\n onClose={onCancel}\n size={size}\n shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n shouldCloseOnEscapePress={shouldCloseOnEscapePress}\n allowHeightOverflow={allowHeightOverflow}\n initialFocusRef={cancelRef}\n >\n {() => {\n return (\n <React.Fragment>\n <Modal.Header title={title || ''} {...modalHeaderProps} />\n <Modal.Content {...modalContentProps}>{children}</Modal.Content>\n <Modal.Controls {...modalControlsProps}>\n {cancelButton}\n {confirmButton}\n </Modal.Controls>\n </React.Fragment>\n );\n }}\n </Modal>\n );\n}\n\nModalConfirm.displayName = 'ModalConfirm';\n","/* global Promise */\nimport ReactDOM from 'react-dom';\n\n// @todo: change any to unknown\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ninterface ModalLauncherComponentRendererProps<T = any> {\n isShown: boolean;\n onClose: (result?: T) => void;\n}\n\ninterface ModalLauncherOpenOptions {\n /**\n * Unique id to be used as identifier for the modal contianer\n */\n modalId?: string;\n /**\n * ms before removing the component from the tree\n * @default 300\n */\n delay?: number;\n}\n\ninterface CloseModalData {\n delay: number;\n render: (args: ModalLauncherComponentRendererProps<any>) => void;\n currentConfig: ModalLauncherComponentRendererProps<any>;\n}\n\nconst getRoot = (rootElId: string): HTMLElement => {\n // Reuse the container if we find it\n let rootDom = document.getElementById(rootElId);\n if (rootDom !== null) {\n return rootDom;\n }\n\n // Otherwise create it\n rootDom = document.createElement('div');\n rootDom.setAttribute('id', rootElId);\n document.body.appendChild(rootDom);\n return rootDom;\n};\n\nconst openModalsIds: Map<string, CloseModalData> = new Map();\nfunction closeAll() {\n openModalsIds.forEach(async ({ render, currentConfig, delay }, rootElId) => {\n const config = { ...currentConfig, isShown: false };\n render(config);\n await new Promise((resolveDelay) => setTimeout(resolveDelay, delay));\n ReactDOM.unmountComponentAtNode(getRoot(rootElId));\n openModalsIds.delete(rootElId);\n });\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction open<T = any>(\n componentRenderer: (\n props: ModalLauncherComponentRendererProps<T>,\n ) => JSX.Element,\n options: ModalLauncherOpenOptions = {},\n): Promise<T> {\n options = { delay: 300, ...options };\n\n // Allow components to specify if they wish to reuse the modal container\n const rootElId = `modals-root${options.modalId || Date.now()}`;\n const rootDom = getRoot(rootElId);\n\n return new Promise((resolve) => {\n let currentConfig = { onClose, isShown: true };\n\n function render({\n onClose,\n isShown,\n }: ModalLauncherComponentRendererProps<T>) {\n ReactDOM.render(componentRenderer({ onClose, isShown }), rootDom);\n }\n\n async function onClose(arg?: T) {\n currentConfig = {\n ...currentConfig,\n isShown: false,\n };\n render(currentConfig);\n await new Promise((resolveDelay) =>\n setTimeout(resolveDelay, options.delay),\n );\n ReactDOM.unmountComponentAtNode(rootDom);\n rootDom.remove();\n openModalsIds.delete(rootElId);\n resolve(arg);\n }\n\n render(currentConfig);\n openModalsIds.set(rootElId, {\n render,\n currentConfig,\n delay: options.delay,\n });\n });\n}\n\nexport const ModalLauncher = {\n open,\n closeAll,\n};\n"],"names":["Modal","ModalProps","ModalConfirm","ModalConfirmProps","ModalContent","ModalContentProps","ModalControls","ModalControlsProps","ModalHeader","ModalHeaderProps","ModalLauncher","OriginalModal","CompoundModal","Content","Header","Controls","React","ReactModal","Box","CommonProps","getModalStyles","ModalSizeType","ModalPositionType","ModalSizesMapper","medium","small","large","fullWidth","zen","isShown","onClose","Props","onAfterOpen","aria","shouldCloseOnOverlayClick","shouldCloseOnEscapePress","position","topOffset","title","size","allowHeightOverflow","modalHeaderProps","Partial","modalContentProps","initialFocusRef","RefObject","HTMLElement","children","ReactNode","RenderModal","modalProps","focusFirstWithinNode","node","querySelectorAll","elements","length","firstElement","focus","testId","otherProps","contentRef","useRef","HTMLDivElement","props","styles","className","useEffect","setTimeout","current","renderDefault","portal","content","top","base","root","afterOpen","beforeClose","modalOverlay","ref","width","modal","displayName","CloseIcon","Flex","PropsWithHTMLElement","Button","Subheading","getModalHeaderStyles","ModalHeaderInternalProps","Function","ReactElement","buttonContainer","tokens","padding","spacingM","spacingL","borderRadius","borderRadiusMedium","borderBottom","gray300","spacing2Xl","height","button","spacing2Xs","right","getModalContentStyles","ModalContentInternalProps","color","gray700","fontSize","fontSizeM","fontFamily","fontStackPrimary","lineHeight","lineHeightM","overflowY","overflowX","boxSizing","margin","backgroundColor","colorWhite","boxShadow","boxShadowHeavy","maxHeight","fontBaseDefault","maxWidth","overflow","display","flexDirection","zIndex","zIndexModalContent","textAlign","outline","transform","transition","transitionDurationDefault","transitionEasingDefault","alignItems","flexWrap","bottom","left","zIndexModal","opacity","ButtonGroup","ModalControlsInternalProps","onConfirm","onCancel","confirmLabel","cancelLabel","intent","isConfirmDisabled","isConfirmLoading","modalControlsProps","confirmTestId","cancelTestId","cancelRef","confirmButton","cancelButton","ReactDOM","ModalLauncherComponentRendererProps","result","T","ModalLauncherOpenOptions","modalId","delay","CloseModalData","render","args","currentConfig","getRoot","rootElId","rootDom","document","getElementById","createElement","setAttribute","body","appendChild","openModalsIds","Map","closeAll","forEach","config","Promise","resolveDelay","unmountComponentAtNode","delete","open","componentRenderer","JSX","Element","options","Date","now","resolve","arg","remove","set"],"version":3,"file":"module.js.map"}
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/components/modal/src/ModalHeader/ModalHeader.styles.ts","packages/components/modal/src/ModalHeader/ModalHeader.tsx","packages/components/modal/src/ModalContent/ModalContent.styles.ts","packages/components/modal/src/ModalContent/ModalContent.tsx","packages/components/modal/src/types.ts","packages/components/modal/src/Modal.styles.ts","packages/components/modal/src/Modal.tsx","packages/components/modal/src/ModalControls/ModalControls.tsx","packages/components/modal/src/CompoundModal.tsx","packages/components/modal/src/ModalConfirm/ModalConfirm.tsx","packages/components/modal/src/ModalLauncher/ModalLauncher.tsx","packages/components/modal/src/index.ts","packages/components/modal/index.ts"],"sourcesContent":["import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\n\nexport function getModalHeaderStyles() {\n return {\n root: css({\n position: 'relative',\n padding: `${tokens.spacingM} ${tokens.spacingM} ${tokens.spacingM} ${tokens.spacingL}`,\n borderRadius: `${tokens.borderRadiusMedium} ${tokens.borderRadiusMedium} 0 0`,\n borderBottom: `1px solid ${tokens.gray300}`,\n }),\n buttonContainer: css({\n position: 'relative',\n width: tokens.spacing2Xl,\n height: tokens.spacingL,\n button: {\n position: 'absolute',\n top: `calc(-1 * ${tokens.spacing2Xs})`,\n right: 0,\n },\n }),\n };\n}\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { CloseIcon } from '@contentful/f36-icons';\nimport { Flex } from '@contentful/f36-core';\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Button } from '@contentful/f36-button';\nimport { Subheading } from '@contentful/f36-typography';\n\nimport { getModalHeaderStyles } from './ModalHeader.styles';\n\ninterface ModalHeaderInternalProps extends CommonProps {\n title: string;\n onClose?: Function;\n}\n\nexport type ModalHeaderProps = PropsWithHTMLElement<\n ModalHeaderInternalProps,\n 'div'\n>;\n\nexport function ModalHeader({\n onClose,\n title,\n testId = 'cf-ui-modal-header',\n className,\n ...otherProps\n}: ModalHeaderProps): React.ReactElement {\n const styles = getModalHeaderStyles();\n\n return (\n <Flex\n {...otherProps}\n className={cx(styles.root, className)}\n testId={testId}\n alignItems=\"center\"\n justifyContent=\"space-between\"\n >\n <Subheading as=\"h1\" isTruncated marginBottom=\"none\">\n {title}\n </Subheading>\n {onClose && (\n <Flex alignItems=\"center\" className={styles.buttonContainer}>\n <Button\n variant=\"transparent\"\n aria-label=\"Close\"\n startIcon={<CloseIcon size=\"small\" />}\n onClick={() => {\n onClose();\n }}\n size=\"small\"\n />\n </Flex>\n )}\n </Flex>\n );\n}\n\nModalHeader.displayName = 'ModalHeader';\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport function getModalContentStyles() {\n return {\n root: css({\n padding: `${tokens.spacingM} ${tokens.spacingL}`,\n color: tokens.gray700,\n fontSize: tokens.fontSizeM,\n fontFamily: tokens.fontStackPrimary,\n lineHeight: tokens.lineHeightM,\n overflowY: 'auto',\n overflowX: 'auto',\n boxSizing: 'border-box',\n }),\n };\n}\n","import React from 'react';\nimport { cx } from 'emotion';\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Box } from '@contentful/f36-core';\nimport { getModalContentStyles } from './ModalContent.styles';\n\ninterface ModalContentInternalProps extends CommonProps {\n children: React.ReactNode;\n}\n\nexport type ModalContentProps = PropsWithHTMLElement<\n ModalContentInternalProps,\n 'div'\n>;\n\nexport function ModalContent({\n testId = 'cf-ui-modal-content',\n className,\n children,\n ...otherProps\n}: ModalContentProps) {\n const styles = getModalContentStyles();\n return (\n <Box\n {...otherProps}\n as=\"div\"\n className={cx(styles.root, className)}\n testId={testId}\n >\n {children}\n </Box>\n );\n}\n\nModalContent.displayName = 'ModalContent';\n","export type ModalSizeType =\n | 'small'\n | 'medium'\n | 'large'\n | 'fullWidth'\n | 'zen'\n | string\n | number;\n\nexport type ModalPositionType = 'center' | 'top';\n","import tokens from '@contentful/f36-tokens';\nimport { css, cx } from 'emotion';\nimport type { ModalPositionType, ModalSizeType } from './types';\n\nexport function getModalStyles(props: {\n size: ModalSizeType;\n position: ModalPositionType;\n allowHeightOverflow?: boolean;\n className?: string;\n}) {\n const modal = cx(\n css({\n transition: `opacity ${tokens.transitionDurationLong} ${tokens.transitionEasingDefault}, transform ${tokens.transitionDurationDefault} ${tokens.transitionEasingCubicBezier}`,\n opacity: '0.5',\n margin: tokens.spacing2Xl,\n transform: 'scale(0.85)',\n backgroundColor: tokens.colorWhite,\n borderRadius: tokens.borderRadiusMedium,\n boxShadow: tokens.boxShadowHeavy,\n maxHeight: `calc(100vh - 1rem * (100 / ${tokens.fontBaseDefault}))`,\n maxWidth: `calc(100vw - 1rem * (100 / ${tokens.fontBaseDefault}))`,\n overflow: 'hidden',\n display: 'flex',\n flexDirection: 'column',\n }),\n props.allowHeightOverflow\n ? css({\n overflow: 'auto',\n maxHeight: 'none',\n })\n : null,\n props.size === 'zen'\n ? css({\n maxWidth: 'none',\n maxHeight: 'none',\n margin: 0,\n height: '100%',\n width: '100%',\n })\n : null,\n props.className,\n );\n\n return {\n portal: css({\n display: 'block',\n }),\n base: {\n root: cx(\n css({\n zIndex: tokens.zIndexModalContent,\n position: 'relative',\n padding: 0,\n display: 'inline-block',\n margin: '0 auto',\n textAlign: 'left',\n outline: 'none',\n }),\n props.size === 'zen'\n ? css({\n width: '100%',\n height: '100%',\n })\n : null,\n ),\n afterOpen: css({\n '[data-modal-root]': {\n transform: 'scale(1)',\n opacity: '1',\n },\n }),\n beforeClose: css({\n '[data-modal-root]': {\n opacity: '0.5',\n transform: 'scale(0.85)',\n },\n }),\n },\n modalOverlay: {\n root: cx(\n css({\n display: 'flex',\n alignItems: 'baseline',\n flexWrap: 'wrap',\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n zIndex: tokens.zIndexModal,\n opacity: 0,\n transition: `opacity ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n position: 'fixed',\n overflowY: 'auto',\n backgroundColor: 'rgba(12, 20, 28, 0.74902)',\n textAlign: 'center',\n }),\n props.position === 'center'\n ? css({\n alignItems: 'center',\n justifyContent: 'center',\n })\n : null,\n ),\n afterOpen: css({\n opacity: '1 !important',\n }),\n beforeClose: css({\n opacity: 0,\n }),\n },\n modal,\n };\n}\n","import * as React from 'react';\nimport ReactModal from 'react-modal';\n\nimport { Box } from '@contentful/f36-core';\nimport type { CommonProps } from '@contentful/f36-core';\n\nimport { ModalHeader, ModalHeaderProps } from './ModalHeader/ModalHeader';\nimport { ModalContent, ModalContentProps } from './ModalContent/ModalContent';\nimport { getModalStyles } from './Modal.styles';\nimport type { ModalSizeType, ModalPositionType } from './types';\n\nconst ModalSizesMapper = {\n medium: '520px',\n small: '400px',\n large: '700px',\n fullWidth: '100vw',\n zen: '100vw',\n};\n\nexport interface ModalProps extends CommonProps {\n /**\n * When true, the dialog is shown.\n */\n isShown: boolean;\n\n /**\n * Function that will be run when the modal is requested to be closed, prior to actually closing.\n */\n onClose: ReactModal.Props['onRequestClose'];\n\n /**\n * Function that will be run after the modal has opened.\n */\n onAfterOpen?: ReactModal.Props['onAfterOpen'];\n\n /**\n * Additional aria attributes\n */\n aria?: ReactModal.Props['aria'];\n\n /**\n * Boolean indicating if clicking the overlay should close the overlay.\n * @default true\n */\n shouldCloseOnOverlayClick?: boolean;\n /**\n * Boolean indicating if pressing the esc key should close the overlay.\n * @default true\n */\n shouldCloseOnEscapePress?: boolean;\n /**\n * Indicating if modal is centered or linked to the top\n * @default center\n */\n position?: ModalPositionType;\n /**\n * Top offset if position is 'top'\n * @default 50px\n */\n topOffset?: number | string;\n /**\n * Modal title that is used in header\n */\n title?: string;\n /**\n * Size of the modal window\n * @default medium\n */\n size?: ModalSizeType;\n /**\n * Are modals higher than viewport allowed\n * @default false\n */\n allowHeightOverflow?: boolean;\n\n /**\n * Optional props to override ModalHeader behaviour\n */\n modalHeaderProps?: Partial<ModalHeaderProps>;\n\n /**\n * Optional props to override ModalContent behaviour\n */\n modalContentProps?: Partial<ModalContentProps>;\n\n /**\n * Optional property to set initial focus\n */\n initialFocusRef?: React.RefObject<HTMLElement>;\n\n children: React.ReactNode | RenderModal;\n}\n\ntype RenderModal = (modalProps: ModalProps) => React.ReactNode;\n\nfunction focusFirstWithinNode(node: HTMLElement) {\n if (node && node.querySelectorAll) {\n const elements = node.querySelectorAll('input, button');\n if (elements.length > 0) {\n const firstElement = elements[0];\n // @ts-expect-error focus might be missing\n if (typeof firstElement.focus === 'function') {\n // @ts-expect-error focus might be missing\n firstElement.focus();\n }\n }\n }\n}\n\nexport function Modal({\n allowHeightOverflow = false,\n position = 'center',\n shouldCloseOnEscapePress = true,\n shouldCloseOnOverlayClick = true,\n size = 'medium',\n testId = 'cf-ui-modal',\n topOffset = '50px',\n aria,\n ...otherProps\n}: ModalProps) {\n const contentRef = React.useRef<HTMLDivElement>(null);\n\n const props = {\n ...otherProps,\n allowHeightOverflow,\n position,\n shouldCloseOnEscapePress,\n shouldCloseOnOverlayClick,\n size,\n testId,\n topOffset,\n };\n\n const styles = getModalStyles({\n position,\n size,\n allowHeightOverflow,\n className: otherProps.className,\n });\n\n React.useEffect(() => {\n if (props.isShown) {\n setTimeout(() => {\n if (props.initialFocusRef && props.initialFocusRef.current) {\n if (props.initialFocusRef.current.focus) {\n props.initialFocusRef.current.focus();\n }\n } else if (contentRef.current) {\n focusFirstWithinNode(contentRef.current);\n }\n }, 100);\n }\n }, [props.isShown, props.initialFocusRef]);\n\n const renderDefault = () => {\n return (\n <React.Fragment>\n {otherProps.title && (\n <ModalHeader\n title={otherProps.title}\n onClose={props.onClose}\n {...otherProps.modalHeaderProps}\n />\n )}\n <ModalContent {...otherProps.modalContentProps}>\n {otherProps.children}\n </ModalContent>\n </React.Fragment>\n );\n };\n\n return (\n <ReactModal\n ariaHideApp={false}\n aria={aria}\n onRequestClose={props.onClose}\n isOpen={otherProps.isShown}\n onAfterOpen={props.onAfterOpen}\n shouldCloseOnEsc={shouldCloseOnEscapePress}\n shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n shouldFocusAfterRender\n shouldReturnFocusAfterClose\n portalClassName={styles.portal}\n className={{\n base: styles.base.root,\n afterOpen: styles.base.afterOpen,\n beforeClose: styles.base.beforeClose,\n }}\n style={{\n content: {\n top: position === 'center' ? 0 : topOffset,\n },\n }}\n overlayClassName={{\n base: styles.modalOverlay.root,\n afterOpen: styles.modalOverlay.afterOpen,\n beforeClose: styles.modalOverlay.beforeClose,\n }}\n closeTimeoutMS={300}\n contentRef={(ref) => {\n contentRef.current = ref;\n }}\n >\n <Box\n testId={testId}\n style={{\n width: ModalSizesMapper[size] || size,\n }}\n className={styles.modal}\n data-modal-root\n >\n {typeof otherProps.children === 'function'\n ? otherProps.children(props)\n : renderDefault()}\n </Box>\n </ReactModal>\n );\n}\n\nModal.displayName = 'Modal';\n","import React from 'react';\n\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Flex } from '@contentful/f36-core';\nimport { ButtonGroup } from '@contentful/f36-button';\n\ninterface ModalControlsInternalProps extends CommonProps {\n children: React.ReactElement[] | React.ReactElement;\n}\n\nexport type ModalControlsProps = PropsWithHTMLElement<\n ModalControlsInternalProps,\n 'div'\n>;\n\nexport function ModalControls({\n testId = 'cf-ui-modal-controls',\n className,\n children,\n ...otherProps\n}: ModalControlsProps): React.ReactElement {\n return (\n <Flex\n {...otherProps}\n className={className}\n testId={testId}\n flexDirection=\"row\"\n justifyContent=\"flex-end\"\n margin=\"spacingL\"\n marginTop=\"none\"\n >\n <ButtonGroup variant=\"spaced\" spacing=\"spacingS\">\n {children}\n </ButtonGroup>\n </Flex>\n );\n}\n\nModalControls.displayName = 'ModalControls';\n","import { Modal as OriginalModal } from './Modal';\nimport { ModalContent } from './ModalContent/ModalContent';\nimport { ModalHeader } from './ModalHeader/ModalHeader';\nimport { ModalControls } from './ModalControls/ModalControls';\n\ntype CompoundModal = typeof OriginalModal & {\n Content: typeof ModalContent;\n Header: typeof ModalHeader;\n Controls: typeof ModalControls;\n};\n\nexport const Modal = OriginalModal as CompoundModal;\nModal.Content = ModalContent;\nModal.Header = ModalHeader;\nModal.Controls = ModalControls;\n","import React from 'react';\n\nimport { Modal } from '../CompoundModal';\nimport { ModalProps } from '../Modal';\nimport type { ModalSizeType } from '../types';\nimport type { ModalHeaderProps } from '../ModalHeader/ModalHeader';\nimport type { ModalContentProps } from '../ModalContent/ModalContent';\nimport type { ModalControlsProps } from '../ModalControls/ModalControls';\nimport { Button } from '@contentful/f36-button';\n\nexport interface ModalConfirmProps {\n /**\n * When true, the dialog is shown.\n */\n isShown: boolean;\n /**\n * Function that will be called when the confirm button is clicked. This does not close the ModalConfirm.\n */\n onConfirm(): void;\n /**\n * Function that will be called when the cancel button is clicked. This does not close the ModalConfirm.\n */\n onCancel: ModalProps['onClose'];\n /**\n Modal title that is used in header\n */\n title?: string;\n /**\n * Label of the confirm button\n */\n confirmLabel?: string | false;\n /**\n * Label of the cancel button\n */\n cancelLabel?: string | false;\n /**\n * The intent of the ModalConfirm. Used for the Button.\n */\n intent?: 'primary' | 'positive' | 'negative';\n /**\n Size of the modal window\n */\n size?: ModalSizeType;\n /**\n * Boolean indicating if clicking the overlay should close the overlay.\n */\n shouldCloseOnOverlayClick?: boolean;\n /**\n * Boolean indicating if pressing the esc key should close the overlay.\n */\n shouldCloseOnEscapePress?: boolean;\n /**\n * When true, the confirm button is set to disabled.\n */\n isConfirmDisabled?: boolean;\n /**\n * When true, the confirm button is set to loading.\n */\n isConfirmLoading?: boolean;\n /**\n * Are modals higher than viewport allowed\n */\n allowHeightOverflow?: boolean;\n\n /**\n * Optional props to override ModalHeader behaviour\n */\n modalHeaderProps?: Partial<ModalHeaderProps>;\n\n /**\n * Optional props to override ModalContent behaviour\n */\n modalContentProps?: Partial<ModalContentProps>;\n\n /**\n * Optional props to override ModalControl behaviour\n */\n modalControlsProps?: Partial<ModalControlsProps>;\n\n /**\n * Optional property to set initial focus\n */\n initialFocusRef?: React.RefObject<HTMLElement>;\n\n testId?: string;\n confirmTestId?: string;\n cancelTestId?: string;\n children: React.ReactNode;\n}\n\nexport function ModalConfirm({\n allowHeightOverflow = false,\n cancelLabel = 'Cancel',\n cancelTestId = 'cf-ui-modal-confirm-cancel-button',\n children,\n confirmLabel = 'Confirm',\n confirmTestId = 'cf-ui-modal-confirm-confirm-button',\n intent = 'positive',\n isConfirmDisabled = false,\n isConfirmLoading = false,\n isShown,\n modalContentProps,\n modalControlsProps,\n modalHeaderProps,\n onCancel,\n onConfirm,\n shouldCloseOnEscapePress = true,\n shouldCloseOnOverlayClick = true,\n size = 'medium',\n testId = 'cf-ui-modal-confirm',\n title = 'Are you sure?',\n initialFocusRef,\n}: ModalConfirmProps) {\n const cancelRef = React.useRef(null);\n\n const confirmButton = confirmLabel ? (\n <Button\n testId={confirmTestId}\n isDisabled={isConfirmDisabled}\n isLoading={isConfirmLoading}\n variant={intent}\n size=\"small\"\n onClick={() => onConfirm()}\n >\n {confirmLabel}\n </Button>\n ) : null;\n\n const cancelButton = cancelLabel ? (\n <Button\n testId={cancelTestId}\n variant=\"secondary\"\n onClick={onCancel}\n size=\"small\"\n ref={initialFocusRef || cancelRef}\n >\n {cancelLabel}\n </Button>\n ) : null;\n\n return (\n <Modal\n testId={testId}\n isShown={isShown}\n onClose={onCancel}\n size={size}\n shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n shouldCloseOnEscapePress={shouldCloseOnEscapePress}\n allowHeightOverflow={allowHeightOverflow}\n initialFocusRef={cancelRef}\n >\n {() => {\n return (\n <React.Fragment>\n <Modal.Header title={title || ''} {...modalHeaderProps} />\n <Modal.Content {...modalContentProps}>{children}</Modal.Content>\n <Modal.Controls {...modalControlsProps}>\n {cancelButton}\n {confirmButton}\n </Modal.Controls>\n </React.Fragment>\n );\n }}\n </Modal>\n );\n}\n\nModalConfirm.displayName = 'ModalConfirm';\n","/* global Promise */\nimport ReactDOM from 'react-dom';\n\n// @todo: change any to unknown\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ninterface ModalLauncherComponentRendererProps<T = any> {\n isShown: boolean;\n onClose: (result?: T) => void;\n}\n\ninterface ModalLauncherOpenOptions {\n /**\n * Unique id to be used as identifier for the modal contianer\n */\n modalId?: string;\n /**\n * ms before removing the component from the tree\n * @default 300\n */\n delay?: number;\n}\n\ninterface CloseModalData {\n delay: number;\n render: (args: ModalLauncherComponentRendererProps<any>) => void;\n currentConfig: ModalLauncherComponentRendererProps<any>;\n}\n\nconst getRoot = (rootElId: string): HTMLElement => {\n // Reuse the container if we find it\n let rootDom = document.getElementById(rootElId);\n if (rootDom !== null) {\n return rootDom;\n }\n\n // Otherwise create it\n rootDom = document.createElement('div');\n rootDom.setAttribute('id', rootElId);\n document.body.appendChild(rootDom);\n return rootDom;\n};\n\nconst openModalsIds: Map<string, CloseModalData> = new Map();\nfunction closeAll() {\n openModalsIds.forEach(async ({ render, currentConfig, delay }, rootElId) => {\n const config = { ...currentConfig, isShown: false };\n render(config);\n await new Promise((resolveDelay) => setTimeout(resolveDelay, delay));\n ReactDOM.unmountComponentAtNode(getRoot(rootElId));\n openModalsIds.delete(rootElId);\n });\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction open<T = any>(\n componentRenderer: (\n props: ModalLauncherComponentRendererProps<T>,\n ) => JSX.Element,\n options: ModalLauncherOpenOptions = {},\n): Promise<T> {\n options = { delay: 300, ...options };\n\n // Allow components to specify if they wish to reuse the modal container\n const rootElId = `modals-root${options.modalId || Date.now()}`;\n const rootDom = getRoot(rootElId);\n\n return new Promise((resolve) => {\n let currentConfig = { onClose, isShown: true };\n\n function render({\n onClose,\n isShown,\n }: ModalLauncherComponentRendererProps<T>) {\n ReactDOM.render(componentRenderer({ onClose, isShown }), rootDom);\n }\n\n async function onClose(arg?: T) {\n currentConfig = {\n ...currentConfig,\n isShown: false,\n };\n render(currentConfig);\n await new Promise((resolveDelay) =>\n setTimeout(resolveDelay, options.delay),\n );\n ReactDOM.unmountComponentAtNode(rootDom);\n rootDom.remove();\n openModalsIds.delete(rootElId);\n resolve(arg);\n }\n\n render(currentConfig);\n openModalsIds.set(rootElId, {\n render,\n currentConfig,\n delay: options.delay,\n });\n });\n}\n\nexport const ModalLauncher = {\n open,\n closeAll,\n};\n","export { Modal } from './CompoundModal';\nexport type { ModalProps } from './Modal';\nexport { ModalConfirm } from './ModalConfirm/ModalConfirm';\nexport type { ModalConfirmProps } from './ModalConfirm/ModalConfirm';\nexport { ModalContent } from './ModalContent/ModalContent';\nexport type { ModalContentProps } from './ModalContent/ModalContent';\nexport { ModalControls } from './ModalControls/ModalControls';\nexport type { ModalControlsProps } from './ModalControls/ModalControls';\nexport { ModalHeader } from './ModalHeader/ModalHeader';\nexport type { ModalHeaderProps } from './ModalHeader/ModalHeader';\nexport { ModalLauncher } from './ModalLauncher/ModalLauncher';\n","export * from './src/index';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
1
+ {"mappings":"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","sources":["packages/components/modal/src/ModalHeader/ModalHeader.styles.ts","packages/components/modal/src/ModalHeader/ModalHeader.tsx","packages/components/modal/src/ModalContent/ModalContent.styles.ts","packages/components/modal/src/ModalContent/ModalContent.tsx","packages/components/modal/src/types.ts","packages/components/modal/src/Modal.styles.ts","packages/components/modal/src/Modal.tsx","packages/components/modal/src/ModalControls/ModalControls.tsx","packages/components/modal/src/CompoundModal.tsx","packages/components/modal/src/ModalConfirm/ModalConfirm.tsx","packages/components/modal/src/ModalLauncher/ModalLauncher.tsx","packages/components/modal/src/index.ts","packages/components/modal/index.ts"],"sourcesContent":["import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\n\nexport function getModalHeaderStyles() {\n return {\n root: css({\n position: 'relative',\n padding: `${tokens.spacingM} ${tokens.spacingM} ${tokens.spacingM} ${tokens.spacingL}`,\n borderRadius: `${tokens.borderRadiusMedium} ${tokens.borderRadiusMedium} 0 0`,\n borderBottom: `1px solid ${tokens.gray300}`,\n }),\n buttonContainer: css({\n position: 'relative',\n width: tokens.spacing2Xl,\n height: tokens.spacingL,\n button: {\n position: 'absolute',\n top: `calc(-1 * ${tokens.spacing2Xs})`,\n right: 0,\n },\n }),\n };\n}\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { CloseIcon } from '@contentful/f36-icons';\nimport { Flex } from '@contentful/f36-core';\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Button } from '@contentful/f36-button';\nimport { Subheading } from '@contentful/f36-typography';\n\nimport { getModalHeaderStyles } from './ModalHeader.styles';\n\ninterface ModalHeaderInternalProps extends CommonProps {\n title: string;\n onClose?: Function;\n}\n\nexport type ModalHeaderProps = PropsWithHTMLElement<\n ModalHeaderInternalProps,\n 'div'\n>;\n\nexport function ModalHeader({\n onClose,\n title,\n testId = 'cf-ui-modal-header',\n className,\n ...otherProps\n}: ModalHeaderProps): React.ReactElement {\n const styles = getModalHeaderStyles();\n\n return (\n <Flex\n {...otherProps}\n className={cx(styles.root, className)}\n testId={testId}\n alignItems=\"center\"\n justifyContent=\"space-between\"\n >\n <Subheading as=\"h1\" isTruncated marginBottom=\"none\">\n {title}\n </Subheading>\n {onClose && (\n <Flex alignItems=\"center\" className={styles.buttonContainer}>\n <Button\n variant=\"transparent\"\n aria-label=\"Close\"\n startIcon={<CloseIcon size=\"small\" />}\n onClick={() => {\n onClose();\n }}\n size=\"small\"\n />\n </Flex>\n )}\n </Flex>\n );\n}\n\nModalHeader.displayName = 'ModalHeader';\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport function getModalContentStyles() {\n return {\n root: css({\n padding: `${tokens.spacingM} ${tokens.spacingL}`,\n color: tokens.gray700,\n fontSize: tokens.fontSizeM,\n fontFamily: tokens.fontStackPrimary,\n lineHeight: tokens.lineHeightM,\n overflowY: 'auto',\n overflowX: 'auto',\n boxSizing: 'border-box',\n }),\n };\n}\n","import React from 'react';\nimport { cx } from 'emotion';\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Box } from '@contentful/f36-core';\nimport { getModalContentStyles } from './ModalContent.styles';\n\ninterface ModalContentInternalProps extends CommonProps {\n children: React.ReactNode;\n}\n\nexport type ModalContentProps = PropsWithHTMLElement<\n ModalContentInternalProps,\n 'div'\n>;\n\nexport function ModalContent({\n testId = 'cf-ui-modal-content',\n className,\n children,\n ...otherProps\n}: ModalContentProps) {\n const styles = getModalContentStyles();\n return (\n <Box\n {...otherProps}\n as=\"div\"\n className={cx(styles.root, className)}\n testId={testId}\n >\n {children}\n </Box>\n );\n}\n\nModalContent.displayName = 'ModalContent';\n","export type ModalSizeType =\n | 'small'\n | 'medium'\n | 'large'\n | 'fullWidth'\n | 'zen'\n | string\n | number;\n\nexport type ModalPositionType = 'center' | 'top';\n","import tokens from '@contentful/f36-tokens';\nimport { css, cx } from 'emotion';\nimport type { ModalPositionType, ModalSizeType } from './types';\n\nexport function getModalStyles(props: {\n size: ModalSizeType;\n position: ModalPositionType;\n allowHeightOverflow?: boolean;\n className?: string;\n}) {\n const modal = cx(\n css({\n margin: tokens.spacing2Xl,\n backgroundColor: tokens.colorWhite,\n borderRadius: tokens.borderRadiusMedium,\n boxShadow: tokens.boxShadowHeavy,\n maxHeight: `calc(100vh - 1rem * (100 / ${tokens.fontBaseDefault}))`,\n maxWidth: `calc(100vw - 1rem * (100 / ${tokens.fontBaseDefault}))`,\n overflow: 'hidden',\n display: 'flex',\n flexDirection: 'column',\n }),\n props.allowHeightOverflow\n ? css({\n overflow: 'auto',\n maxHeight: 'none',\n })\n : null,\n props.size === 'zen'\n ? css({\n maxWidth: 'none',\n maxHeight: 'none',\n margin: 0,\n height: '100%',\n width: '100%',\n })\n : null,\n props.className,\n );\n\n return {\n portal: css({\n display: 'block',\n }),\n base: {\n root: cx(\n css({\n zIndex: tokens.zIndexModalContent,\n position: 'relative',\n padding: 0,\n display: 'inline-block',\n margin: '0 auto',\n textAlign: 'left',\n outline: 'none',\n transform: 'scale(0.85)',\n transition: `transform ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n }),\n props.size === 'zen'\n ? css({\n width: '100%',\n height: '100%',\n })\n : null,\n ),\n afterOpen: css({\n transform: 'scale(1)',\n }),\n beforeClose: css({\n transform: 'scale(0.85)',\n }),\n },\n modalOverlay: {\n root: cx(\n css({\n display: 'flex',\n alignItems: 'baseline',\n flexWrap: 'wrap',\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n zIndex: tokens.zIndexModal,\n opacity: 0,\n transition: `opacity ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n position: 'fixed',\n overflowY: 'auto',\n backgroundColor: 'rgba(12, 20, 28, 0.74902)',\n textAlign: 'center',\n }),\n props.position === 'center'\n ? css({\n alignItems: 'center',\n justifyContent: 'center',\n })\n : null,\n ),\n afterOpen: css({\n opacity: 1,\n }),\n beforeClose: css({\n opacity: 0,\n }),\n },\n modal,\n };\n}\n","import * as React from 'react';\nimport ReactModal from 'react-modal';\n\nimport { Box } from '@contentful/f36-core';\nimport type { CommonProps } from '@contentful/f36-core';\n\nimport { ModalHeader, ModalHeaderProps } from './ModalHeader/ModalHeader';\nimport { ModalContent, ModalContentProps } from './ModalContent/ModalContent';\nimport { getModalStyles } from './Modal.styles';\nimport type { ModalSizeType, ModalPositionType } from './types';\n\nconst ModalSizesMapper = {\n medium: '520px',\n small: '400px',\n large: '700px',\n fullWidth: '100vw',\n zen: '100vw',\n};\n\nexport interface ModalProps extends CommonProps {\n /**\n * When true, the dialog is shown.\n */\n isShown: boolean;\n\n /**\n * Function that will be run when the modal is requested to be closed, prior to actually closing.\n */\n onClose: ReactModal.Props['onRequestClose'];\n\n /**\n * Function that will be run after the modal has opened.\n */\n onAfterOpen?: ReactModal.Props['onAfterOpen'];\n\n /**\n * Additional aria attributes\n */\n aria?: ReactModal.Props['aria'];\n\n /**\n * Boolean indicating if clicking the overlay should close the overlay.\n * @default true\n */\n shouldCloseOnOverlayClick?: boolean;\n /**\n * Boolean indicating if pressing the esc key should close the overlay.\n * @default true\n */\n shouldCloseOnEscapePress?: boolean;\n /**\n * Indicating if modal is centered or linked to the top\n * @default center\n */\n position?: ModalPositionType;\n /**\n * Top offset if position is 'top'\n * @default 50px\n */\n topOffset?: number | string;\n /**\n * Modal title that is used in header\n */\n title?: string;\n /**\n * Size of the modal window\n * @default medium\n */\n size?: ModalSizeType;\n /**\n * Are modals higher than viewport allowed\n * @default false\n */\n allowHeightOverflow?: boolean;\n\n /**\n * Optional props to override ModalHeader behaviour\n */\n modalHeaderProps?: Partial<ModalHeaderProps>;\n\n /**\n * Optional props to override ModalContent behaviour\n */\n modalContentProps?: Partial<ModalContentProps>;\n\n /**\n * Optional property to set initial focus\n */\n initialFocusRef?: React.RefObject<HTMLElement>;\n\n children: React.ReactNode | RenderModal;\n}\n\ntype RenderModal = (modalProps: ModalProps) => React.ReactNode;\n\nfunction focusFirstWithinNode(node: HTMLElement) {\n if (node && node.querySelectorAll) {\n const elements = node.querySelectorAll('input, button');\n if (elements.length > 0) {\n const firstElement = elements[0];\n // @ts-expect-error focus might be missing\n if (typeof firstElement.focus === 'function') {\n // @ts-expect-error focus might be missing\n firstElement.focus();\n }\n }\n }\n}\n\nexport function Modal({\n allowHeightOverflow = false,\n position = 'center',\n shouldCloseOnEscapePress = true,\n shouldCloseOnOverlayClick = true,\n size = 'medium',\n testId = 'cf-ui-modal',\n topOffset = '50px',\n aria,\n ...otherProps\n}: ModalProps) {\n const contentRef = React.useRef<HTMLDivElement>(null);\n\n const props = {\n ...otherProps,\n allowHeightOverflow,\n position,\n shouldCloseOnEscapePress,\n shouldCloseOnOverlayClick,\n size,\n testId,\n topOffset,\n };\n\n const styles = getModalStyles({\n position,\n size,\n allowHeightOverflow,\n className: otherProps.className,\n });\n\n React.useEffect(() => {\n if (props.isShown) {\n setTimeout(() => {\n if (props.initialFocusRef && props.initialFocusRef.current) {\n if (props.initialFocusRef.current.focus) {\n props.initialFocusRef.current.focus();\n }\n } else if (contentRef.current) {\n focusFirstWithinNode(contentRef.current);\n }\n }, 100);\n }\n }, [props.isShown, props.initialFocusRef]);\n\n const renderDefault = () => {\n return (\n <React.Fragment>\n {otherProps.title && (\n <ModalHeader\n title={otherProps.title}\n onClose={props.onClose}\n {...otherProps.modalHeaderProps}\n />\n )}\n <ModalContent {...otherProps.modalContentProps}>\n {otherProps.children}\n </ModalContent>\n </React.Fragment>\n );\n };\n\n return (\n <ReactModal\n ariaHideApp={false}\n aria={aria}\n onRequestClose={props.onClose}\n isOpen={otherProps.isShown}\n onAfterOpen={props.onAfterOpen}\n shouldCloseOnEsc={shouldCloseOnEscapePress}\n shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n shouldFocusAfterRender\n shouldReturnFocusAfterClose\n portalClassName={styles.portal}\n style={{\n content: {\n top: position === 'center' ? 0 : topOffset,\n },\n }}\n className={{\n base: styles.base.root,\n afterOpen: styles.base.afterOpen,\n beforeClose: styles.base.beforeClose,\n }}\n overlayClassName={{\n base: styles.modalOverlay.root,\n afterOpen: styles.modalOverlay.afterOpen,\n beforeClose: styles.modalOverlay.beforeClose,\n }}\n closeTimeoutMS={200}\n contentRef={(ref) => {\n contentRef.current = ref;\n }}\n >\n <Box\n testId={testId}\n style={{\n width: ModalSizesMapper[size] || size,\n }}\n className={styles.modal}\n data-modal-root\n >\n {typeof otherProps.children === 'function'\n ? otherProps.children(props)\n : renderDefault()}\n </Box>\n </ReactModal>\n );\n}\n\nModal.displayName = 'Modal';\n","import React from 'react';\n\nimport type { PropsWithHTMLElement, CommonProps } from '@contentful/f36-core';\nimport { Flex } from '@contentful/f36-core';\nimport { ButtonGroup } from '@contentful/f36-button';\n\ninterface ModalControlsInternalProps extends CommonProps {\n children: React.ReactElement[] | React.ReactElement;\n}\n\nexport type ModalControlsProps = PropsWithHTMLElement<\n ModalControlsInternalProps,\n 'div'\n>;\n\nexport function ModalControls({\n testId = 'cf-ui-modal-controls',\n className,\n children,\n ...otherProps\n}: ModalControlsProps): React.ReactElement {\n return (\n <Flex\n {...otherProps}\n className={className}\n testId={testId}\n flexDirection=\"row\"\n justifyContent=\"flex-end\"\n margin=\"spacingL\"\n marginTop=\"none\"\n >\n <ButtonGroup variant=\"spaced\" spacing=\"spacingS\">\n {children}\n </ButtonGroup>\n </Flex>\n );\n}\n\nModalControls.displayName = 'ModalControls';\n","import { Modal as OriginalModal } from './Modal';\nimport { ModalContent } from './ModalContent/ModalContent';\nimport { ModalHeader } from './ModalHeader/ModalHeader';\nimport { ModalControls } from './ModalControls/ModalControls';\n\ntype CompoundModal = typeof OriginalModal & {\n Content: typeof ModalContent;\n Header: typeof ModalHeader;\n Controls: typeof ModalControls;\n};\n\nexport const Modal = OriginalModal as CompoundModal;\nModal.Content = ModalContent;\nModal.Header = ModalHeader;\nModal.Controls = ModalControls;\n","import React from 'react';\n\nimport { Modal } from '../CompoundModal';\nimport { ModalProps } from '../Modal';\nimport type { ModalSizeType } from '../types';\nimport type { ModalHeaderProps } from '../ModalHeader/ModalHeader';\nimport type { ModalContentProps } from '../ModalContent/ModalContent';\nimport type { ModalControlsProps } from '../ModalControls/ModalControls';\nimport { Button } from '@contentful/f36-button';\n\nexport interface ModalConfirmProps {\n /**\n * When true, the dialog is shown.\n */\n isShown: boolean;\n /**\n * Function that will be called when the confirm button is clicked. This does not close the ModalConfirm.\n */\n onConfirm(): void;\n /**\n * Function that will be called when the cancel button is clicked. This does not close the ModalConfirm.\n */\n onCancel: ModalProps['onClose'];\n /**\n Modal title that is used in header\n */\n title?: string;\n /**\n * Label of the confirm button\n */\n confirmLabel?: string | false;\n /**\n * Label of the cancel button\n */\n cancelLabel?: string | false;\n /**\n * The intent of the ModalConfirm. Used for the Button.\n */\n intent?: 'primary' | 'positive' | 'negative';\n /**\n Size of the modal window\n */\n size?: ModalSizeType;\n /**\n * Boolean indicating if clicking the overlay should close the overlay.\n */\n shouldCloseOnOverlayClick?: boolean;\n /**\n * Boolean indicating if pressing the esc key should close the overlay.\n */\n shouldCloseOnEscapePress?: boolean;\n /**\n * When true, the confirm button is set to disabled.\n */\n isConfirmDisabled?: boolean;\n /**\n * When true, the confirm button is set to loading.\n */\n isConfirmLoading?: boolean;\n /**\n * Are modals higher than viewport allowed\n */\n allowHeightOverflow?: boolean;\n\n /**\n * Optional props to override ModalHeader behaviour\n */\n modalHeaderProps?: Partial<ModalHeaderProps>;\n\n /**\n * Optional props to override ModalContent behaviour\n */\n modalContentProps?: Partial<ModalContentProps>;\n\n /**\n * Optional props to override ModalControl behaviour\n */\n modalControlsProps?: Partial<ModalControlsProps>;\n\n /**\n * Optional property to set initial focus\n */\n initialFocusRef?: React.RefObject<HTMLElement>;\n\n testId?: string;\n confirmTestId?: string;\n cancelTestId?: string;\n children: React.ReactNode;\n}\n\nexport function ModalConfirm({\n allowHeightOverflow = false,\n cancelLabel = 'Cancel',\n cancelTestId = 'cf-ui-modal-confirm-cancel-button',\n children,\n confirmLabel = 'Confirm',\n confirmTestId = 'cf-ui-modal-confirm-confirm-button',\n intent = 'positive',\n isConfirmDisabled = false,\n isConfirmLoading = false,\n isShown,\n modalContentProps,\n modalControlsProps,\n modalHeaderProps,\n onCancel,\n onConfirm,\n shouldCloseOnEscapePress = true,\n shouldCloseOnOverlayClick = true,\n size = 'medium',\n testId = 'cf-ui-modal-confirm',\n title = 'Are you sure?',\n initialFocusRef,\n}: ModalConfirmProps) {\n const cancelRef = React.useRef(null);\n\n const confirmButton = confirmLabel ? (\n <Button\n testId={confirmTestId}\n isDisabled={isConfirmDisabled}\n isLoading={isConfirmLoading}\n variant={intent}\n size=\"small\"\n onClick={() => onConfirm()}\n >\n {confirmLabel}\n </Button>\n ) : null;\n\n const cancelButton = cancelLabel ? (\n <Button\n testId={cancelTestId}\n variant=\"secondary\"\n onClick={onCancel}\n size=\"small\"\n ref={initialFocusRef || cancelRef}\n >\n {cancelLabel}\n </Button>\n ) : null;\n\n return (\n <Modal\n testId={testId}\n isShown={isShown}\n onClose={onCancel}\n size={size}\n shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n shouldCloseOnEscapePress={shouldCloseOnEscapePress}\n allowHeightOverflow={allowHeightOverflow}\n initialFocusRef={cancelRef}\n >\n {() => {\n return (\n <React.Fragment>\n <Modal.Header title={title || ''} {...modalHeaderProps} />\n <Modal.Content {...modalContentProps}>{children}</Modal.Content>\n <Modal.Controls {...modalControlsProps}>\n {cancelButton}\n {confirmButton}\n </Modal.Controls>\n </React.Fragment>\n );\n }}\n </Modal>\n );\n}\n\nModalConfirm.displayName = 'ModalConfirm';\n","/* global Promise */\nimport ReactDOM from 'react-dom';\n\n// @todo: change any to unknown\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ninterface ModalLauncherComponentRendererProps<T = any> {\n isShown: boolean;\n onClose: (result?: T) => void;\n}\n\ninterface ModalLauncherOpenOptions {\n /**\n * Unique id to be used as identifier for the modal contianer\n */\n modalId?: string;\n /**\n * ms before removing the component from the tree\n * @default 300\n */\n delay?: number;\n}\n\ninterface CloseModalData {\n delay: number;\n render: (args: ModalLauncherComponentRendererProps<any>) => void;\n currentConfig: ModalLauncherComponentRendererProps<any>;\n}\n\nconst getRoot = (rootElId: string): HTMLElement => {\n // Reuse the container if we find it\n let rootDom = document.getElementById(rootElId);\n if (rootDom !== null) {\n return rootDom;\n }\n\n // Otherwise create it\n rootDom = document.createElement('div');\n rootDom.setAttribute('id', rootElId);\n document.body.appendChild(rootDom);\n return rootDom;\n};\n\nconst openModalsIds: Map<string, CloseModalData> = new Map();\nfunction closeAll() {\n openModalsIds.forEach(async ({ render, currentConfig, delay }, rootElId) => {\n const config = { ...currentConfig, isShown: false };\n render(config);\n await new Promise((resolveDelay) => setTimeout(resolveDelay, delay));\n ReactDOM.unmountComponentAtNode(getRoot(rootElId));\n openModalsIds.delete(rootElId);\n });\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction open<T = any>(\n componentRenderer: (\n props: ModalLauncherComponentRendererProps<T>,\n ) => JSX.Element,\n options: ModalLauncherOpenOptions = {},\n): Promise<T> {\n options = { delay: 300, ...options };\n\n // Allow components to specify if they wish to reuse the modal container\n const rootElId = `modals-root${options.modalId || Date.now()}`;\n const rootDom = getRoot(rootElId);\n\n return new Promise((resolve) => {\n let currentConfig = { onClose, isShown: true };\n\n function render({\n onClose,\n isShown,\n }: ModalLauncherComponentRendererProps<T>) {\n ReactDOM.render(componentRenderer({ onClose, isShown }), rootDom);\n }\n\n async function onClose(arg?: T) {\n currentConfig = {\n ...currentConfig,\n isShown: false,\n };\n render(currentConfig);\n await new Promise((resolveDelay) =>\n setTimeout(resolveDelay, options.delay),\n );\n ReactDOM.unmountComponentAtNode(rootDom);\n rootDom.remove();\n openModalsIds.delete(rootElId);\n resolve(arg);\n }\n\n render(currentConfig);\n openModalsIds.set(rootElId, {\n render,\n currentConfig,\n delay: options.delay,\n });\n });\n}\n\nexport const ModalLauncher = {\n open,\n closeAll,\n};\n","export { Modal } from './CompoundModal';\nexport type { ModalProps } from './Modal';\nexport { ModalConfirm } from './ModalConfirm/ModalConfirm';\nexport type { ModalConfirmProps } from './ModalConfirm/ModalConfirm';\nexport { ModalContent } from './ModalContent/ModalContent';\nexport type { ModalContentProps } from './ModalContent/ModalContent';\nexport { ModalControls } from './ModalControls/ModalControls';\nexport type { ModalControlsProps } from './ModalControls/ModalControls';\nexport { ModalHeader } from './ModalHeader/ModalHeader';\nexport type { ModalHeaderProps } from './ModalHeader/ModalHeader';\nexport { ModalLauncher } from './ModalLauncher/ModalLauncher';\n","export * from './src/index';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
package/package.json CHANGED
@@ -1,17 +1,17 @@
1
1
  {
2
2
  "name": "@contentful/f36-modal",
3
- "version": "4.2.7",
3
+ "version": "4.2.10",
4
4
  "description": "Forma 36: Modal component",
5
5
  "scripts": {
6
6
  "build": "parcel build index.ts"
7
7
  },
8
8
  "dependencies": {
9
9
  "@babel/runtime": "^7.6.2",
10
- "@contentful/f36-button": "^4.3.5",
11
- "@contentful/f36-core": "^4.2.2",
12
- "@contentful/f36-icons": "^4.1.3",
10
+ "@contentful/f36-button": "^4.3.7",
11
+ "@contentful/f36-core": "^4.3.0",
12
+ "@contentful/f36-icons": "^4.1.5",
13
13
  "@contentful/f36-tokens": "^4.0.1",
14
- "@contentful/f36-typography": "^4.2.2",
14
+ "@contentful/f36-typography": "^4.2.4",
15
15
  "@types/react-modal": "^3.12.1",
16
16
  "emotion": "^10.0.17",
17
17
  "react-modal": "^3.14.3"
@@ -37,5 +37,5 @@
37
37
  "publishConfig": {
38
38
  "access": "public"
39
39
  },
40
- "gitHead": "1c16ce60b94a22c2e232d77b040009061cbfa4be"
40
+ "gitHead": "a5e41bc0a1c0259bd2ab2e55c80c6ae0e33ec254"
41
41
  }