no-frills-ui 0.0.14-alpha.3 → 0.0.14-alpha.4
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/dist/index.js +313 -72
- package/dist/index.js.map +1 -1
- package/lib-esm/components/Accordion/AccordionStep.d.ts.map +1 -1
- package/lib-esm/components/Accordion/AccordionStep.js +18 -11
- package/lib-esm/components/Accordion/AccordionStep.js.map +1 -1
- package/lib-esm/components/Button/ActionButton.js +2 -2
- package/lib-esm/components/Button/ActionButton.js.map +1 -1
- package/lib-esm/components/Button/Button.d.ts +2 -2
- package/lib-esm/components/Button/Button.d.ts.map +1 -1
- package/lib-esm/components/Button/Button.js +6 -2
- package/lib-esm/components/Button/Button.js.map +1 -1
- package/lib-esm/components/Button/LinkButton.js +1 -1
- package/lib-esm/components/Button/LinkButton.js.map +1 -1
- package/lib-esm/components/Button/RaisedButton.js +1 -1
- package/lib-esm/components/Button/RaisedButton.js.map +1 -1
- package/lib-esm/components/Chip/Chip.d.ts +5 -2
- package/lib-esm/components/Chip/Chip.d.ts.map +1 -1
- package/lib-esm/components/Chip/Chip.js +14 -8
- package/lib-esm/components/Chip/Chip.js.map +1 -1
- package/lib-esm/components/ChipInput/ChipInput.d.ts +9 -0
- package/lib-esm/components/ChipInput/ChipInput.d.ts.map +1 -1
- package/lib-esm/components/ChipInput/ChipInput.js +43 -4
- package/lib-esm/components/ChipInput/ChipInput.js.map +1 -1
- package/lib-esm/components/Dialog/AlertDialog.js +1 -1
- package/lib-esm/components/Dialog/AlertDialog.js.map +1 -1
- package/lib-esm/components/Dialog/Dialog.d.ts +6 -1
- package/lib-esm/components/Dialog/Dialog.d.ts.map +1 -1
- package/lib-esm/components/Dialog/Dialog.js.map +1 -1
- package/lib-esm/components/DragAndDrop/DragAndDrop.d.ts +24 -0
- package/lib-esm/components/DragAndDrop/DragAndDrop.d.ts.map +1 -1
- package/lib-esm/components/DragAndDrop/DragAndDrop.js +85 -3
- package/lib-esm/components/DragAndDrop/DragAndDrop.js.map +1 -1
- package/lib-esm/components/DragAndDrop/DragItem.d.ts +4 -0
- package/lib-esm/components/DragAndDrop/DragItem.d.ts.map +1 -1
- package/lib-esm/components/DragAndDrop/DragItem.js +86 -6
- package/lib-esm/components/DragAndDrop/DragItem.js.map +1 -1
- package/lib-esm/components/DragAndDrop/types.d.ts +19 -0
- package/lib-esm/components/DragAndDrop/types.d.ts.map +1 -1
- package/lib-esm/components/DragAndDrop/types.js.map +1 -1
- package/lib-esm/components/Input/Checkbox.d.ts.map +1 -1
- package/lib-esm/components/Input/Checkbox.js +1 -1
- package/lib-esm/components/Input/Checkbox.js.map +1 -1
- package/lib-esm/components/Input/Input.d.ts.map +1 -1
- package/lib-esm/components/Input/Input.js +0 -1
- package/lib-esm/components/Input/Input.js.map +1 -1
- package/lib-esm/components/Input/Select.d.ts.map +1 -1
- package/lib-esm/components/Input/Select.js +0 -1
- package/lib-esm/components/Input/Select.js.map +1 -1
- package/lib-esm/components/Input/TextArea.d.ts.map +1 -1
- package/lib-esm/components/Input/TextArea.js +0 -1
- package/lib-esm/components/Input/TextArea.js.map +1 -1
- package/lib-esm/components/Notification/Notification.d.ts +9 -7
- package/lib-esm/components/Notification/Notification.d.ts.map +1 -1
- package/lib-esm/components/Notification/Notification.js +51 -24
- package/lib-esm/components/Notification/Notification.js.map +1 -1
- package/lib-esm/shared/constants.js +7 -7
- package/lib-esm/shared/constants.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../src/components/Input/Select.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,UAAU,MAAM,wBAAwB,CAAC;AAChD,OAAO,SAAS,MAAM,wBAAwB,CAAC;AAa/C,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAA
|
|
1
|
+
{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../src/components/Input/Select.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useState } from 'react';\nimport PropTypes from 'prop-types';\nimport styled from '@emotion/styled';\nimport ExpandMore from '../../icons/ExpandMore';\nimport constants from '../../shared/constants';\n\ninterface SelectProps\n extends\n PropTypes.InferType<typeof Select.propTypes>,\n React.InputHTMLAttributes<HTMLSelectElement> {\n value?: string;\n}\n\ntype SelectInternalProps = SelectProps & {\n touched: boolean;\n};\n\nconst Label = styled.label`\n display: inline-flex;\n flex-direction: column;\n position: relative;\n margin: 10px 5px;\n pointer-events: none;\n max-width: 268px;\n\n & svg {\n fill: currentColor;\n }\n`;\n\nconst SelectField = styled.select<SelectInternalProps>`\n border: none;\n color: inherit;\n padding: 0 8px;\n line-height: 30px;\n min-height: 32px;\n width: 268px;\n border-radius: 3px;\n border: 1px solid var(--border-color, ${constants.BORDER_COLOR});\n display: inline-block;\n background-color: var(--background, ${constants.BACKGROUND});\n pointer-events: auto;\n appearance: none;\n\n /** Focused */\n &:focus,\n &:active {\n border-color: var(--primary, ${constants.PRIMARY});\n box-shadow: 0 0 0 4px var(--primary, ${constants.PRIMARY_LIGHT});\n }\n\n &:focus ~ span,\n &:active ~ span {\n color: var(--primary, ${constants.PRIMARY});\n }\n\n /** Disabled */\n &:disabled {\n border-color: var(--disabled-border, ${constants.DISABLED_BORDER});\n background-color: var(--disabled-background, ${constants.DISABLED_BACKGROUND});\n }\n\n &:disabled ~ span {\n color: var(--disabled, ${constants.DISABLED});\n }\n\n /** Invalid */\n &:focus:invalid {\n border-color: var(--error, ${constants.ERROR});\n box-shadow: 0 0 0 4px var(--error-light, ${constants.ERROR_LIGHT});\n }\n\n ${(props) =>\n props.touched\n ? `\n &:invalid {\n border-color: var(--error, ${constants.ERROR});\n }\n\n &:invalid ~ span {\n color: var(--error, ${constants.ERROR});\n }\n `\n : ''}\n\n /** Error */\n ${(props) =>\n props.errorText\n ? `\n border-color: var(--error, ${constants.ERROR});\n\n & ~ span {\n color: var(--error, ${constants.ERROR});\n }\n `\n : ''}\n\n /** Required */\n &:required + span:after {\n content: '*';\n margin-left: 2px;\n color: var(--error, ${constants.ERROR});\n }\n\n /** Label Animation */\n & + span {\n position: absolute;\n padding: 0 5px;\n top: 0px;\n left: 4px;\n font-size: 14px;\n line-height: 32px;\n transition: all 300ms ease;\n }\n\n ${(props) =>\n props.value !== ''\n ? `\n & + span {\n top: -8px;\n background: var(--background, ${constants.BACKGROUND});\n font-size: 12px;\n line-height: 14px;\n }\n `\n : ''}\n\n &:focus + span, &:placeholder-shown + span {\n top: -8px;\n background: var(--background, ${constants.BACKGROUND});\n font-size: 12px;\n line-height: 14px;\n }\n`;\n\nconst ErrorContainer = styled.div`\n color: var(--error, ${constants.ERROR});\n padding-top: 3px;\n font-size: 12px;\n line-height: 14px;\n margin-left: 3px;\n`;\n\nconst ArrowContainer = styled.span`\n position: absolute;\n right: 8px;\n top: 8px;\n`;\n\nexport default function Select(props: SelectProps) {\n const [touched, setTouched] = useState(false);\n const [value, setValue] = useState(props.value || '');\n\n const handleFocus = (e: React.FocusEvent<HTMLSelectElement>) => {\n setTouched(true);\n if (props.onFocus) {\n props.onFocus(e);\n }\n };\n\n const onChangeHandler = (e: React.ChangeEvent<HTMLSelectElement>) => {\n if (props.onChange) {\n setValue(e.target.value);\n props.onChange(e);\n } else {\n setValue(e.target.value);\n }\n };\n\n return (\n <Label>\n <SelectField\n {...props}\n multiple={false}\n value={value}\n onChange={onChangeHandler}\n onFocus={handleFocus}\n touched={touched}\n >\n <option />\n {props.children}\n </SelectField>\n <span>{props.label}</span>\n <ArrowContainer>\n <ExpandMore />\n </ArrowContainer>\n {props.errorText && <ErrorContainer>{props.errorText}</ErrorContainer>}\n </Label>\n );\n}\n\nSelect.propTypes = {\n /** Label for the field */\n label: PropTypes.string,\n /** Error text to be shown below the field */\n errorText: PropTypes.string,\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../../src/components/Input/TextArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AACxC,OAAO,SAAS,MAAM,YAAY,CAAC;AAInC,UAAU,aACN,SACI,SAAS,CAAC,SAAS,CAAC,OAAO,QAAQ,CAAC,SAAS,CAAC,EAC9C,KAAK,CAAC,mBAAmB,CAAC,mBAAmB,CAAC;IAClD,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB;
|
|
1
|
+
{"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../../src/components/Input/TextArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AACxC,OAAO,SAAS,MAAM,YAAY,CAAC;AAInC,UAAU,aACN,SACI,SAAS,CAAC,SAAS,CAAC,OAAO,QAAQ,CAAC,SAAS,CAAC,EAC9C,KAAK,CAAC,mBAAmB,CAAC,mBAAmB,CAAC;IAClD,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB;AA2HD,iBAAwB,QAAQ,CAAC,KAAK,EAAE,aAAa,oDAiCpD;kBAjCuB,QAAQ;;QAoC5B,0BAA0B;;QAE1B,6CAA6C;;;;eAtCzB,QAAQ"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextArea.js","sourceRoot":"","sources":["../../../src/components/Input/TextArea.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,SAAS,MAAM,wBAAwB,CAAC;AAa/C,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAA
|
|
1
|
+
{"version":3,"file":"TextArea.js","sourceRoot":"","sources":["../../../src/components/Input/TextArea.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useState } from 'react';\nimport PropTypes from 'prop-types';\nimport styled from '@emotion/styled';\nimport constants from '../../shared/constants';\n\ninterface TextAreaProps\n extends\n PropTypes.InferType<typeof TextArea.propTypes>,\n React.InputHTMLAttributes<HTMLTextAreaElement> {\n value?: string;\n}\n\ntype TextAreaInternalProps = TextAreaProps & {\n touched: boolean;\n};\n\nconst Label = styled.label`\n display: inline-flex;\n flex-direction: column;\n position: relative;\n margin: 10px 5px;\n`;\n\nconst TextField = styled.textarea<TextAreaInternalProps>`\n border: none;\n color: inherit;\n padding: 8px;\n min-height: 150px;\n min-width: 250px;\n border-radius: 3px;\n border: 1px solid var(--border-color, ${constants.BORDER_COLOR});\n display: inline-block;\n background-color: var(--background, ${constants.BACKGROUND});\n\n /** Focused */\n &:focus,\n &:active {\n border-color: var(--primary, ${constants.PRIMARY});\n box-shadow: 0 0 0 4px var(--primary, ${constants.PRIMARY_LIGHT});\n }\n\n &:focus + span,\n &:active + span {\n color: var(--primary, ${constants.PRIMARY});\n }\n\n /** Disabled */\n &:disabled {\n border-color: var(--disabled-border, ${constants.DISABLED_BORDER});\n background-color: var(--disabled-background, ${constants.DISABLED_BACKGROUND});\n }\n\n &:disabled + span {\n color: var(--disabled, ${constants.DISABLED});\n }\n\n /** Invalid */\n &:focus:invalid {\n border-color: var(--error, ${constants.ERROR});\n box-shadow: 0 0 0 4px var(--error-light, ${constants.ERROR_LIGHT});\n }\n\n ${(props) =>\n props.touched\n ? `\n &:invalid {\n border-color: var(--error, ${constants.ERROR});\n }\n\n &:invalid + span {\n color: var(--error, ${constants.ERROR});\n }\n `\n : ''}\n\n /** Error */\n ${(props) =>\n props.errorText\n ? `\n border-color: var(--error, ${constants.ERROR});\n\n & + span {\n color: var(--error, ${constants.ERROR});\n }\n `\n : ''}\n\n /** Required */\n &:required + span:after {\n content: '*';\n margin-left: 2px;\n color: var(--error, ${constants.ERROR});\n }\n\n /** Label Animation */\n & + span {\n position: absolute;\n padding: 0 5px;\n top: 0px;\n left: 4px;\n font-size: 14px;\n line-height: 32px;\n transition: all 300ms ease;\n }\n\n ${(props) =>\n props.value !== ''\n ? `\n & + span {\n top: -8px;\n background: var(--background, ${constants.BACKGROUND});\n font-size: 12px;\n line-height: 14px;\n }\n `\n : ''}\n\n &:focus + span, &:placeholder-shown + span {\n top: -8px;\n background: var(--background, ${constants.BACKGROUND});\n font-size: 12px;\n line-height: 14px;\n }\n`;\n\nconst ErrorContainer = styled.div`\n color: var(--error, ${constants.ERROR});\n padding-top: 3px;\n font-size: 12px;\n line-height: 14px;\n margin-left: 3px;\n`;\n\nexport default function TextArea(props: TextAreaProps) {\n const [touched, setTouched] = useState(false);\n const [value, setValue] = useState(props.value || '');\n\n const handleFocus = (e: React.FocusEvent<HTMLTextAreaElement>) => {\n setTouched(true);\n if (props.onFocus) {\n props.onFocus(e);\n }\n };\n\n const onChangeHandler = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n if (props.onChange) {\n setValue(e.target.value);\n props.onChange(e);\n } else {\n setValue(e.target.value);\n }\n };\n\n return (\n <Label>\n <TextField\n {...props}\n value={value}\n onChange={onChangeHandler}\n onFocus={handleFocus}\n touched={touched}\n />\n <span>{props.label}</span>\n {props.errorText && <ErrorContainer>{props.errorText}</ErrorContainer>}\n </Label>\n );\n}\n\nTextArea.propTypes = {\n /** Label for the field */\n label: PropTypes.string,\n /** Error text to be shown below the field */\n errorText: PropTypes.string,\n};\n"]}
|
|
@@ -38,21 +38,23 @@ declare class Notification {
|
|
|
38
38
|
/**
|
|
39
39
|
* Adds a notification
|
|
40
40
|
*
|
|
41
|
-
* @param position
|
|
42
|
-
* @param options
|
|
41
|
+
* @param position - The position where the notification should appear
|
|
42
|
+
* @param options - Configuration options for the notification
|
|
43
|
+
* @returns The notification ID or a promise that resolves to the notification ID
|
|
43
44
|
*/
|
|
44
|
-
add: (position: NOTIFICATION_POSITION, options: NotificationOptions) => string
|
|
45
|
+
add: (position: NOTIFICATION_POSITION, options: NotificationOptions) => string | Promise<unknown>;
|
|
45
46
|
/**
|
|
46
47
|
* Removes a notification
|
|
47
48
|
*
|
|
48
|
-
* @param position
|
|
49
|
-
* @param id
|
|
49
|
+
* @param position - The position of the notification container
|
|
50
|
+
* @param id - The unique ID of the notification to remove
|
|
50
51
|
*/
|
|
51
52
|
remove: (position: NOTIFICATION_POSITION, id: string) => void;
|
|
52
53
|
/**
|
|
53
|
-
* Destroys entire stack of notifications.
|
|
54
|
+
* Destroys entire stack of notifications at a position.
|
|
55
|
+
* Unmounts the React root and cleans up DOM elements.
|
|
54
56
|
*
|
|
55
|
-
* @param position
|
|
57
|
+
* @param position - The position of the notification container to destroy
|
|
56
58
|
*/
|
|
57
59
|
destroy: (position: NOTIFICATION_POSITION) => void;
|
|
58
60
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Notification.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/Notification.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"Notification.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/Notification.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAChD,OAAO,SAAS,MAAM,YAAY,CAAC;AAKnC,OAAO,EAAE,qBAAqB,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAExF,KAAK,iBAAiB,GAAG,SAAS,CAAC,UAAU,CAAC,OAAO,UAAU,CAAC,SAAS,CAAC,CAAC;AAE3E,8DAA8D;AAC9D,qBAAa,UAAW,SAAQ,KAAK,CAAC,SAAS,CAAC,iBAAiB,CAAC;IAC9D,MAAM,CAAC,SAAS;QACZ,gCAAgC;;QAEhC,+BAA+B;;QAE/B,wDAAwD;;QAExD,oDAAoD;;QAEpD,kCAAkC;;QAElC,2BAA2B;;QAO3B,yBAAyB;;QAEzB,mCAAmC;;QAEnC,mCAAmC;;MAErC;IAEF,MAAM,CAAC,YAAY;;;;MAIjB;IAEF,MAAM,IAAI,KAAK,CAAC,SAAS;CAG5B;AAUD,yBAAyB;AACzB,cAAM,YAAY;IACd,oEAAoE;IACpE,OAAO,CAAC,UAAU,CAOJ;IAEd;;;;;;OAMG;IACI,GAAG,aAAc,qBAAqB,WAAW,mBAAmB,+BAyDzE;IAEF;;;;;OAKG;IACI,MAAM,aAAc,qBAAqB,MAAM,MAAM,UAK1D;IAEF;;;;;OAKG;IACI,OAAO,aAAc,qBAAqB,UAS/C;CACL;AAED,kCAAkC;;AAClC,wBAAkC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx } from "@emotion/react/jsx-runtime";
|
|
2
|
-
import React
|
|
2
|
+
import React from 'react';
|
|
3
3
|
import PropTypes from 'prop-types';
|
|
4
4
|
import { flushSync } from 'react-dom';
|
|
5
5
|
import { createRoot } from 'react-dom/client';
|
|
@@ -57,56 +57,83 @@ class Notification {
|
|
|
57
57
|
/**
|
|
58
58
|
* Adds a notification
|
|
59
59
|
*
|
|
60
|
-
* @param position
|
|
61
|
-
* @param options
|
|
60
|
+
* @param position - The position where the notification should appear
|
|
61
|
+
* @param options - Configuration options for the notification
|
|
62
|
+
* @returns The notification ID or a promise that resolves to the notification ID
|
|
62
63
|
*/
|
|
63
64
|
this.add = (position, options) => {
|
|
64
|
-
let notification;
|
|
65
65
|
if (!this.containers.has(position)) {
|
|
66
|
-
|
|
67
|
-
const
|
|
66
|
+
/** Callback ref to capture the NotificationManager instance when it mounts */
|
|
67
|
+
const refCallback = (instance) => {
|
|
68
|
+
if (instance) {
|
|
69
|
+
const container = this.containers.get(position);
|
|
70
|
+
if (container) {
|
|
71
|
+
container.manager = instance;
|
|
72
|
+
}
|
|
73
|
+
}
|
|
74
|
+
};
|
|
68
75
|
const [Component] = LayerManager.renderLayer({
|
|
69
76
|
closeOnEsc: false,
|
|
70
77
|
closeOnOverlayClick: false,
|
|
71
78
|
position: positionMap[position],
|
|
72
79
|
alwaysOnTop: true,
|
|
73
|
-
component: (_jsx(NotificationManager, { ref:
|
|
80
|
+
component: (_jsx(NotificationManager, { ref: refCallback, position: position, onEmpty: () => this.destroy(position) })),
|
|
74
81
|
});
|
|
82
|
+
// Create a div to mount the Component
|
|
83
|
+
const div = document.createElement('div');
|
|
84
|
+
document.body.appendChild(div);
|
|
85
|
+
const root = createRoot(div);
|
|
75
86
|
this.containers.set(position, {
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
87
|
+
manager: null,
|
|
88
|
+
root,
|
|
89
|
+
div,
|
|
79
90
|
});
|
|
91
|
+
// Render the Component which will trigger the LayerManager's useEffect
|
|
80
92
|
flushSync(() => {
|
|
81
|
-
|
|
93
|
+
root.render(_jsx(Component, {}));
|
|
82
94
|
});
|
|
83
|
-
notification = ref;
|
|
84
95
|
}
|
|
85
|
-
|
|
86
|
-
|
|
96
|
+
const container = this.containers.get(position);
|
|
97
|
+
if (container && container.manager) {
|
|
98
|
+
return container.manager.add(options);
|
|
87
99
|
}
|
|
88
|
-
|
|
100
|
+
// If manager is not ready yet, wait a bit and retry
|
|
101
|
+
return new Promise((resolve) => {
|
|
102
|
+
setTimeout(() => {
|
|
103
|
+
const container = this.containers.get(position);
|
|
104
|
+
if (container && container.manager) {
|
|
105
|
+
resolve(container.manager.add(options));
|
|
106
|
+
}
|
|
107
|
+
}, 10);
|
|
108
|
+
});
|
|
89
109
|
};
|
|
90
110
|
/**
|
|
91
111
|
* Removes a notification
|
|
92
112
|
*
|
|
93
|
-
* @param position
|
|
94
|
-
* @param id
|
|
113
|
+
* @param position - The position of the notification container
|
|
114
|
+
* @param id - The unique ID of the notification to remove
|
|
95
115
|
*/
|
|
96
116
|
this.remove = (position, id) => {
|
|
97
|
-
|
|
98
|
-
|
|
117
|
+
const container = this.containers.get(position);
|
|
118
|
+
if (container && container.manager) {
|
|
119
|
+
container.manager.remove(id);
|
|
99
120
|
}
|
|
100
121
|
};
|
|
101
122
|
/**
|
|
102
|
-
* Destroys entire stack of notifications.
|
|
123
|
+
* Destroys entire stack of notifications at a position.
|
|
124
|
+
* Unmounts the React root and cleans up DOM elements.
|
|
103
125
|
*
|
|
104
|
-
* @param position
|
|
126
|
+
* @param position - The position of the notification container to destroy
|
|
105
127
|
*/
|
|
106
128
|
this.destroy = (position) => {
|
|
107
|
-
const
|
|
108
|
-
|
|
109
|
-
|
|
129
|
+
const container = this.containers.get(position);
|
|
130
|
+
if (container) {
|
|
131
|
+
container.root.unmount();
|
|
132
|
+
if (document.body.contains(container.div)) {
|
|
133
|
+
document.body.removeChild(container.div);
|
|
134
|
+
}
|
|
135
|
+
this.containers.delete(position);
|
|
136
|
+
}
|
|
110
137
|
};
|
|
111
138
|
}
|
|
112
139
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Notification.js","sourceRoot":"","sources":["../../../src/components/Notification/Notification.tsx"],"names":[],"mappings":";AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"Notification.js","sourceRoot":"","sources":["../../../src/components/Notification/Notification.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { type RefCallback } from 'react';\nimport PropTypes from 'prop-types';\nimport { flushSync } from 'react-dom';\nimport { createRoot, type Root } from 'react-dom/client';\nimport LayerManager, { LAYER_POSITION } from '../../shared/LayerManager';\nimport NotificationManager from './NotificationManager';\nimport { NOTIFICATION_POSITION, NOTIFICATION_TYPE, NotificationOptions } from './types';\n\ntype NotificationProps = PropTypes.InferProps<typeof StoryProps.propTypes>;\n\n/** This component is only used for storybook documentation */\nexport class StoryProps extends React.Component<NotificationProps> {\n static propTypes = {\n /** Title of the notification */\n title: PropTypes.string.isRequired,\n /** Body of the notification */\n description: PropTypes.string.isRequired,\n /** Id for the notification, helps in de-duplication. */\n id: PropTypes.string,\n /** Duration for the notification in milliseconds */\n duration: PropTypes.number,\n /** Creates sticky notification */\n sticky: PropTypes.bool,\n /** Type of notification */\n type: PropTypes.oneOf([\n NOTIFICATION_TYPE.INFO,\n NOTIFICATION_TYPE.SUCCESS,\n NOTIFICATION_TYPE.WARNING,\n NOTIFICATION_TYPE.DANGER,\n ]),\n /** Action button text */\n buttonText: PropTypes.string,\n /** Action button click callback */\n buttonClick: PropTypes.func,\n /** Notification close callback. */\n onClose: PropTypes.func,\n };\n\n static defaultProps = {\n duration: 5000,\n sticky: false,\n type: NOTIFICATION_TYPE.INFO,\n };\n\n render(): React.ReactNode {\n return null;\n }\n}\n\n/** Maps notification position to layer position */\nconst positionMap = {\n [NOTIFICATION_POSITION.TOP_LEFT]: LAYER_POSITION.TOP_LEFT,\n [NOTIFICATION_POSITION.TOP_RIGHT]: LAYER_POSITION.TOP_RIGHT,\n [NOTIFICATION_POSITION.BOTTOM_LEFT]: LAYER_POSITION.BOTTOM_LEFT,\n [NOTIFICATION_POSITION.BOTTOM_RIGHT]: LAYER_POSITION.BOTTOM_RIGHT,\n};\n\n/** Notification class */\nclass Notification {\n /** Helps in maintaining single instance for different positions. */\n private containers: Map<\n NOTIFICATION_POSITION,\n {\n manager: NotificationManager | null;\n root: Root;\n div: HTMLDivElement;\n }\n > = new Map();\n\n /**\n * Adds a notification\n *\n * @param position - The position where the notification should appear\n * @param options - Configuration options for the notification\n * @returns The notification ID or a promise that resolves to the notification ID\n */\n public add = (position: NOTIFICATION_POSITION, options: NotificationOptions) => {\n if (!this.containers.has(position)) {\n /** Callback ref to capture the NotificationManager instance when it mounts */\n const refCallback: RefCallback<NotificationManager> = (instance) => {\n if (instance) {\n const container = this.containers.get(position);\n if (container) {\n container.manager = instance;\n }\n }\n };\n\n const [Component] = LayerManager.renderLayer({\n closeOnEsc: false,\n closeOnOverlayClick: false,\n position: positionMap[position],\n alwaysOnTop: true,\n component: (\n <NotificationManager\n ref={refCallback}\n position={position}\n onEmpty={() => this.destroy(position)}\n />\n ),\n });\n\n // Create a div to mount the Component\n const div = document.createElement('div');\n document.body.appendChild(div);\n const root = createRoot(div);\n\n this.containers.set(position, {\n manager: null,\n root,\n div,\n });\n\n // Render the Component which will trigger the LayerManager's useEffect\n flushSync(() => {\n root.render(<Component />);\n });\n }\n\n const container = this.containers.get(position);\n if (container && container.manager) {\n return container.manager.add(options);\n }\n\n // If manager is not ready yet, wait a bit and retry\n return new Promise((resolve) => {\n setTimeout(() => {\n const container = this.containers.get(position);\n if (container && container.manager) {\n resolve(container.manager.add(options));\n }\n }, 10);\n });\n };\n\n /**\n * Removes a notification\n *\n * @param position - The position of the notification container\n * @param id - The unique ID of the notification to remove\n */\n public remove = (position: NOTIFICATION_POSITION, id: string) => {\n const container = this.containers.get(position);\n if (container && container.manager) {\n container.manager.remove(id);\n }\n };\n\n /**\n * Destroys entire stack of notifications at a position.\n * Unmounts the React root and cleans up DOM elements.\n *\n * @param position - The position of the notification container to destroy\n */\n public destroy = (position: NOTIFICATION_POSITION) => {\n const container = this.containers.get(position);\n if (container) {\n container.root.unmount();\n if (document.body.contains(container.div)) {\n document.body.removeChild(container.div);\n }\n this.containers.delete(position);\n }\n };\n}\n\n/** Export a singleton instance */\nexport default new Notification();\n"]}
|
|
@@ -1,25 +1,25 @@
|
|
|
1
1
|
export default {
|
|
2
|
-
PRIMARY: '#
|
|
2
|
+
PRIMARY: '#1f7ac5',
|
|
3
3
|
PRIMARY_LIGHT: '#64baff',
|
|
4
4
|
PRIMARY_LIGHTER: '#cfe9ff',
|
|
5
5
|
BACKDROP_COLOR: '#2681da80',
|
|
6
|
-
INFO: '#
|
|
6
|
+
INFO: '#1d6eaf',
|
|
7
7
|
INFO_LIGHT: '#64baff',
|
|
8
|
-
SUCCESS: '#
|
|
8
|
+
SUCCESS: '#1a835f',
|
|
9
9
|
SUCCESS_LIGHT: '#80eac6',
|
|
10
|
-
WARNING: '#
|
|
10
|
+
WARNING: '#916b01',
|
|
11
11
|
WARNING_LIGHT: '#ffba00',
|
|
12
|
-
ERROR: '#
|
|
12
|
+
ERROR: '#bb2828',
|
|
13
13
|
ERROR_LIGHT: '#f1a5a5',
|
|
14
14
|
BORDER_COLOR: '#555555',
|
|
15
15
|
TOAST: '#5f5f5f',
|
|
16
|
-
TOOLTIP_COLOR: 'rgba(0,0,0,0.
|
|
16
|
+
TOOLTIP_COLOR: 'rgba(0,0,0,0.6)',
|
|
17
17
|
BORDER_LIGHT_COLOR: '#eeeeee',
|
|
18
18
|
BACKGROUND: '#ffffff',
|
|
19
19
|
DISABLED_BACKGROUND: '#fafafa',
|
|
20
20
|
DISABLED_BORDER: '#aaa',
|
|
21
21
|
LIGHT_GREY: '#ccc',
|
|
22
|
-
DISABLED: '#
|
|
22
|
+
DISABLED: '#737373',
|
|
23
23
|
SHADOW: '0px 1px 3px 0px rgba(0,0,0,0.1), 0px 1px 2px 0px rgba(0,0,0,0.06)',
|
|
24
24
|
HOVER_SHADOW: '0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)',
|
|
25
25
|
MODAL_SHADOW: '0px 8px 17px 2px rgba(0,0,0,0.14), 0px 3px 14px 2px rgba(0,0,0,0.12), 0px 5px 5px -3px rgba(0,0,0,0.2)',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../src/shared/constants.ts"],"names":[],"mappings":"AAAA,eAAe;IACX,OAAO,EAAE,SAAS;IAClB,aAAa,EAAE,SAAS;IACxB,eAAe,EAAE,SAAS;IAC1B,cAAc,EAAE,WAAW;IAC3B,IAAI,EAAE,SAAS;IACf,UAAU,EAAE,SAAS;IACrB,OAAO,EAAE,SAAS;IAClB,aAAa,EAAE,SAAS;IACxB,OAAO,EAAE,SAAS;IAClB,aAAa,EAAE,SAAS;IACxB,KAAK,EAAE,SAAS;IAChB,WAAW,EAAE,SAAS;IACtB,YAAY,EAAE,SAAS;IACvB,KAAK,EAAE,SAAS;IAChB,aAAa,EAAE,iBAAiB;IAChC,kBAAkB,EAAE,SAAS;IAC7B,UAAU,EAAE,SAAS;IACrB,mBAAmB,EAAE,SAAS;IAC9B,eAAe,EAAE,MAAM;IACvB,UAAU,EAAE,MAAM;IAClB,QAAQ,EAAE,
|
|
1
|
+
{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../src/shared/constants.ts"],"names":[],"mappings":"AAAA,eAAe;IACX,OAAO,EAAE,SAAS;IAClB,aAAa,EAAE,SAAS;IACxB,eAAe,EAAE,SAAS;IAC1B,cAAc,EAAE,WAAW;IAC3B,IAAI,EAAE,SAAS;IACf,UAAU,EAAE,SAAS;IACrB,OAAO,EAAE,SAAS;IAClB,aAAa,EAAE,SAAS;IACxB,OAAO,EAAE,SAAS;IAClB,aAAa,EAAE,SAAS;IACxB,KAAK,EAAE,SAAS;IAChB,WAAW,EAAE,SAAS;IACtB,YAAY,EAAE,SAAS;IACvB,KAAK,EAAE,SAAS;IAChB,aAAa,EAAE,iBAAiB;IAChC,kBAAkB,EAAE,SAAS;IAC7B,UAAU,EAAE,SAAS;IACrB,mBAAmB,EAAE,SAAS;IAC9B,eAAe,EAAE,MAAM;IACvB,UAAU,EAAE,MAAM;IAClB,QAAQ,EAAE,SAAS;IACnB,MAAM,EAAE,mEAAmE;IAC3E,YAAY,EAAE,uEAAuE;IACrF,YAAY,EACR,wGAAwG;CAC/G,CAAC","sourcesContent":["export default {\n PRIMARY: '#1f7ac5',\n PRIMARY_LIGHT: '#64baff',\n PRIMARY_LIGHTER: '#cfe9ff',\n BACKDROP_COLOR: '#2681da80',\n INFO: '#1d6eaf',\n INFO_LIGHT: '#64baff',\n SUCCESS: '#1a835f',\n SUCCESS_LIGHT: '#80eac6',\n WARNING: '#916b01',\n WARNING_LIGHT: '#ffba00',\n ERROR: '#bb2828',\n ERROR_LIGHT: '#f1a5a5',\n BORDER_COLOR: '#555555',\n TOAST: '#5f5f5f',\n TOOLTIP_COLOR: 'rgba(0,0,0,0.6)',\n BORDER_LIGHT_COLOR: '#eeeeee',\n BACKGROUND: '#ffffff',\n DISABLED_BACKGROUND: '#fafafa',\n DISABLED_BORDER: '#aaa',\n LIGHT_GREY: '#ccc',\n DISABLED: '#737373',\n SHADOW: '0px 1px 3px 0px rgba(0,0,0,0.1), 0px 1px 2px 0px rgba(0,0,0,0.06)',\n HOVER_SHADOW: '0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)',\n MODAL_SHADOW:\n '0px 8px 17px 2px rgba(0,0,0,0.14), 0px 3px 14px 2px rgba(0,0,0,0.12), 0px 5px 5px -3px rgba(0,0,0,0.2)',\n};\n"]}
|