@popsure/dirty-swan 0.33.0 → 0.33.2
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/cjs/index.js +71 -67
- package/dist/cjs/index.js.map +1 -1
- package/dist/esm/App.d.ts +3 -0
- package/dist/esm/_commonjsHelpers-e7f67fd8.js +23 -0
- package/dist/esm/_commonjsHelpers-e7f67fd8.js.map +1 -0
- package/dist/esm/components/autocompleteAddress/index.js +2062 -0
- package/dist/esm/components/autocompleteAddress/index.js.map +1 -0
- package/dist/esm/components/autocompleteAddress/index.stories.js +110 -0
- package/dist/esm/components/autocompleteAddress/index.stories.js.map +1 -0
- package/dist/esm/components/autocompleteAddress/index.test.js +115 -0
- package/dist/esm/components/autocompleteAddress/index.test.js.map +1 -0
- package/dist/esm/components/button/index.js +26 -0
- package/dist/esm/components/button/index.js.map +1 -0
- package/dist/esm/components/cards/cardButton/index.js +6 -0
- package/dist/esm/components/cards/cardButton/index.js.map +1 -0
- package/dist/esm/components/cards/cardWithLeftIcon/index.js +7 -0
- package/dist/esm/components/cards/cardWithLeftIcon/index.js.map +1 -0
- package/dist/esm/components/cards/cardWithTopIcon/index.js +7 -0
- package/dist/esm/components/cards/cardWithTopIcon/index.js.map +1 -0
- package/dist/esm/components/cards/cardWithTopLeftIcon/index.js +7 -0
- package/dist/esm/components/cards/cardWithTopLeftIcon/index.js.map +1 -0
- package/dist/esm/components/cards/index.js +125 -0
- package/dist/esm/components/cards/index.js.map +1 -0
- package/dist/esm/components/cards/infoCard/index.js +7 -0
- package/dist/esm/components/cards/infoCard/index.js.map +1 -0
- package/dist/esm/components/chip/index.js +22 -0
- package/dist/esm/components/chip/index.js.map +1 -0
- package/dist/esm/components/comparisonTable/components/AccordionItem/AccordionItem.js +32 -0
- package/dist/esm/components/comparisonTable/components/AccordionItem/AccordionItem.js.map +1 -0
- package/dist/esm/components/comparisonTable/components/AccordionItem/index.js +8 -0
- package/dist/esm/components/comparisonTable/components/AccordionItem/index.js.map +1 -0
- package/dist/esm/components/comparisonTable/components/Chevron.js +10 -0
- package/dist/esm/components/comparisonTable/components/Chevron.js.map +1 -0
- package/dist/esm/components/comparisonTable/components/Row/index.js +36 -0
- package/dist/esm/components/comparisonTable/components/Row/index.js.map +1 -0
- package/dist/esm/components/comparisonTable/components/TableArrows/Arrow.js +10 -0
- package/dist/esm/components/comparisonTable/components/TableArrows/Arrow.js.map +1 -0
- package/dist/esm/components/comparisonTable/components/TableArrows/index.js +24 -0
- package/dist/esm/components/comparisonTable/components/TableArrows/index.js.map +1 -0
- package/dist/esm/components/comparisonTable/components/TableButton/index.js +15 -0
- package/dist/esm/components/comparisonTable/components/TableButton/index.js.map +1 -0
- package/dist/esm/components/comparisonTable/components/TableButton/index.test.js +37 -0
- package/dist/esm/components/comparisonTable/components/TableButton/index.test.js.map +1 -0
- package/dist/esm/components/comparisonTable/components/TableInfoButton/index.js +22 -0
- package/dist/esm/components/comparisonTable/components/TableInfoButton/index.js.map +1 -0
- package/dist/esm/components/comparisonTable/components/TableRating/StarIcon.js +10 -0
- package/dist/esm/components/comparisonTable/components/TableRating/StarIcon.js.map +1 -0
- package/dist/esm/components/comparisonTable/components/TableRating/ZapIcon.js +10 -0
- package/dist/esm/components/comparisonTable/components/TableRating/ZapIcon.js.map +1 -0
- package/dist/esm/components/comparisonTable/components/TableRating/index.js +27 -0
- package/dist/esm/components/comparisonTable/components/TableRating/index.js.map +1 -0
- package/dist/esm/components/comparisonTable/components/TableRowHeader/index.js +18 -0
- package/dist/esm/components/comparisonTable/components/TableRowHeader/index.js.map +1 -0
- package/dist/esm/components/comparisonTable/components/TableRowHeader/index.test.js +82 -0
- package/dist/esm/components/comparisonTable/components/TableRowHeader/index.test.js.map +1 -0
- package/dist/esm/components/comparisonTable/components/TableTrueFalse.js +13 -0
- package/dist/esm/components/comparisonTable/components/TableTrueFalse.js.map +1 -0
- package/dist/esm/components/comparisonTable/index.js +1683 -0
- package/dist/esm/components/comparisonTable/index.js.map +1 -0
- package/dist/esm/components/dateSelector/index.js +2180 -0
- package/dist/esm/components/dateSelector/index.js.map +1 -0
- package/dist/esm/components/dateSelector/index.test.js +65 -0
- package/dist/esm/components/dateSelector/index.test.js.map +1 -0
- package/dist/esm/components/downloadButton/index.js +36 -0
- package/dist/esm/components/downloadButton/index.js.map +1 -0
- package/dist/esm/components/downloadButton/index.stories.js +47 -0
- package/dist/esm/components/downloadButton/index.stories.js.map +1 -0
- package/dist/esm/components/input/autoSuggestInput/index.js +2157 -0
- package/dist/esm/components/input/autoSuggestInput/index.js.map +1 -0
- package/dist/esm/components/input/autoSuggestMultiSelect/index.js +41 -0
- package/dist/esm/components/input/autoSuggestMultiSelect/index.js.map +1 -0
- package/dist/esm/components/input/checkbox/index.js +58 -0
- package/dist/esm/components/input/checkbox/index.js.map +1 -0
- package/dist/esm/components/input/checkbox/index.stories.js +154 -0
- package/dist/esm/components/input/checkbox/index.stories.js.map +1 -0
- package/dist/esm/components/input/checkbox/index.test.js +106 -0
- package/dist/esm/components/input/checkbox/index.test.js.map +1 -0
- package/dist/esm/components/input/currency/index.js +63 -0
- package/dist/esm/components/input/currency/index.js.map +1 -0
- package/dist/esm/components/input/currency/index.test.js +209 -0
- package/dist/esm/components/input/currency/index.test.js.map +1 -0
- package/dist/esm/components/input/iban/index.js +33 -0
- package/dist/esm/components/input/iban/index.js.map +1 -0
- package/dist/esm/components/input/index.js +29 -0
- package/dist/esm/components/input/index.js.map +1 -0
- package/dist/esm/components/markdown/index.js +22178 -0
- package/dist/esm/components/markdown/index.js.map +1 -0
- package/dist/esm/components/markdown/index.stories.js +66 -0
- package/dist/esm/components/markdown/index.stories.js.map +1 -0
- package/dist/esm/components/modal/bottomModal/index.js +35 -0
- package/dist/esm/components/modal/bottomModal/index.js.map +1 -0
- package/dist/esm/components/modal/bottomOrRegularModal/index.js +36 -0
- package/dist/esm/components/modal/bottomOrRegularModal/index.js.map +1 -0
- package/dist/esm/components/modal/regularModal/index.js +28 -0
- package/dist/esm/components/modal/regularModal/index.js.map +1 -0
- package/dist/esm/components/multiDropzone/UploadFileCell/index.js +6 -0
- package/dist/esm/components/multiDropzone/UploadFileCell/index.js.map +1 -0
- package/dist/esm/components/multiDropzone/index.js +2862 -0
- package/dist/esm/components/multiDropzone/index.js.map +1 -0
- package/dist/esm/components/multiDropzone/index.test.js +201 -0
- package/dist/esm/components/multiDropzone/index.test.js.map +1 -0
- package/dist/esm/components/segmentedControl/index.js +42 -0
- package/dist/esm/components/segmentedControl/index.js.map +1 -0
- package/dist/esm/components/segmentedControl/index.stories.js +62 -0
- package/dist/esm/components/segmentedControl/index.stories.js.map +1 -0
- package/dist/esm/components/segmentedControl/index.test.js +63 -0
- package/dist/esm/components/segmentedControl/index.test.js.map +1 -0
- package/dist/esm/components/signaturePad/index.js +560 -0
- package/dist/esm/components/signaturePad/index.js.map +1 -0
- package/dist/esm/components/signaturePad/index.stories.js +33 -0
- package/dist/esm/components/signaturePad/index.stories.js.map +1 -0
- package/dist/esm/customRender-4157fcff.js +24102 -0
- package/dist/esm/customRender-4157fcff.js.map +1 -0
- package/dist/esm/extend-expect-46bdce4a.js +7406 -0
- package/dist/esm/extend-expect-46bdce4a.js.map +1 -0
- package/dist/esm/index-1463d5e9.js +382 -0
- package/dist/esm/index-1463d5e9.js.map +1 -0
- package/dist/esm/index-171a0108.js +997 -0
- package/dist/esm/index-171a0108.js.map +1 -0
- package/dist/esm/index-21239ab0.js +237 -0
- package/dist/esm/index-21239ab0.js.map +1 -0
- package/dist/esm/index-47663d39.js +48 -0
- package/dist/esm/index-47663d39.js.map +1 -0
- package/dist/esm/index-6ced5532.js +69 -0
- package/dist/esm/index-6ced5532.js.map +1 -0
- package/dist/esm/index-db2e797f.js +13 -0
- package/dist/esm/index-db2e797f.js.map +1 -0
- package/dist/esm/index-dd80248b.js +91 -0
- package/dist/esm/index-dd80248b.js.map +1 -0
- package/dist/esm/index-e9e37a34.js +62 -0
- package/dist/esm/index-e9e37a34.js.map +1 -0
- package/dist/esm/index-fb46adf9.js +12 -0
- package/dist/esm/index-fb46adf9.js.map +1 -0
- package/dist/esm/index.d.ts +2 -0
- package/dist/esm/index.js +50 -0
- package/dist/esm/index.js.map +1 -0
- package/dist/esm/lib/components/autocompleteAddress/index.d.ts +20 -0
- package/dist/esm/lib/components/autocompleteAddress/index.stories.d.ts +66 -0
- package/dist/esm/lib/components/autocompleteAddress/index.test.d.ts +1 -0
- package/dist/esm/lib/components/autocompleteAddress/mapStyle.d.ts +2 -0
- package/dist/esm/lib/components/autocompleteAddress/util/index.d.ts +4 -0
- package/dist/esm/lib/components/button/icons/index.d.ts +9 -0
- package/dist/esm/lib/components/button/index.d.ts +13 -0
- package/dist/esm/lib/components/cards/cardButton/index.d.ts +16 -0
- package/dist/esm/lib/components/cards/cardWithLeftIcon/index.d.ts +14 -0
- package/dist/esm/lib/components/cards/cardWithTopIcon/index.d.ts +15 -0
- package/dist/esm/lib/components/cards/cardWithTopLeftIcon/index.d.ts +14 -0
- package/dist/esm/lib/components/cards/icons/index.d.ts +13 -0
- package/dist/esm/lib/components/cards/index.d.ts +16 -0
- package/dist/esm/lib/components/cards/infoCard/index.d.ts +13 -0
- package/dist/esm/lib/components/chip/index.d.ts +6 -0
- package/dist/esm/lib/components/comparisonTable/components/AccordionItem/AccordionItem.d.ts +9 -0
- package/dist/esm/lib/components/comparisonTable/components/AccordionItem/index.d.ts +1 -0
- package/dist/esm/lib/components/comparisonTable/components/Chevron.d.ts +4 -0
- package/dist/esm/lib/components/comparisonTable/components/Row/index.d.ts +11 -0
- package/dist/esm/lib/components/comparisonTable/components/TableArrows/Arrow.d.ts +4 -0
- package/dist/esm/lib/components/comparisonTable/components/TableArrows/index.d.ts +10 -0
- package/dist/esm/lib/components/comparisonTable/components/TableButton/index.d.ts +8 -0
- package/dist/esm/lib/components/comparisonTable/components/TableButton/index.test.d.ts +1 -0
- package/dist/esm/lib/components/comparisonTable/components/TableInfoButton/index.d.ts +5 -0
- package/dist/esm/lib/components/comparisonTable/components/TableRating/StarIcon.d.ts +4 -0
- package/dist/esm/lib/components/comparisonTable/components/TableRating/ZapIcon.d.ts +4 -0
- package/dist/esm/lib/components/comparisonTable/components/TableRating/index.d.ts +7 -0
- package/dist/esm/lib/components/comparisonTable/components/TableRowHeader/index.d.ts +9 -0
- package/dist/esm/lib/components/comparisonTable/components/TableRowHeader/index.test.d.ts +1 -0
- package/dist/esm/lib/components/comparisonTable/components/TableTrueFalse.d.ts +5 -0
- package/dist/esm/lib/components/comparisonTable/hooks/useComparisonTable.d.ts +14 -0
- package/dist/esm/lib/components/comparisonTable/index.d.ts +52 -0
- package/dist/esm/lib/components/dateSelector/index.d.ts +23 -0
- package/dist/esm/lib/components/dateSelector/index.test.d.ts +1 -0
- package/dist/esm/lib/components/downloadButton/index.d.ts +10 -0
- package/dist/esm/lib/components/downloadButton/index.stories.d.ts +36 -0
- package/dist/esm/lib/components/input/autoSuggestInput/index.d.ts +15 -0
- package/dist/esm/lib/components/input/autoSuggestMultiSelect/index.d.ts +11 -0
- package/dist/esm/lib/components/input/checkbox/index.d.ts +17 -0
- package/dist/esm/lib/components/input/checkbox/index.stories.d.ts +64 -0
- package/dist/esm/lib/components/input/checkbox/index.test.d.ts +1 -0
- package/dist/esm/lib/components/input/currency/format/index.d.ts +2 -0
- package/dist/esm/lib/components/input/currency/index.d.ts +7 -0
- package/dist/esm/lib/components/input/currency/index.test.d.ts +1 -0
- package/dist/esm/lib/components/input/iban/formatIban/index.d.ts +1 -0
- package/dist/esm/lib/components/input/iban/index.d.ts +6 -0
- package/dist/esm/lib/components/input/index.d.ts +16 -0
- package/dist/esm/lib/components/markdown/index.d.ts +10 -0
- package/dist/esm/lib/components/markdown/index.stories.d.ts +44 -0
- package/dist/esm/lib/components/modal/bottomModal/index.d.ts +3 -0
- package/dist/esm/lib/components/modal/bottomOrRegularModal/index.d.ts +3 -0
- package/dist/esm/lib/components/modal/hooks/useOnClose.d.ts +9 -0
- package/dist/esm/lib/components/modal/index.d.ts +13 -0
- package/dist/esm/lib/components/modal/regularModal/index.d.ts +3 -0
- package/dist/esm/lib/components/multiDropzone/UploadFileCell/index.d.ts +10 -0
- package/dist/esm/lib/components/multiDropzone/icons/index.d.ts +11 -0
- package/dist/esm/lib/components/multiDropzone/index.d.ts +15 -0
- package/dist/esm/lib/components/multiDropzone/index.test.d.ts +1 -0
- package/dist/esm/lib/components/multiDropzone/types.d.ts +42 -0
- package/dist/esm/lib/components/multiDropzone/utils/index.d.ts +11 -0
- package/dist/esm/lib/components/segmentedControl/index.d.ts +12 -0
- package/dist/esm/lib/components/segmentedControl/index.stories.d.ts +37 -0
- package/dist/esm/lib/components/segmentedControl/index.test.d.ts +1 -0
- package/dist/esm/lib/components/signaturePad/index.d.ts +19 -0
- package/dist/esm/lib/components/signaturePad/index.stories.d.ts +21 -0
- package/dist/esm/lib/hooks/useOnClickOutside.d.ts +2 -0
- package/dist/esm/lib/index.d.ts +22 -0
- package/dist/esm/lib/models/autoSuggestInput/index.d.ts +4 -0
- package/dist/esm/lib/models/download.d.ts +1 -0
- package/dist/esm/lib/scss/private/base/demo.d.ts +5 -0
- package/dist/esm/lib/scss/public/demo.d.ts +2 -0
- package/dist/esm/lib/util/calendarDate/index.d.ts +3 -0
- package/dist/esm/lib/util/formatBytes/index.d.ts +1 -0
- package/dist/esm/lib/util/generateId/index.d.ts +2 -0
- package/dist/esm/lib/util/images/index.d.ts +11 -0
- package/dist/esm/lib/util/images/index.stories.d.ts +12 -0
- package/dist/esm/lib/util/testUtils/customRender.d.ts +7 -0
- package/dist/esm/lib/util/testUtils/index.d.ts +2 -0
- package/dist/esm/lib/util/zeroFill.d.ts +1 -0
- package/dist/esm/mapStyle-1288a869.js +187 -0
- package/dist/esm/mapStyle-1288a869.js.map +1 -0
- package/dist/esm/scss/private/base/demo.js +80 -0
- package/dist/esm/scss/private/base/demo.js.map +1 -0
- package/dist/esm/scss/public/demo.js +290 -0
- package/dist/esm/scss/public/demo.js.map +1 -0
- package/dist/esm/style-inject.es-1f59c1d0.js +29 -0
- package/dist/esm/style-inject.es-1f59c1d0.js.map +1 -0
- package/dist/esm/tslib.es6-5bc94358.js +104 -0
- package/dist/esm/tslib.es6-5bc94358.js.map +1 -0
- package/dist/esm/useOnClose-d818a54f.js +46 -0
- package/dist/esm/useOnClose-d818a54f.js.map +1 -0
- package/dist/esm/util/images/index.stories.js +23 -0
- package/dist/esm/util/images/index.stories.js.map +1 -0
- package/dist/esm/util/testUtils/customRender.js +7 -0
- package/dist/esm/util/testUtils/customRender.js.map +1 -0
- package/package.json +1 -1
- package/src/lib/components/input/checkbox/index.tsx +2 -1
- package/src/lib/components/input/checkbox/styles.module.scss +3 -0
- package/src/lib/components/markdown/index.stories.tsx +64 -2
- package/src/global.d.ts +0 -1
- package/src/lib/components/markdown/example.md +0 -78
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
import { _ as __assign } from '../../tslib.es6-5bc94358.js';
|
|
2
|
+
import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
|
|
3
|
+
import { Markdown } from './index.js';
|
|
4
|
+
import '../../style-inject.es-1f59c1d0.js';
|
|
5
|
+
import 'react';
|
|
6
|
+
import '../../index-171a0108.js';
|
|
7
|
+
import '../../index-dd80248b.js';
|
|
8
|
+
import '../../_commonjsHelpers-e7f67fd8.js';
|
|
9
|
+
import 'path';
|
|
10
|
+
import 'querystring';
|
|
11
|
+
|
|
12
|
+
var story = {
|
|
13
|
+
title: 'JSX/Markdown',
|
|
14
|
+
component: Markdown,
|
|
15
|
+
argTypes: {
|
|
16
|
+
children: {
|
|
17
|
+
description: 'MD content to be rendered in the component.',
|
|
18
|
+
},
|
|
19
|
+
className: {
|
|
20
|
+
defaultValue: '',
|
|
21
|
+
description: 'This property allows to add custom styles to the component.',
|
|
22
|
+
},
|
|
23
|
+
customMDComponents: {
|
|
24
|
+
defaultValue: {},
|
|
25
|
+
description: 'An object that allows creating custom MD components by passing the key to wrap it in, and the logic to render, as a function that returns an HTMLElement.',
|
|
26
|
+
table: {
|
|
27
|
+
type: {
|
|
28
|
+
summary: 'Record<componentKey, (props: HTMLElmentAttributes) => HTMLElement>'
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
},
|
|
32
|
+
paragraphClassName: {
|
|
33
|
+
defaultValue: '',
|
|
34
|
+
description: 'This property allows to add custom styles to the paragraph (`<p>`) component rendered inside Markdown component.',
|
|
35
|
+
},
|
|
36
|
+
openLinksInNewTab: {
|
|
37
|
+
defaultValue: false,
|
|
38
|
+
description: 'Wether link components rendered inside Markdown should open in a new tab (`target="_blank"`).',
|
|
39
|
+
}
|
|
40
|
+
},
|
|
41
|
+
args: {
|
|
42
|
+
children: '## Title \n This is **our content**.'
|
|
43
|
+
},
|
|
44
|
+
parameters: {
|
|
45
|
+
componentSubtitle: (jsxs(Fragment, { children: ["Display markdown text based on ", jsx("a", __assign({ href: "https://github.com/remarkjs/react-markdown", target: '_blank', rel: "noreferrer" }, { children: "react-markdown" }), void 0), " with custom styling."] }, void 0)),
|
|
46
|
+
},
|
|
47
|
+
};
|
|
48
|
+
var MarkdownStory = function (_a) {
|
|
49
|
+
var children = _a.children, className = _a.className;
|
|
50
|
+
return (jsx(Markdown, __assign({ className: className }, { children: children }), void 0));
|
|
51
|
+
};
|
|
52
|
+
MarkdownStory.storyName = "Markdown";
|
|
53
|
+
var AvailableMDComponents = function (_a) {
|
|
54
|
+
var className = _a.className;
|
|
55
|
+
return (jsx(Markdown, __assign({ className: className }, { children: "# Headers\nThe header options range from h1 to h4.\n\n```\n# H1\n## H2\n### H3\n#### H4\n```\n\n# H1 Lorem ipsum non sunt qui sunt\n\n## H2 Lorem ipsum non sunt qui sunt\n\n### H3 Lorem ipsum non sunt qui sunt\n\n#### H4 Lorem ipsum non sunt qui sunt\n\n# Emphasis\n\n```\nEmphasis or italics, use *asterisk* or _underscore_.\nStrong emphasis or bold, use **asterisks** or __underscores__.\nCombined emphasis, use **_asterisks and underscores_**.\n```\n\nEmphasis or italics, use _asterisk_ or _underscore_.\n\nStrong emphasis or bold, use **asterisks** or **underscores**.\n\nCombined emphasis, use **_asterisks and underscores_**.\n\n# Lists\n\n```\n1. First ordered list item\n2. Another item\n3. Actual numbers don't matter, just that it's a number\n4. And another item.\n\n* Unordered list can use asterisks\n- Or minuses\n+ Or pluses\n```\n\n1. First ordered list item\n2. Another item\n3. Actual numbers don't matter, just that it's a number\n4. And another item.\n\n- Unordered list can use asterisks\n- Or minuses\n- Or pluses\n\n# Links\n\nFor links markdown syntax should be used.\n\n```\n[This is an inline link](https://feather-insurance.com)\n```\n\n[This is an inline link](https://feather-insurance.com)\n" }), void 0));
|
|
56
|
+
};
|
|
57
|
+
var AddingCustomComponents = function (_a) {
|
|
58
|
+
_a.className;
|
|
59
|
+
return (jsx(Markdown, __assign({ customMDComponents: {
|
|
60
|
+
h6: function (props) { return (jsx("h6", __assign({ className: 'tc-red-500' }, { children: props.children }), void 0)); }
|
|
61
|
+
} }, { children: "###### This is a custom H6 that will always be red" }), void 0));
|
|
62
|
+
};
|
|
63
|
+
|
|
64
|
+
export default story;
|
|
65
|
+
export { AddingCustomComponents, AvailableMDComponents, MarkdownStory };
|
|
66
|
+
//# sourceMappingURL=index.stories.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.stories.js","sources":["../../../../../src/lib/components/markdown/index.stories.tsx"],"sourcesContent":["import { Markdown, MarkdownProps } from '.';\n\nconst story = {\n title: 'JSX/Markdown',\n component: Markdown,\n argTypes: {\n children: {\n description: 'MD content to be rendered in the component.',\n },\n className: {\n defaultValue: '',\n description: 'This property allows to add custom styles to the component.',\n },\n customMDComponents: {\n defaultValue: {},\n description: 'An object that allows creating custom MD components by passing the key to wrap it in, and the logic to render, as a function that returns an HTMLElement.',\n table: {\n type: {\n summary: 'Record<componentKey, (props: HTMLElmentAttributes) => HTMLElement>'\n }\n }\n },\n paragraphClassName: {\n defaultValue: '',\n description: 'This property allows to add custom styles to the paragraph (`<p>`) component rendered inside Markdown component.',\n },\n openLinksInNewTab: {\n defaultValue: false,\n description: 'Wether link components rendered inside Markdown should open in a new tab (`target=\"_blank\"`).',\n }\n },\n args: {\n children: '## Title \\n This is **our content**.'\n },\n parameters: {\n componentSubtitle: (\n <>\n Display markdown text based on <a href=\"https://github.com/remarkjs/react-markdown\" target='_blank' rel=\"noreferrer\">react-markdown</a> with custom styling.\n </>\n ),\n },\n};\n\nexport const MarkdownStory = ({ children, className }: MarkdownProps) => (\n <Markdown className={className}>\n {children}\n </Markdown>\n);\n\nMarkdownStory.storyName = \"Markdown\";\n\nexport const AvailableMDComponents = ({ className }: MarkdownProps) => (\n <Markdown className={className}>\n {`# Headers\nThe header options range from h1 to h4.\n\n\\`\\`\\`\n# H1\n## H2\n### H3\n#### H4\n\\`\\`\\`\n\n# H1 Lorem ipsum non sunt qui sunt\n\n## H2 Lorem ipsum non sunt qui sunt\n\n### H3 Lorem ipsum non sunt qui sunt\n\n#### H4 Lorem ipsum non sunt qui sunt\n\n# Emphasis\n\n\\`\\`\\`\nEmphasis or italics, use *asterisk* or _underscore_.\nStrong emphasis or bold, use **asterisks** or __underscores__.\nCombined emphasis, use **_asterisks and underscores_**.\n\\`\\`\\`\n\nEmphasis or italics, use _asterisk_ or _underscore_.\n\nStrong emphasis or bold, use **asterisks** or **underscores**.\n\nCombined emphasis, use **_asterisks and underscores_**.\n\n# Lists\n\n\\`\\`\\`\n1. First ordered list item\n2. Another item\n3. Actual numbers don't matter, just that it's a number\n4. And another item.\n\n* Unordered list can use asterisks\n- Or minuses\n+ Or pluses\n\\`\\`\\`\n\n1. First ordered list item\n2. Another item\n3. Actual numbers don't matter, just that it's a number\n4. And another item.\n\n- Unordered list can use asterisks\n- Or minuses\n- Or pluses\n\n# Links\n\nFor links markdown syntax should be used.\n\n\\`\\`\\`\n[This is an inline link](https://feather-insurance.com)\n\\`\\`\\`\n\n[This is an inline link](https://feather-insurance.com)\n`}\n </Markdown>\n);\n\nexport const AddingCustomComponents = ({ className }: MarkdownProps) => (\n <Markdown customMDComponents={{\n h6: (props: any) => (\n <h6 className='tc-red-500'>{props.children}</h6>\n )\n }}>\n ###### This is a custom H6 that will always be red\n </Markdown>\n);\n\nexport default story;\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;;;;IAEM,KAAK,GAAG;IACZ,KAAK,EAAE,cAAc;IACrB,SAAS,EAAE,QAAQ;IACnB,QAAQ,EAAE;QACR,QAAQ,EAAE;YACR,WAAW,EAAE,6CAA6C;SAC3D;QACD,SAAS,EAAE;YACT,YAAY,EAAE,EAAE;YAChB,WAAW,EAAE,6DAA6D;SAC3E;QACD,kBAAkB,EAAE;YAClB,YAAY,EAAE,EAAE;YAChB,WAAW,EAAE,2JAA2J;YACxK,KAAK,EAAE;gBACL,IAAI,EAAE;oBACF,OAAO,EAAE,oEAAoE;iBAChF;aACF;SACF;QACD,kBAAkB,EAAE;YAClB,YAAY,EAAE,EAAE;YAChB,WAAW,EAAE,kHAAkH;SAChI;QACD,iBAAiB,EAAE;YACjB,YAAY,EAAE,KAAK;YACnB,WAAW,EAAE,+FAA+F;SAC7G;KACF;IACD,IAAI,EAAE;QACJ,QAAQ,EAAE,sCAAsC;KACjD;IACD,UAAU,EAAE;QACV,iBAAiB,GACfA,+DACiCC,oBAAG,IAAI,EAAC,4CAA4C,EAAC,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,YAAY,4CAAmB,qCACtI,CACJ;KACF;EACD;IAEW,aAAa,GAAG,UAAC,EAAsC;QAApC,QAAQ,cAAA,EAAE,SAAS,eAAA;IAAsB,QACvEA,IAAC,QAAQ,aAAC,SAAS,EAAE,SAAS,gBAC3B,QAAQ,YACA;AAH4D,EAIvE;AAEF,aAAa,CAAC,SAAS,GAAG,UAAU,CAAC;IAExB,qBAAqB,GAAG,UAAC,EAA4B;QAA1B,SAAS,eAAA;IAAsB,QACrEA,IAAC,QAAQ,aAAC,SAAS,EAAE,SAAS,gBAC3B,usCA+DJ,YACY;AAlE0D,EAmErE;IAEW,sBAAsB,GAAG,UAAC,EAA4B;;IAAK,QACtEA,IAAC,QAAQ,aAAC,kBAAkB,EAAE;YAC5B,EAAE,EAAE,UAAC,KAAU,IAAK,QAClBA,qBAAI,SAAS,EAAC,YAAY,gBAAE,KAAK,CAAC,QAAQ,YAAM,IACjD;SACF,gFAEU;AAP2D;;;;;"}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import { _ as __assign } from '../../../tslib.es6-5bc94358.js';
|
|
2
|
+
import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
|
|
3
|
+
import { useState, useCallback } from 'react';
|
|
4
|
+
import { s as styleInject } from '../../../style-inject.es-1f59c1d0.js';
|
|
5
|
+
import { u as useOnClose } from '../../../useOnClose-d818a54f.js';
|
|
6
|
+
import { c as classnames } from '../../../index-e9e37a34.js';
|
|
7
|
+
|
|
8
|
+
var css_248z = "@keyframes style-module_fade-in__1GZgs {\n 0% {\n background-color: rgba(0, 0, 0, 0);\n }\n 100% {\n background-color: rgba(0, 0, 0, 0.3);\n }\n}\n@keyframes style-module_fade-out__30Bns {\n from {\n background-color: rgba(0, 0, 0, 0.3);\n }\n to {\n background-color: rgba(0, 0, 0, 0);\n }\n}\n@keyframes style-module_appear-in__3U2lu {\n 0% {\n transform: translateY(100%);\n }\n 80% {\n transform: translateY(-2%);\n }\n 100% {\n transform: translateY(0);\n }\n}\n@keyframes style-module_disappear-out__6pOVr {\n 0% {\n transform: translateY(0);\n }\n 100% {\n transform: translateY(100%);\n }\n}\n.style-module_close__1GERU {\n border: none;\n background-color: transparent;\n cursor: pointer;\n}\n\n.style-module_overlay__AlX2J, .style-module_overlay--close__3E9GY {\n position: fixed;\n z-index: 100;\n overflow: auto;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n animation: style-module_fade-in__1GZgs 0.3s both;\n}\n.style-module_overlay--close__3E9GY {\n animation-delay: 0.1s;\n animation: style-module_fade-out__30Bns 0.3s both;\n}\n\n.style-module_container__aOENo, .style-module_container--close__K506c {\n position: relative;\n background-color: white;\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n width: 100%;\n animation-name: style-module_appear-in__3U2lu;\n animation-duration: 0.4s;\n animation-fill-mode: both;\n animation-timing-function: ease-out;\n top: 0;\n}\n.style-module_container--close__K506c {\n animation-name: style-module_disappear-out__6pOVr;\n animation-duration: 0.4s;\n animation-delay: 0s;\n animation-fill-mode: both;\n animation-timing-function: ease-out;\n}\n\n.style-module_header__10iiH {\n height: 60px;\n display: flex;\n align-items: center;\n padding: 0 16px;\n}\n\n@media (max-width: 34rem) {\n .style-module_content__mq_IJ {\n padding-bottom: 48px;\n }\n}";
|
|
9
|
+
var styles = {"close":"style-module_close__1GERU","overlay":"style-module_overlay__AlX2J","overlay--close":"style-module_overlay--close__3E9GY","fade-in":"style-module_fade-in__1GZgs","fade-out":"style-module_fade-out__30Bns","container":"style-module_container__aOENo","container--close":"style-module_container--close__K506c","appear-in":"style-module_appear-in__3U2lu","disappear-out":"style-module_disappear-out__6pOVr","header":"style-module_header__10iiH","content":"style-module_content__mq_IJ"};
|
|
10
|
+
styleInject(css_248z);
|
|
11
|
+
|
|
12
|
+
var imageClose = "data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M18%206L6%2018%22%20stroke%3D%22%2326262E%22%20strokeWidth%3D%222%22%20strokeLinecap%3D%22round%22%20strokeLinejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M6%206L18%2018%22%20stroke%3D%22%2326262E%22%20strokeWidth%3D%222%22%20strokeLinecap%3D%22round%22%20strokeLinejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E";
|
|
13
|
+
|
|
14
|
+
var BottomModal = (function (_a) {
|
|
15
|
+
var title = _a.title, isOpen = _a.isOpen, children = _a.children, onClose = _a.onClose, _b = _a.className, className = _b === void 0 ? '' : _b, _c = _a.dismissible, dismissible = _c === void 0 ? true : _c;
|
|
16
|
+
var _d = useState(0), containerXOffset = _d[0], setContainerXOffset = _d[1];
|
|
17
|
+
var _e = useOnClose(onClose, isOpen, dismissible), isClosing = _e.isClosing, handleContainerClick = _e.handleContainerClick, handleOnClose = _e.handleOnClose, handleOnOverlayClick = _e.handleOnOverlayClick;
|
|
18
|
+
var containerRef = useCallback(function (node) {
|
|
19
|
+
if (node !== null) {
|
|
20
|
+
setContainerXOffset(Math.max(window.innerHeight * 0.1, window.innerHeight - node.getBoundingClientRect().height));
|
|
21
|
+
}
|
|
22
|
+
}, []);
|
|
23
|
+
if (!isOpen) {
|
|
24
|
+
return jsx(Fragment, {}, void 0);
|
|
25
|
+
}
|
|
26
|
+
return (jsx("div", __assign({ className: isClosing ? styles['overlay--close'] : styles.overlay, onClick: handleOnOverlayClick }, { children: jsxs("div", __assign({ className: (isClosing ? styles['container--close'] : styles.container) + " " + className, ref: containerRef, style: { top: containerXOffset + "px" }, onClick: handleContainerClick }, { children: [jsxs("div", __assign({ className: classnames(styles.header, {
|
|
27
|
+
'jc-between': !!title,
|
|
28
|
+
'jc-end': !title
|
|
29
|
+
}) }, { children: [jsx("div", __assign({ className: "p-h4 " + styles.title }, { children: title }), void 0),
|
|
30
|
+
dismissible && (jsx("button", __assign({ type: "button", className: styles.close, onClick: handleOnClose }, { children: jsx("img", { src: imageClose, alt: "Close" }, void 0) }), void 0))] }), void 0),
|
|
31
|
+
jsx("div", __assign({ className: styles.content }, { children: children }), void 0)] }), void 0) }), void 0));
|
|
32
|
+
});
|
|
33
|
+
|
|
34
|
+
export default BottomModal;
|
|
35
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../../src/lib/components/modal/bottomModal/img/close.svg","../../../../../../src/lib/components/modal/bottomModal/index.tsx"],"sourcesContent":["export default \"data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M18%206L6%2018%22%20stroke%3D%22%2326262E%22%20strokeWidth%3D%222%22%20strokeLinecap%3D%22round%22%20strokeLinejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M6%206L18%2018%22%20stroke%3D%22%2326262E%22%20strokeWidth%3D%222%22%20strokeLinecap%3D%22round%22%20strokeLinejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\"","import React, { useState, useCallback } from 'react';\n\nimport { Props } from '..';\nimport styles from './style.module.scss';\n\nimport imageClose from './img/close.svg';\nimport useOnClose from '../hooks/useOnClose';\nimport classNames from 'classnames';\n\nexport default ({\n title,\n isOpen,\n children,\n onClose,\n className = '',\n dismissible = true,\n}: Props) => {\n const [containerXOffset, setContainerXOffset] = useState(0);\n const {\n isClosing,\n handleContainerClick,\n handleOnClose,\n handleOnOverlayClick\n } = useOnClose(\n onClose,\n isOpen,\n dismissible\n );\n\n const containerRef = useCallback((node: HTMLDivElement) => {\n if (node !== null) {\n setContainerXOffset(\n Math.max(\n window.innerHeight * 0.1,\n window.innerHeight - node.getBoundingClientRect().height\n )\n );\n }\n }, []);\n\n if (!isOpen) {\n return <></>;\n }\n\n return (\n <div\n className={isClosing ? styles['overlay--close'] : styles.overlay}\n onClick={handleOnOverlayClick}\n >\n <div\n className={`${\n isClosing ? styles['container--close'] : styles.container\n } ${className}`}\n ref={containerRef}\n style={{ top: `${containerXOffset}px` }}\n onClick={handleContainerClick}\n >\n <div className={classNames(styles.header, {\n 'jc-between': !!title,\n 'jc-end': !title\n })}>\n <div className={`p-h4 ${styles.title}`}>{title}</div>\n {dismissible && (\n <button\n type=\"button\"\n className={styles.close}\n onClick={handleOnClose}\n >\n <img src={imageClose} alt=\"Close\" />\n </button>\n )}\n </div>\n <div className={styles.content}>{children}</div>\n </div>\n </div>\n );\n};\n"],"names":["_jsx","_jsxs","classNames"],"mappings":";;;;;;;;;;;AAAA,iBAAe;;ACSf,mBAAe,UAAC,EAOR;QANN,KAAK,WAAA,EACL,MAAM,YAAA,EACN,QAAQ,cAAA,EACR,OAAO,aAAA,EACP,iBAAc,EAAd,SAAS,mBAAG,EAAE,KAAA,EACd,mBAAkB,EAAlB,WAAW,mBAAG,IAAI,KAAA;IAEZ,IAAA,KAA0C,QAAQ,CAAC,CAAC,CAAC,EAApD,gBAAgB,QAAA,EAAE,mBAAmB,QAAe,CAAC;IACtD,IAAA,KAKD,UAAU,CACb,OAAO,EACP,MAAM,EACN,WAAW,CACZ,EARC,SAAS,eAAA,EACT,oBAAoB,0BAAA,EACpB,aAAa,mBAAA,EACb,oBAAoB,0BAKrB,CAAC;IAEF,IAAM,YAAY,GAAG,WAAW,CAAC,UAAC,IAAoB;QACpD,IAAI,IAAI,KAAK,IAAI,EAAE;YACjB,mBAAmB,CACjB,IAAI,CAAC,GAAG,CACN,MAAM,CAAC,WAAW,GAAG,GAAG,EACxB,MAAM,CAAC,WAAW,GAAG,IAAI,CAAC,qBAAqB,EAAE,CAAC,MAAM,CACzD,CACF,CAAC;SACH;KACF,EAAE,EAAE,CAAC,CAAC;IAEP,IAAI,CAAC,MAAM,EAAE;QACX,OAAOA,yBAAK,CAAC;KACd;IAED,QACEA,sBACE,SAAS,EAAE,SAAS,GAAG,MAAM,CAAC,gBAAgB,CAAC,GAAG,MAAM,CAAC,OAAO,EAChE,OAAO,EAAE,oBAAoB,gBAE7BC,uBACE,SAAS,EAAE,CACT,SAAS,GAAG,MAAM,CAAC,kBAAkB,CAAC,GAAG,MAAM,CAAC,SAAS,UACvD,SAAW,EACf,GAAG,EAAE,YAAY,EACjB,KAAK,EAAE,EAAE,GAAG,EAAK,gBAAgB,OAAI,EAAE,EACvC,OAAO,EAAE,oBAAoB,iBAE7BA,uBAAK,SAAS,EAAEC,UAAU,CAAC,MAAM,CAAC,MAAM,EAAE;wBACxC,YAAY,EAAE,CAAC,CAAC,KAAK;wBACrB,QAAQ,EAAE,CAAC,KAAK;qBACjB,CAAC,iBACAF,sBAAK,SAAS,EAAE,UAAQ,MAAM,CAAC,KAAO,gBAAG,KAAK,YAAO;wBACpD,WAAW,KACVA,yBACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,MAAM,CAAC,KAAK,EACvB,OAAO,EAAE,aAAa,gBAEtBA,aAAK,GAAG,EAAE,UAAU,EAAE,GAAG,EAAC,OAAO,WAAG,YAC7B,CACV,aACG;gBACNA,sBAAK,SAAS,EAAE,MAAM,CAAC,OAAO,gBAAG,QAAQ,YAAO,aAC5C,YACF,EACN;AACJ,CAAC;;;;"}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import { a as __rest, _ as __assign } from '../../../tslib.es6-5bc94358.js';
|
|
2
|
+
import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
|
|
3
|
+
import { useRef, useState, useEffect } from 'react';
|
|
4
|
+
import BottomModal from '../bottomModal/index.js';
|
|
5
|
+
import RegularModal from '../regularModal/index.js';
|
|
6
|
+
import { s as styleInject } from '../../../style-inject.es-1f59c1d0.js';
|
|
7
|
+
import '../../../useOnClose-d818a54f.js';
|
|
8
|
+
import '../../../index-e9e37a34.js';
|
|
9
|
+
|
|
10
|
+
var css_248z = "@media (min-width: 34rem) {\n .style-module_mobile__3k175 {\n display: none;\n }\n}\n@media (max-width: 34rem) {\n .style-module_mobile__3k175 {\n display: block !important;\n }\n}\n\n@media (max-width: 34rem) {\n .style-module_desktop__2lclr {\n display: none;\n }\n}";
|
|
11
|
+
var styles = {"mobile":"style-module_mobile__3k175","desktop":"style-module_desktop__2lclr"};
|
|
12
|
+
styleInject(css_248z);
|
|
13
|
+
|
|
14
|
+
var index = (function (_a) {
|
|
15
|
+
var isOpen = _a.isOpen, props = __rest(_a, ["isOpen"]);
|
|
16
|
+
var mobileRef = useRef(null);
|
|
17
|
+
var _b = useState('desktop'), visibleSize = _b[0], setVisibleSize = _b[1];
|
|
18
|
+
var handleResize = function () {
|
|
19
|
+
setVisibleSize(mobileRef.current !== null &&
|
|
20
|
+
window.getComputedStyle(mobileRef.current).display !== 'none'
|
|
21
|
+
? 'mobile'
|
|
22
|
+
: 'desktop');
|
|
23
|
+
};
|
|
24
|
+
useEffect(function () {
|
|
25
|
+
window.addEventListener('resize', handleResize);
|
|
26
|
+
handleResize();
|
|
27
|
+
return function () {
|
|
28
|
+
window.removeEventListener('resize', handleResize);
|
|
29
|
+
};
|
|
30
|
+
}, []);
|
|
31
|
+
return (jsxs(Fragment, { children: [jsx("div", __assign({ className: styles.mobile, ref: mobileRef }, { children: visibleSize === 'mobile' && jsx(BottomModal, __assign({}, props, { isOpen: isOpen }), void 0) }), void 0),
|
|
32
|
+
visibleSize === 'desktop' && (jsx("div", __assign({ className: styles.desktop }, { children: jsx(RegularModal, __assign({}, props, { isOpen: isOpen }), void 0) }), void 0))] }, void 0));
|
|
33
|
+
});
|
|
34
|
+
|
|
35
|
+
export default index;
|
|
36
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../../../src/lib/components/modal/bottomOrRegularModal/index.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\n\nimport { Props, RegularModal } from '..';\nimport BottomModal from '../bottomModal';\n\nimport styles from './style.module.scss';\n\nexport default ({ isOpen, ...props }: Props) => {\n const mobileRef = useRef<HTMLDivElement>(null);\n const [visibleSize, setVisibleSize] = useState<'desktop' | 'mobile'>(\n 'desktop'\n );\n\n const handleResize = () => {\n setVisibleSize(\n mobileRef.current !== null &&\n window.getComputedStyle(mobileRef.current).display !== 'none'\n ? 'mobile'\n : 'desktop'\n );\n };\n\n useEffect(() => {\n window.addEventListener('resize', handleResize);\n handleResize();\n return () => {\n window.removeEventListener('resize', handleResize);\n };\n }, []);\n\n return (\n <>\n <div className={styles.mobile} ref={mobileRef}>\n {visibleSize === 'mobile' && <BottomModal {...props} isOpen={isOpen} />}\n </div>\n {visibleSize === 'desktop' && (\n <div className={styles.desktop}>\n <RegularModal {...props} isOpen={isOpen} />\n </div>\n )}\n </>\n );\n};\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;;;;;;AAOA,aAAe,UAAC,EAA2B;IAAzB,IAAA,MAAM,YAAA,EAAK,KAAK,cAAlB,UAAoB,CAAF;IAChC,IAAM,SAAS,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACzC,IAAA,KAAgC,QAAQ,CAC5C,SAAS,CACV,EAFM,WAAW,QAAA,EAAE,cAAc,QAEjC,CAAC;IAEF,IAAM,YAAY,GAAG;QACnB,cAAc,CACZ,SAAS,CAAC,OAAO,KAAK,IAAI;YACxB,MAAM,CAAC,gBAAgB,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,OAAO,KAAK,MAAM;cAC3D,QAAQ;cACR,SAAS,CACd,CAAC;KACH,CAAC;IAEF,SAAS,CAAC;QACR,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;QAChD,YAAY,EAAE,CAAC;QACf,OAAO;YACL,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;SACpD,CAAC;KACH,EAAE,EAAE,CAAC,CAAC;IAEP,QACEA,4BACEC,sBAAK,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,EAAE,SAAS,gBAC1C,WAAW,KAAK,QAAQ,IAAIA,IAAC,WAAW,eAAK,KAAK,IAAE,MAAM,EAAE,MAAM,YAAI,YACnE;YACL,WAAW,KAAK,SAAS,KACxBA,sBAAK,SAAS,EAAE,MAAM,CAAC,OAAO,gBAC5BA,IAAC,YAAY,eAAK,KAAK,IAAE,MAAM,EAAE,MAAM,YAAI,YACvC,CACP,YACA,EACH;AACJ,CAAC;;;;"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { _ as __assign } from '../../../tslib.es6-5bc94358.js';
|
|
2
|
+
import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
|
|
3
|
+
import { u as useOnClose } from '../../../useOnClose-d818a54f.js';
|
|
4
|
+
import { s as styleInject } from '../../../style-inject.es-1f59c1d0.js';
|
|
5
|
+
import { c as classnames } from '../../../index-e9e37a34.js';
|
|
6
|
+
import 'react';
|
|
7
|
+
|
|
8
|
+
var css_248z = "@keyframes style-module_fade-in__nLzzO {\n 0% {\n background-color: rgba(0, 0, 0, 0);\n visibility: hidden;\n }\n 100% {\n background-color: rgba(0, 0, 0, 0.3);\n visibility: visible;\n }\n}\n@keyframes style-module_fade-out__IuSV7 {\n from {\n background-color: rgba(0, 0, 0, 0.3);\n visibility: visible;\n }\n to {\n background-color: rgba(0, 0, 0, 0);\n visibility: hidden;\n }\n}\n@keyframes style-module_appear-in__2ZMqz {\n 0% {\n transform: translateY(24px);\n opacity: 0;\n visibility: hidden;\n }\n 100% {\n transform: translateY(0);\n opacity: 1;\n visibility: visible;\n }\n}\n@keyframes style-module_disappear-out__38TSV {\n 0% {\n transform: translateY(0);\n opacity: 1;\n visibility: visible;\n }\n 100% {\n transform: translateY(24px);\n opacity: 0;\n visibility: hidden;\n }\n}\n.style-module_overlay__1Zbce, .style-module_overlay--close__2dytn {\n position: fixed;\n z-index: 100;\n overflow: auto;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n animation: style-module_fade-in__nLzzO 0.3s both;\n}\n.style-module_overlay--close__2dytn {\n animation-delay: 0.1s;\n animation: style-module_fade-out__IuSV7 0.3s both;\n}\n\n.style-module_container__1XZj_, .style-module_container--close__3UYsJ {\n position: relative;\n display: flex;\n align-items: center;\n max-width: 592px;\n width: 100%;\n min-height: 100%;\n margin: 0 auto;\n animation-name: style-module_appear-in__2ZMqz;\n animation-duration: 0.4s;\n animation-fill-mode: both;\n animation-timing-function: ease-out;\n}\n.style-module_container--close__3UYsJ {\n animation-name: style-module_disappear-out__38TSV;\n animation-duration: 0.4s;\n animation-delay: 0s;\n animation-fill-mode: both;\n animation-timing-function: ease-out;\n}\n\n.style-module_body__lbUih {\n background-color: white;\n border-radius: 8px;\n margin: 80px auto;\n}\n\n.style-module_header__2oEKp {\n display: flex;\n align-items: center;\n padding: 24px 24px 0 24px;\n}\n\n.style-module_close__p3Axi {\n border: none;\n background-color: transparent;\n cursor: pointer;\n}";
|
|
9
|
+
var styles = {"overlay":"style-module_overlay__1Zbce","overlay--close":"style-module_overlay--close__2dytn","fade-in":"style-module_fade-in__nLzzO","fade-out":"style-module_fade-out__IuSV7","container":"style-module_container__1XZj_","container--close":"style-module_container--close__3UYsJ","appear-in":"style-module_appear-in__2ZMqz","disappear-out":"style-module_disappear-out__38TSV","body":"style-module_body__lbUih","header":"style-module_header__2oEKp","close":"style-module_close__p3Axi"};
|
|
10
|
+
styleInject(css_248z);
|
|
11
|
+
|
|
12
|
+
var imageClose = "data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M18%206L6%2018%22%20stroke%3D%22%2326262E%22%20strokeWidth%3D%222%22%20strokeLinecap%3D%22round%22%20strokeLinejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M6%206L18%2018%22%20stroke%3D%22%2326262E%22%20strokeWidth%3D%222%22%20strokeLinecap%3D%22round%22%20strokeLinejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E";
|
|
13
|
+
|
|
14
|
+
var RegularModal = (function (_a) {
|
|
15
|
+
var title = _a.title, isOpen = _a.isOpen, children = _a.children, onClose = _a.onClose, _b = _a.className, className = _b === void 0 ? '' : _b, _c = _a.dismissible, dismissible = _c === void 0 ? true : _c;
|
|
16
|
+
var _d = useOnClose(onClose, isOpen, dismissible), isClosing = _d.isClosing, handleContainerClick = _d.handleContainerClick, handleOnClose = _d.handleOnClose, handleOnOverlayClick = _d.handleOnOverlayClick;
|
|
17
|
+
if (!isOpen) {
|
|
18
|
+
return jsx(Fragment, {}, void 0);
|
|
19
|
+
}
|
|
20
|
+
return (jsx("div", __assign({ className: isClosing ? styles['overlay--close'] : styles.overlay, onClick: handleOnOverlayClick }, { children: jsx("div", __assign({ className: (isClosing ? styles['container--close'] : styles.container) + " " + className }, { children: jsxs("div", __assign({ className: styles.body, onClick: handleContainerClick }, { children: [jsxs("div", __assign({ className: classnames(styles.header, {
|
|
21
|
+
'jc-between': !!title,
|
|
22
|
+
'jc-end': !title
|
|
23
|
+
}) }, { children: [title && jsx("div", __assign({ className: "p-h2 " + styles.title }, { children: title }), void 0),
|
|
24
|
+
dismissible && (jsx("button", __assign({ type: "button", className: styles.close, onClick: handleOnClose }, { children: jsx("img", { src: imageClose, alt: "Close" }, void 0) }), void 0))] }), void 0), children] }), void 0) }), void 0) }), void 0));
|
|
25
|
+
});
|
|
26
|
+
|
|
27
|
+
export default RegularModal;
|
|
28
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../../src/lib/components/modal/regularModal/img/close.svg","../../../../../../src/lib/components/modal/regularModal/index.tsx"],"sourcesContent":["export default \"data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M18%206L6%2018%22%20stroke%3D%22%2326262E%22%20strokeWidth%3D%222%22%20strokeLinecap%3D%22round%22%20strokeLinejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M6%206L18%2018%22%20stroke%3D%22%2326262E%22%20strokeWidth%3D%222%22%20strokeLinecap%3D%22round%22%20strokeLinejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\"","import React from 'react';\n\nimport { Props } from '..';\nimport useOnClose from '../hooks/useOnClose';\n\nimport styles from './style.module.scss';\n\nimport imageClose from './img/close.svg';\nimport classNames from 'classnames';\n\nexport default ({\n title,\n isOpen,\n children,\n onClose,\n className = '',\n dismissible = true,\n}: Props) => {\n const {\n isClosing,\n handleContainerClick,\n handleOnClose,\n handleOnOverlayClick\n } = useOnClose(\n onClose,\n isOpen,\n dismissible\n );\n\n if (!isOpen) {\n return <></>;\n }\n\n return (\n <div\n className={isClosing ? styles['overlay--close'] : styles.overlay}\n onClick={handleOnOverlayClick}\n >\n <div\n className={`${\n isClosing ? styles['container--close'] : styles.container\n } ${className}`}\n >\n <div\n className={styles.body}\n onClick={handleContainerClick}\n >\n <div className={classNames(styles.header, {\n 'jc-between': !!title,\n 'jc-end': !title\n })}>\n {title && <div className={`p-h2 ${styles.title}`}>{title}</div>}\n {dismissible && (\n <button\n type=\"button\"\n className={styles.close}\n onClick={handleOnClose}\n >\n <img src={imageClose} alt=\"Close\" />\n </button>\n )}\n </div>\n {children}\n </div>\n </div>\n </div>\n );\n};\n"],"names":["_jsx","_jsxs","classNames"],"mappings":";;;;;;;;;;;AAAA,iBAAe;;ACUf,oBAAe,UAAC,EAOR;QANN,KAAK,WAAA,EACL,MAAM,YAAA,EACN,QAAQ,cAAA,EACR,OAAO,aAAA,EACP,iBAAc,EAAd,SAAS,mBAAG,EAAE,KAAA,EACd,mBAAkB,EAAlB,WAAW,mBAAG,IAAI,KAAA;IAEZ,IAAA,KAKF,UAAU,CACZ,OAAO,EACP,MAAM,EACN,WAAW,CACZ,EARC,SAAS,eAAA,EACT,oBAAoB,0BAAA,EACpB,aAAa,mBAAA,EACb,oBAAoB,0BAKrB,CAAC;IAEF,IAAI,CAAC,MAAM,EAAE;QACX,OAAOA,yBAAK,CAAC;KACd;IAED,QACEA,sBACE,SAAS,EAAE,SAAS,GAAG,MAAM,CAAC,gBAAgB,CAAC,GAAG,MAAM,CAAC,OAAO,EAChE,OAAO,EAAE,oBAAoB,gBAE7BA,sBACE,SAAS,EAAE,CACT,SAAS,GAAG,MAAM,CAAC,kBAAkB,CAAC,GAAG,MAAM,CAAC,SAAS,UACvD,SAAW,gBAEfC,uBACE,SAAS,EAAE,MAAM,CAAC,IAAI,EACtB,OAAO,EAAE,oBAAoB,iBAE7BA,uBAAK,SAAS,EAAEC,UAAU,CAAC,MAAM,CAAC,MAAM,EAAE;4BACxC,YAAY,EAAE,CAAC,CAAC,KAAK;4BACrB,QAAQ,EAAE,CAAC,KAAK;yBACjB,CAAC,iBACC,KAAK,IAAIF,sBAAK,SAAS,EAAE,UAAQ,MAAM,CAAC,KAAO,gBAAG,KAAK,YAAO;4BAC9D,WAAW,KACVA,yBACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,MAAM,CAAC,KAAK,EACvB,OAAO,EAAE,aAAa,gBAEtBA,aAAK,GAAG,EAAE,UAAU,EAAE,GAAG,EAAC,OAAO,WAAG,YAC7B,CACV,aACG,EACL,QAAQ,aACL,YACF,YACF,EACN;AACJ,CAAC;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|