@nimbus-ds/modal 1.3.0 → 1.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +11 -4
- package/dist/index.d.ts +54 -18
- package/dist/index.js +1 -1
- package/package.json +8 -8
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,17 @@
|
|
|
2
2
|
|
|
3
3
|
The Modal component allows us to call the user's attention to a floating box that can have text, actions or forms to perform tasks by changing the focus from the background. It is an intrusive component as it interrupts the user's operation to present a message or content.
|
|
4
4
|
|
|
5
|
+
## 2023-05-22 `1.3.1`
|
|
6
|
+
|
|
7
|
+
### 🐛 Bug fixes
|
|
8
|
+
|
|
9
|
+
- Fixes a bug where focus wasn't correctly moved to the modal dialog when pressing tab key. ([#157](https://github.com/TiendaNube/nimbus-design-system/pull/157) by [@juanchigallego](https://github.com/juanchigallego))
|
|
10
|
+
|
|
11
|
+
### 📚 3rd party library updates
|
|
12
|
+
|
|
13
|
+
- Removed `@floating-ui/react-dom-interactions`. ([#157](https://github.com/TiendaNube/nimbus-design-system/pull/157) by [@juanchigallego](https://github.com/juanchigallego))
|
|
14
|
+
- Added `@floating-ui/react`. ([#157](https://github.com/TiendaNube/nimbus-design-system/pull/157) by [@juanchigallego](https://github.com/juanchigallego))
|
|
15
|
+
|
|
5
16
|
## 2023-03-13 `1.3.0`
|
|
6
17
|
|
|
7
18
|
### 💡 Others
|
|
@@ -33,10 +44,6 @@ The Modal component allows us to call the user's attention to a floating box tha
|
|
|
33
44
|
|
|
34
45
|
## 2023-01-22 `1.0.0`
|
|
35
46
|
|
|
36
|
-
### 📚 3rd party library updates
|
|
37
|
-
|
|
38
|
-
- Added `webpack@5.74.0`. ([#77](https://github.com/TiendaNube/nimbus-design-system/pull/77) by [@juniorconquista](https://github.com/juniorconquista))
|
|
39
|
-
|
|
40
47
|
### 🎉 New features
|
|
41
48
|
|
|
42
49
|
- Added `children`, `open`, `onDismiss`, `portalId` and `padding` properties to the Component. ([#77](https://github.com/TiendaNube/nimbus-design-system/pull/77) by [@juniorconquista](https://github.com/juniorconquista))
|
package/dist/index.d.ts
CHANGED
|
@@ -12,7 +12,7 @@ export interface Conditions<T> {
|
|
|
12
12
|
declare const card: {
|
|
13
13
|
sprinkle: ((props: {
|
|
14
14
|
backgroundColor?: "primary-surface" | "primary-surfaceHighlight" | "success-surface" | "success-surfaceHighlight" | "warning-surface" | "warning-surfaceHighlight" | "danger-surface" | "danger-surfaceHighlight" | "neutral-background" | "neutral-surface" | "neutral-surfaceHighlight" | undefined;
|
|
15
|
-
padding?: "
|
|
15
|
+
padding?: "small" | "base" | "none" | undefined;
|
|
16
16
|
}) => string) & {
|
|
17
17
|
properties: Set<"backgroundColor" | "padding">;
|
|
18
18
|
};
|
|
@@ -38,8 +38,6 @@ declare const card: {
|
|
|
38
38
|
};
|
|
39
39
|
classnames: {
|
|
40
40
|
container: string;
|
|
41
|
-
container__header: string;
|
|
42
|
-
container__body: string;
|
|
43
41
|
container__footer: string;
|
|
44
42
|
};
|
|
45
43
|
};
|
|
@@ -52,7 +50,15 @@ declare const propertiesModal: {
|
|
|
52
50
|
};
|
|
53
51
|
export type PaddingProperties = keyof typeof propertiesModal.padding;
|
|
54
52
|
export interface ModalSprinkle {
|
|
53
|
+
/**
|
|
54
|
+
* The maxWidth property specifies the maxWidth of a modal's content area. The width of the modal will be defined by the width of the content in this prop.
|
|
55
|
+
* @default { xs: "100%", md: "500px" }
|
|
56
|
+
*/
|
|
55
57
|
maxWidth?: string | Conditions<string>;
|
|
58
|
+
/**
|
|
59
|
+
* The padding properties are used to generate space around an modal's content area.
|
|
60
|
+
* @default base
|
|
61
|
+
*/
|
|
56
62
|
padding?: PaddingProperties | Conditions<PaddingProperties>;
|
|
57
63
|
}
|
|
58
64
|
declare const modal: {
|
|
@@ -112,43 +118,73 @@ declare const modal: {
|
|
|
112
118
|
container__footer: string;
|
|
113
119
|
};
|
|
114
120
|
};
|
|
115
|
-
export interface
|
|
116
|
-
/**
|
|
121
|
+
export interface ModalBodyProperties {
|
|
122
|
+
/**
|
|
123
|
+
* The content of the modal body.
|
|
124
|
+
* @TJS-type React.ReactNode
|
|
125
|
+
*/
|
|
117
126
|
children: ReactNode;
|
|
118
|
-
/**
|
|
127
|
+
/**
|
|
128
|
+
* The padding properties are used to generate space around an modal's body content area.
|
|
129
|
+
* @default base
|
|
130
|
+
*/
|
|
119
131
|
padding?: keyof typeof card.properties.padding;
|
|
120
132
|
}
|
|
133
|
+
export type ModalBodyProps = ModalBodyProperties & HTMLAttributes<HTMLElement>;
|
|
121
134
|
declare const ModalBody: React.FC<ModalBodyProps>;
|
|
122
|
-
export interface
|
|
123
|
-
/**
|
|
135
|
+
export interface ModalFooterProperties {
|
|
136
|
+
/**
|
|
137
|
+
* The content of the modal footer.
|
|
138
|
+
* @TJS-type React.ReactNode
|
|
139
|
+
*/
|
|
124
140
|
children: ReactNode;
|
|
125
141
|
}
|
|
142
|
+
export type ModalFooterProps = ModalFooterProperties & HTMLAttributes<HTMLElement>;
|
|
126
143
|
declare const ModalFooter: React.FC<ModalFooterProps>;
|
|
127
|
-
export interface
|
|
128
|
-
/**
|
|
144
|
+
export interface ModalHeaderProperties {
|
|
145
|
+
/**
|
|
146
|
+
* The content of the modal header.
|
|
147
|
+
* @TJS-type React.ReactNode
|
|
148
|
+
*/
|
|
129
149
|
children?: ReactNode;
|
|
130
|
-
/**
|
|
150
|
+
/**
|
|
151
|
+
* The title to display in the modal header.
|
|
152
|
+
*/
|
|
131
153
|
title?: string;
|
|
132
154
|
}
|
|
155
|
+
export type ModalHeaderProps = ModalHeaderProperties & HTMLAttributes<HTMLElement>;
|
|
133
156
|
declare const ModalHeader: React.FC<ModalHeaderProps>;
|
|
134
|
-
export type ModalExtends = ModalSprinkle & HTMLAttributes<HTMLDivElement>;
|
|
135
157
|
export interface ModalComponents {
|
|
136
158
|
Body: typeof ModalBody;
|
|
137
159
|
Footer: typeof ModalFooter;
|
|
138
160
|
Header: typeof ModalHeader;
|
|
139
161
|
}
|
|
140
|
-
export interface
|
|
141
|
-
/**
|
|
162
|
+
export interface ModalProperties extends ModalSprinkle {
|
|
163
|
+
/**
|
|
164
|
+
* The content of the modal.
|
|
165
|
+
* @TJS-type React.ReactNode
|
|
166
|
+
*/
|
|
142
167
|
children: ReactNode;
|
|
143
|
-
/**
|
|
168
|
+
/**
|
|
169
|
+
* Whether the modal is open or not.
|
|
170
|
+
*/
|
|
144
171
|
open: boolean;
|
|
145
|
-
/**
|
|
172
|
+
/**
|
|
173
|
+
* Callback fired when the component requests to be closed.
|
|
174
|
+
* @TJS-type (open: boolean) => void;
|
|
175
|
+
*/
|
|
146
176
|
onDismiss: (open: boolean) => void;
|
|
147
|
-
/**
|
|
177
|
+
/**
|
|
178
|
+
* Id to be embedded in the portal element
|
|
179
|
+
*/
|
|
148
180
|
portalId?: string;
|
|
149
|
-
/**
|
|
181
|
+
/**
|
|
182
|
+
* The padding properties are used to generate space around an modal's content area.
|
|
183
|
+
* @default base
|
|
184
|
+
*/
|
|
150
185
|
padding?: keyof typeof modal.properties.padding;
|
|
151
186
|
}
|
|
187
|
+
export type ModalProps = ModalProperties & HTMLAttributes<HTMLDivElement>;
|
|
152
188
|
export declare const Modal: React.FC<ModalProps> & ModalComponents;
|
|
153
189
|
|
|
154
190
|
export {
|
package/dist/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react"),require("@floating-ui/react-dom-interactions"),require("@nimbus-ds/icons"),require("@nimbus-ds/icon"),require("@nimbus-ds/styles"),require("@nimbus-ds/title")):"function"==typeof define&&define.amd?define(["react","@floating-ui/react-dom-interactions","@nimbus-ds/icons","@nimbus-ds/icon","@nimbus-ds/styles","@nimbus-ds/title"],t):"object"==typeof exports?exports["@nimbus-ds/modal"]=t(require("react"),require("@floating-ui/react-dom-interactions"),require("@nimbus-ds/icons"),require("@nimbus-ds/icon"),require("@nimbus-ds/styles"),require("@nimbus-ds/title")):e["@nimbus-ds/modal"]=t(e.react,e["@floating-ui/react-dom-interactions"],e["@nimbus-ds/icons"],e["@nimbus-ds/icon"],e["@nimbus-ds/styles"],e["@nimbus-ds/title"])}(global,((e,t,r,o,n,a)=>(()=>{"use strict";var i={960:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.Modal=void 0;const o=r(15).__importDefault(r(156)),n=r(105),a=r(215),i=r(633),l=r(990),c=r(612),s=({className:e,style:t,children:r,padding:c="base",maxWidth:s={xs:"100%",md:"500px"},open:u,portalId:d,onDismiss:f,...p})=>{const{className:y,style:m,otherProps:b}=l.modal.sprinkle({...p,maxWidth:s,padding:c}),{context:_}=(0,n.useFloating)({open:u,onOpenChange:f}),v=(0,n.useClick)(_),h=(0,n.useRole)(_),w=(0,n.useDismiss)(_,{outsidePressEvent:"mousedown"}),{getFloatingProps:g}=(0,n.useInteractions)([v,h,w]),O=(0,n.useId)(),j=(0,n.useId)();return o.default.createElement(n.FloatingPortal,{id:d||"nimbus-modal-floating"},u&&o.default.createElement(n.FloatingOverlay,{className:l.modal.classnames.overlay,lockScroll:!0},o.default.createElement(n.FloatingFocusManager,{context:_},o.default.createElement("div",{...b,style:m,className:[l.modal.classnames.container,y].join(" "),"aria-labelledby":O,"aria-describedby":j,...g(),...p},r,f&&o.default.createElement("button",{"aria-label":"Dismiss modal",className:l.modal.classnames.container__close,"data-testid":"dismiss-modal-button",type:"button",onClick:()=>f(!u),tabIndex:0},o.default.createElement(i.Icon,{color:"neutral-textLow",source:o.default.createElement(a.CloseIcon,null)}))))))};t.Modal=s,s.Body=c.ModalBody,s.Footer=c.ModalFooter,s.Header=c.ModalHeader,s.displayName="Modal",s.Body.displayName="Modal.Body",s.Footer.displayName="Modal.Footer",s.Header.displayName="Modal.Header"},635:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ModalBody=void 0;const o=r(15).__importDefault(r(156)),n=r(990);t.ModalBody=({className:e,style:t,padding:r="base",children:a,...i})=>{const{className:l,style:c,otherProps:s}=n.modal.sprinkle({...i,padding:r});return o.default.createElement("div",{...s,style:c,className:[n.modal.classnames.container__body,l].join(" "),...i},a)}},141:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ModalBody=void 0;const o=r(635);var n=r(635);Object.defineProperty(t,"ModalBody",{enumerable:!0,get:function(){return n.ModalBody}}),t.default=o.ModalBody},986:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ModalFooter=void 0;const o=r(15).__importDefault(r(156)),n=r(990);t.ModalFooter=({className:e,style:t,children:r,...a})=>o.default.createElement("div",{className:n.modal.classnames.container__footer,...a},r)},97:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ModalFooter=void 0;const o=r(986);var n=r(986);Object.defineProperty(t,"ModalFooter",{enumerable:!0,get:function(){return n.ModalFooter}}),t.default=o.ModalFooter},112:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ModalHeader=void 0;const o=r(15).__importDefault(r(156)),n=r(892),a=r(990);t.ModalHeader=({className:e,style:t,title:r,children:i,...l})=>o.default.createElement("div",{...l,className:a.modal.classnames.container__header},r&&o.default.createElement(n.Title,{"data-testid":"header-title",as:"h3"},r),i)},558:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ModalHeader=void 0;const o=r(112);var n=r(112);Object.defineProperty(t,"ModalHeader",{enumerable:!0,get:function(){return n.ModalHeader}}),t.default=o.ModalHeader},612:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0});const o=r(15);o.__exportStar(r(141),t),o.__exportStar(r(97),t),o.__exportStar(r(558),t)},15:(e,t,r)=>{r.r(t),r.d(t,{__assign:()=>a,__asyncDelegator:()=>g,__asyncGenerator:()=>w,__asyncValues:()=>O,__await:()=>h,__awaiter:()=>u,__classPrivateFieldGet:()=>S,__classPrivateFieldIn:()=>F,__classPrivateFieldSet:()=>E,__createBinding:()=>f,__decorate:()=>l,__exportStar:()=>p,__extends:()=>n,__generator:()=>d,__importDefault:()=>x,__importStar:()=>M,__makeTemplateObject:()=>j,__metadata:()=>s,__param:()=>c,__read:()=>m,__rest:()=>i,__spread:()=>b,__spreadArray:()=>v,__spreadArrays:()=>_,__values:()=>y});var o=function(e,t){return o=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])},o(e,t)};function n(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Class extends value "+String(t)+" is not a constructor or null");function r(){this.constructor=e}o(e,t),e.prototype=null===t?Object.create(t):(r.prototype=t.prototype,new r)}var a=function(){return a=Object.assign||function(e){for(var t,r=1,o=arguments.length;r<o;r++)for(var n in t=arguments[r])Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n]);return e},a.apply(this,arguments)};function i(e,t){var r={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&t.indexOf(o)<0&&(r[o]=e[o]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(o=Object.getOwnPropertySymbols(e);n<o.length;n++)t.indexOf(o[n])<0&&Object.prototype.propertyIsEnumerable.call(e,o[n])&&(r[o[n]]=e[o[n]])}return r}function l(e,t,r,o){var n,a=arguments.length,i=a<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,r):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)i=Reflect.decorate(e,t,r,o);else for(var l=e.length-1;l>=0;l--)(n=e[l])&&(i=(a<3?n(i):a>3?n(t,r,i):n(t,r))||i);return a>3&&i&&Object.defineProperty(t,r,i),i}function c(e,t){return function(r,o){t(r,o,e)}}function s(e,t){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(e,t)}function u(e,t,r,o){return new(r||(r=Promise))((function(n,a){function i(e){try{c(o.next(e))}catch(e){a(e)}}function l(e){try{c(o.throw(e))}catch(e){a(e)}}function c(e){var t;e.done?n(e.value):(t=e.value,t instanceof r?t:new r((function(e){e(t)}))).then(i,l)}c((o=o.apply(e,t||[])).next())}))}function d(e,t){var r,o,n,a,i={label:0,sent:function(){if(1&n[0])throw n[1];return n[1]},trys:[],ops:[]};return a={next:l(0),throw:l(1),return:l(2)},"function"==typeof Symbol&&(a[Symbol.iterator]=function(){return this}),a;function l(a){return function(l){return function(a){if(r)throw new TypeError("Generator is already executing.");for(;i;)try{if(r=1,o&&(n=2&a[0]?o.return:a[0]?o.throw||((n=o.return)&&n.call(o),0):o.next)&&!(n=n.call(o,a[1])).done)return n;switch(o=0,n&&(a=[2&a[0],n.value]),a[0]){case 0:case 1:n=a;break;case 4:return i.label++,{value:a[1],done:!1};case 5:i.label++,o=a[1],a=[0];continue;case 7:a=i.ops.pop(),i.trys.pop();continue;default:if(!(n=i.trys,(n=n.length>0&&n[n.length-1])||6!==a[0]&&2!==a[0])){i=0;continue}if(3===a[0]&&(!n||a[1]>n[0]&&a[1]<n[3])){i.label=a[1];break}if(6===a[0]&&i.label<n[1]){i.label=n[1],n=a;break}if(n&&i.label<n[2]){i.label=n[2],i.ops.push(a);break}n[2]&&i.ops.pop(),i.trys.pop();continue}a=t.call(e,i)}catch(e){a=[6,e],o=0}finally{r=n=0}if(5&a[0])throw a[1];return{value:a[0]?a[1]:void 0,done:!0}}([a,l])}}}var f=Object.create?function(e,t,r,o){void 0===o&&(o=r);var n=Object.getOwnPropertyDescriptor(t,r);n&&!("get"in n?!t.__esModule:n.writable||n.configurable)||(n={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(e,o,n)}:function(e,t,r,o){void 0===o&&(o=r),e[o]=t[r]};function p(e,t){for(var r in e)"default"===r||Object.prototype.hasOwnProperty.call(t,r)||f(t,e,r)}function y(e){var t="function"==typeof Symbol&&Symbol.iterator,r=t&&e[t],o=0;if(r)return r.call(e);if(e&&"number"==typeof e.length)return{next:function(){return e&&o>=e.length&&(e=void 0),{value:e&&e[o++],done:!e}}};throw new TypeError(t?"Object is not iterable.":"Symbol.iterator is not defined.")}function m(e,t){var r="function"==typeof Symbol&&e[Symbol.iterator];if(!r)return e;var o,n,a=r.call(e),i=[];try{for(;(void 0===t||t-- >0)&&!(o=a.next()).done;)i.push(o.value)}catch(e){n={error:e}}finally{try{o&&!o.done&&(r=a.return)&&r.call(a)}finally{if(n)throw n.error}}return i}function b(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(m(arguments[t]));return e}function _(){for(var e=0,t=0,r=arguments.length;t<r;t++)e+=arguments[t].length;var o=Array(e),n=0;for(t=0;t<r;t++)for(var a=arguments[t],i=0,l=a.length;i<l;i++,n++)o[n]=a[i];return o}function v(e,t,r){if(r||2===arguments.length)for(var o,n=0,a=t.length;n<a;n++)!o&&n in t||(o||(o=Array.prototype.slice.call(t,0,n)),o[n]=t[n]);return e.concat(o||Array.prototype.slice.call(t))}function h(e){return this instanceof h?(this.v=e,this):new h(e)}function w(e,t,r){if(!Symbol.asyncIterator)throw new TypeError("Symbol.asyncIterator is not defined.");var o,n=r.apply(e,t||[]),a=[];return o={},i("next"),i("throw"),i("return"),o[Symbol.asyncIterator]=function(){return this},o;function i(e){n[e]&&(o[e]=function(t){return new Promise((function(r,o){a.push([e,t,r,o])>1||l(e,t)}))})}function l(e,t){try{(r=n[e](t)).value instanceof h?Promise.resolve(r.value.v).then(c,s):u(a[0][2],r)}catch(e){u(a[0][3],e)}var r}function c(e){l("next",e)}function s(e){l("throw",e)}function u(e,t){e(t),a.shift(),a.length&&l(a[0][0],a[0][1])}}function g(e){var t,r;return t={},o("next"),o("throw",(function(e){throw e})),o("return"),t[Symbol.iterator]=function(){return this},t;function o(o,n){t[o]=e[o]?function(t){return(r=!r)?{value:h(e[o](t)),done:"return"===o}:n?n(t):t}:n}}function O(e){if(!Symbol.asyncIterator)throw new TypeError("Symbol.asyncIterator is not defined.");var t,r=e[Symbol.asyncIterator];return r?r.call(e):(e=y(e),t={},o("next"),o("throw"),o("return"),t[Symbol.asyncIterator]=function(){return this},t);function o(r){t[r]=e[r]&&function(t){return new Promise((function(o,n){(function(e,t,r,o){Promise.resolve(o).then((function(t){e({value:t,done:r})}),t)})(o,n,(t=e[r](t)).done,t.value)}))}}}function j(e,t){return Object.defineProperty?Object.defineProperty(e,"raw",{value:t}):e.raw=t,e}var P=Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t};function M(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)"default"!==r&&Object.prototype.hasOwnProperty.call(e,r)&&f(t,e,r);return P(t,e),t}function x(e){return e&&e.__esModule?e:{default:e}}function S(e,t,r,o){if("a"===r&&!o)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof t?e!==t||!o:!t.has(e))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===r?o:"a"===r?o.call(e):o?o.value:t.get(e)}function E(e,t,r,o,n){if("m"===o)throw new TypeError("Private method is not writable");if("a"===o&&!n)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof t?e!==t||!n:!t.has(e))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===o?n.call(e,r):n?n.value=r:t.set(e,r),r}function F(e,t){if(null===t||"object"!=typeof t&&"function"!=typeof t)throw new TypeError("Cannot use 'in' operator on non-object");return"function"==typeof e?t===e:e.has(t)}},105:e=>{e.exports=t},633:e=>{e.exports=o},215:e=>{e.exports=r},990:e=>{e.exports=n},892:e=>{e.exports=a},156:t=>{t.exports=e}},l={};function c(e){var t=l[e];if(void 0!==t)return t.exports;var r=l[e]={exports:{}};return i[e](r,r.exports,c),r.exports}c.d=(e,t)=>{for(var r in t)c.o(t,r)&&!c.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},c.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),c.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var s={};return(()=>{var e=s;Object.defineProperty(e,"__esModule",{value:!0}),e.Modal=void 0;const t=c(960);var r=c(960);Object.defineProperty(e,"Modal",{enumerable:!0,get:function(){return r.Modal}}),e.default=t.Modal})(),s})()));
|
|
1
|
+
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react"),require("@floating-ui/react"),require("@nimbus-ds/icons"),require("@nimbus-ds/icon"),require("@nimbus-ds/styles"),require("@nimbus-ds/title")):"function"==typeof define&&define.amd?define(["react","@floating-ui/react","@nimbus-ds/icons","@nimbus-ds/icon","@nimbus-ds/styles","@nimbus-ds/title"],t):"object"==typeof exports?exports["@nimbus-ds/modal"]=t(require("react"),require("@floating-ui/react"),require("@nimbus-ds/icons"),require("@nimbus-ds/icon"),require("@nimbus-ds/styles"),require("@nimbus-ds/title")):e["@nimbus-ds/modal"]=t(e.react,e["@floating-ui/react"],e["@nimbus-ds/icons"],e["@nimbus-ds/icon"],e["@nimbus-ds/styles"],e["@nimbus-ds/title"])}(global,((e,t,r,o,n,a)=>(()=>{"use strict";var l={960:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.Modal=void 0;const o=r(15).__importDefault(r(156)),n=r(367),a=r(215),l=r(633),i=r(990),c=r(612),s=({className:e,style:t,children:r,padding:c="base",maxWidth:s={xs:"100%",md:"500px"},open:u,portalId:d,onDismiss:f,...p})=>{const{className:y,style:m,otherProps:b}=i.modal.sprinkle({...p,maxWidth:s,padding:c}),{context:_}=(0,n.useFloating)({open:u,onOpenChange:f}),v=(0,n.useClick)(_),h=(0,n.useRole)(_),w=(0,n.useDismiss)(_,{outsidePressEvent:"mousedown"}),{getFloatingProps:g}=(0,n.useInteractions)([v,h,w]),O=(0,n.useId)(),j=(0,n.useId)();return u?o.default.createElement(n.FloatingPortal,{id:d||"nimbus-modal-floating"},o.default.createElement(n.FloatingOverlay,{className:i.modal.classnames.overlay,lockScroll:!0},o.default.createElement(n.FloatingFocusManager,{context:_},o.default.createElement("div",{...b,ref:_.refs.setFloating,style:m,className:[i.modal.classnames.container,y].join(" "),"aria-labelledby":O,"aria-describedby":j,...g(),...p},r,f&&o.default.createElement("button",{"aria-label":"Dismiss modal",className:i.modal.classnames.container__close,"data-testid":"dismiss-modal-button",type:"button",onClick:()=>f(!u),tabIndex:0},o.default.createElement(l.Icon,{color:"neutral-textLow",source:o.default.createElement(a.CloseIcon,null)})))))):null};t.Modal=s,s.Body=c.ModalBody,s.Footer=c.ModalFooter,s.Header=c.ModalHeader,s.displayName="Modal",s.Body.displayName="Modal.Body",s.Footer.displayName="Modal.Footer",s.Header.displayName="Modal.Header"},635:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ModalBody=void 0;const o=r(15).__importDefault(r(156)),n=r(990);t.ModalBody=({className:e,style:t,padding:r="base",children:a,...l})=>{const{className:i,style:c,otherProps:s}=n.modal.sprinkle({...l,padding:r});return o.default.createElement("div",{...s,style:c,className:[n.modal.classnames.container__body,i].join(" "),...l},a)}},141:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ModalBody=void 0;const o=r(635);var n=r(635);Object.defineProperty(t,"ModalBody",{enumerable:!0,get:function(){return n.ModalBody}}),t.default=o.ModalBody},986:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ModalFooter=void 0;const o=r(15).__importDefault(r(156)),n=r(990);t.ModalFooter=({className:e,style:t,children:r,...a})=>o.default.createElement("div",{className:n.modal.classnames.container__footer,...a},r)},97:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ModalFooter=void 0;const o=r(986);var n=r(986);Object.defineProperty(t,"ModalFooter",{enumerable:!0,get:function(){return n.ModalFooter}}),t.default=o.ModalFooter},112:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ModalHeader=void 0;const o=r(15).__importDefault(r(156)),n=r(892),a=r(990);t.ModalHeader=({className:e,style:t,title:r,children:l,...i})=>o.default.createElement("div",{...i,className:a.modal.classnames.container__header},r&&o.default.createElement(n.Title,{"data-testid":"header-title",as:"h3"},r),l)},558:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ModalHeader=void 0;const o=r(112);var n=r(112);Object.defineProperty(t,"ModalHeader",{enumerable:!0,get:function(){return n.ModalHeader}}),t.default=o.ModalHeader},612:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0});const o=r(15);o.__exportStar(r(141),t),o.__exportStar(r(97),t),o.__exportStar(r(558),t)},15:(e,t,r)=>{r.r(t),r.d(t,{__assign:()=>a,__asyncDelegator:()=>g,__asyncGenerator:()=>w,__asyncValues:()=>O,__await:()=>h,__awaiter:()=>u,__classPrivateFieldGet:()=>S,__classPrivateFieldIn:()=>F,__classPrivateFieldSet:()=>E,__createBinding:()=>f,__decorate:()=>i,__exportStar:()=>p,__extends:()=>n,__generator:()=>d,__importDefault:()=>x,__importStar:()=>M,__makeTemplateObject:()=>j,__metadata:()=>s,__param:()=>c,__read:()=>m,__rest:()=>l,__spread:()=>b,__spreadArray:()=>v,__spreadArrays:()=>_,__values:()=>y});var o=function(e,t){return o=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])},o(e,t)};function n(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Class extends value "+String(t)+" is not a constructor or null");function r(){this.constructor=e}o(e,t),e.prototype=null===t?Object.create(t):(r.prototype=t.prototype,new r)}var a=function(){return a=Object.assign||function(e){for(var t,r=1,o=arguments.length;r<o;r++)for(var n in t=arguments[r])Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n]);return e},a.apply(this,arguments)};function l(e,t){var r={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&t.indexOf(o)<0&&(r[o]=e[o]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(o=Object.getOwnPropertySymbols(e);n<o.length;n++)t.indexOf(o[n])<0&&Object.prototype.propertyIsEnumerable.call(e,o[n])&&(r[o[n]]=e[o[n]])}return r}function i(e,t,r,o){var n,a=arguments.length,l=a<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,r):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)l=Reflect.decorate(e,t,r,o);else for(var i=e.length-1;i>=0;i--)(n=e[i])&&(l=(a<3?n(l):a>3?n(t,r,l):n(t,r))||l);return a>3&&l&&Object.defineProperty(t,r,l),l}function c(e,t){return function(r,o){t(r,o,e)}}function s(e,t){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(e,t)}function u(e,t,r,o){return new(r||(r=Promise))((function(n,a){function l(e){try{c(o.next(e))}catch(e){a(e)}}function i(e){try{c(o.throw(e))}catch(e){a(e)}}function c(e){var t;e.done?n(e.value):(t=e.value,t instanceof r?t:new r((function(e){e(t)}))).then(l,i)}c((o=o.apply(e,t||[])).next())}))}function d(e,t){var r,o,n,a,l={label:0,sent:function(){if(1&n[0])throw n[1];return n[1]},trys:[],ops:[]};return a={next:i(0),throw:i(1),return:i(2)},"function"==typeof Symbol&&(a[Symbol.iterator]=function(){return this}),a;function i(a){return function(i){return function(a){if(r)throw new TypeError("Generator is already executing.");for(;l;)try{if(r=1,o&&(n=2&a[0]?o.return:a[0]?o.throw||((n=o.return)&&n.call(o),0):o.next)&&!(n=n.call(o,a[1])).done)return n;switch(o=0,n&&(a=[2&a[0],n.value]),a[0]){case 0:case 1:n=a;break;case 4:return l.label++,{value:a[1],done:!1};case 5:l.label++,o=a[1],a=[0];continue;case 7:a=l.ops.pop(),l.trys.pop();continue;default:if(!(n=l.trys,(n=n.length>0&&n[n.length-1])||6!==a[0]&&2!==a[0])){l=0;continue}if(3===a[0]&&(!n||a[1]>n[0]&&a[1]<n[3])){l.label=a[1];break}if(6===a[0]&&l.label<n[1]){l.label=n[1],n=a;break}if(n&&l.label<n[2]){l.label=n[2],l.ops.push(a);break}n[2]&&l.ops.pop(),l.trys.pop();continue}a=t.call(e,l)}catch(e){a=[6,e],o=0}finally{r=n=0}if(5&a[0])throw a[1];return{value:a[0]?a[1]:void 0,done:!0}}([a,i])}}}var f=Object.create?function(e,t,r,o){void 0===o&&(o=r);var n=Object.getOwnPropertyDescriptor(t,r);n&&!("get"in n?!t.__esModule:n.writable||n.configurable)||(n={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(e,o,n)}:function(e,t,r,o){void 0===o&&(o=r),e[o]=t[r]};function p(e,t){for(var r in e)"default"===r||Object.prototype.hasOwnProperty.call(t,r)||f(t,e,r)}function y(e){var t="function"==typeof Symbol&&Symbol.iterator,r=t&&e[t],o=0;if(r)return r.call(e);if(e&&"number"==typeof e.length)return{next:function(){return e&&o>=e.length&&(e=void 0),{value:e&&e[o++],done:!e}}};throw new TypeError(t?"Object is not iterable.":"Symbol.iterator is not defined.")}function m(e,t){var r="function"==typeof Symbol&&e[Symbol.iterator];if(!r)return e;var o,n,a=r.call(e),l=[];try{for(;(void 0===t||t-- >0)&&!(o=a.next()).done;)l.push(o.value)}catch(e){n={error:e}}finally{try{o&&!o.done&&(r=a.return)&&r.call(a)}finally{if(n)throw n.error}}return l}function b(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(m(arguments[t]));return e}function _(){for(var e=0,t=0,r=arguments.length;t<r;t++)e+=arguments[t].length;var o=Array(e),n=0;for(t=0;t<r;t++)for(var a=arguments[t],l=0,i=a.length;l<i;l++,n++)o[n]=a[l];return o}function v(e,t,r){if(r||2===arguments.length)for(var o,n=0,a=t.length;n<a;n++)!o&&n in t||(o||(o=Array.prototype.slice.call(t,0,n)),o[n]=t[n]);return e.concat(o||Array.prototype.slice.call(t))}function h(e){return this instanceof h?(this.v=e,this):new h(e)}function w(e,t,r){if(!Symbol.asyncIterator)throw new TypeError("Symbol.asyncIterator is not defined.");var o,n=r.apply(e,t||[]),a=[];return o={},l("next"),l("throw"),l("return"),o[Symbol.asyncIterator]=function(){return this},o;function l(e){n[e]&&(o[e]=function(t){return new Promise((function(r,o){a.push([e,t,r,o])>1||i(e,t)}))})}function i(e,t){try{(r=n[e](t)).value instanceof h?Promise.resolve(r.value.v).then(c,s):u(a[0][2],r)}catch(e){u(a[0][3],e)}var r}function c(e){i("next",e)}function s(e){i("throw",e)}function u(e,t){e(t),a.shift(),a.length&&i(a[0][0],a[0][1])}}function g(e){var t,r;return t={},o("next"),o("throw",(function(e){throw e})),o("return"),t[Symbol.iterator]=function(){return this},t;function o(o,n){t[o]=e[o]?function(t){return(r=!r)?{value:h(e[o](t)),done:"return"===o}:n?n(t):t}:n}}function O(e){if(!Symbol.asyncIterator)throw new TypeError("Symbol.asyncIterator is not defined.");var t,r=e[Symbol.asyncIterator];return r?r.call(e):(e=y(e),t={},o("next"),o("throw"),o("return"),t[Symbol.asyncIterator]=function(){return this},t);function o(r){t[r]=e[r]&&function(t){return new Promise((function(o,n){(function(e,t,r,o){Promise.resolve(o).then((function(t){e({value:t,done:r})}),t)})(o,n,(t=e[r](t)).done,t.value)}))}}}function j(e,t){return Object.defineProperty?Object.defineProperty(e,"raw",{value:t}):e.raw=t,e}var P=Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t};function M(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)"default"!==r&&Object.prototype.hasOwnProperty.call(e,r)&&f(t,e,r);return P(t,e),t}function x(e){return e&&e.__esModule?e:{default:e}}function S(e,t,r,o){if("a"===r&&!o)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof t?e!==t||!o:!t.has(e))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===r?o:"a"===r?o.call(e):o?o.value:t.get(e)}function E(e,t,r,o,n){if("m"===o)throw new TypeError("Private method is not writable");if("a"===o&&!n)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof t?e!==t||!n:!t.has(e))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===o?n.call(e,r):n?n.value=r:t.set(e,r),r}function F(e,t){if(null===t||"object"!=typeof t&&"function"!=typeof t)throw new TypeError("Cannot use 'in' operator on non-object");return"function"==typeof e?t===e:e.has(t)}},367:e=>{e.exports=t},633:e=>{e.exports=o},215:e=>{e.exports=r},990:e=>{e.exports=n},892:e=>{e.exports=a},156:t=>{t.exports=e}},i={};function c(e){var t=i[e];if(void 0!==t)return t.exports;var r=i[e]={exports:{}};return l[e](r,r.exports,c),r.exports}c.d=(e,t)=>{for(var r in t)c.o(t,r)&&!c.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},c.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),c.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var s={};return(()=>{var e=s;Object.defineProperty(e,"__esModule",{value:!0}),e.Modal=void 0;const t=c(960);var r=c(960);Object.defineProperty(e,"Modal",{enumerable:!0,get:function(){return r.Modal}}),e.default=t.Modal})(),s})()));
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nimbus-ds/modal",
|
|
3
|
-
"version": "1.3.
|
|
3
|
+
"version": "1.3.1",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"files": [
|
|
@@ -9,12 +9,12 @@
|
|
|
9
9
|
],
|
|
10
10
|
"sideEffects": false,
|
|
11
11
|
"scripts": {
|
|
12
|
-
"build": "webpack",
|
|
12
|
+
"build": "yarn g:webpack",
|
|
13
13
|
"clean": "rm -rf dist",
|
|
14
14
|
"version": "yarn version"
|
|
15
15
|
},
|
|
16
16
|
"dependencies": {
|
|
17
|
-
"@floating-ui/react
|
|
17
|
+
"@floating-ui/react": "^0.24.1",
|
|
18
18
|
"@nimbus-ds/icon": "^3.0.0",
|
|
19
19
|
"@nimbus-ds/icons": "^1.1.0"
|
|
20
20
|
},
|
|
@@ -31,10 +31,10 @@
|
|
|
31
31
|
"url": "https://github.com/TiendaNube/nimbus-design-system/issues"
|
|
32
32
|
},
|
|
33
33
|
"devDependencies": {
|
|
34
|
-
"@nimbus-ds/box": "^3.
|
|
35
|
-
"@nimbus-ds/button": "^2.
|
|
36
|
-
"@nimbus-ds/text": "^6.
|
|
37
|
-
"@nimbus-ds/title": "^3.
|
|
38
|
-
"webpack": "^
|
|
34
|
+
"@nimbus-ds/box": "^3.2.0",
|
|
35
|
+
"@nimbus-ds/button": "^2.5.0",
|
|
36
|
+
"@nimbus-ds/text": "^6.2.0",
|
|
37
|
+
"@nimbus-ds/title": "^3.1.0",
|
|
38
|
+
"@nimbus-ds/webpack": "^1.3.1"
|
|
39
39
|
}
|
|
40
40
|
}
|