@dr.pogodin/react-utils 1.30.2 → 1.31.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bin/build.js +5 -0
- package/build/development/client/index.js +1 -1
- package/build/development/client/index.js.map +1 -1
- package/build/development/index.js +7 -0
- package/build/development/index.js.map +1 -1
- package/build/development/shared/components/Checkbox/index.js +2 -2
- package/build/development/shared/components/Checkbox/index.js.map +1 -1
- package/build/development/shared/components/Input/index.js +2 -2
- package/build/development/shared/components/Input/index.js.map +1 -1
- package/build/development/shared/components/Modal/index.js +25 -5
- package/build/development/shared/components/Modal/index.js.map +1 -1
- package/build/development/shared/components/TextArea/index.js +5 -0
- package/build/development/shared/components/TextArea/index.js.map +1 -1
- package/build/development/shared/components/YouTubeVideo/index.js +1 -3
- package/build/development/shared/components/YouTubeVideo/index.js.map +1 -1
- package/build/development/shared/components/index.js +27 -14
- package/build/development/shared/components/index.js.map +1 -1
- package/build/development/shared/components/selectors/CustomDropdown/Options/index.js +93 -0
- package/build/development/shared/components/selectors/CustomDropdown/Options/index.js.map +1 -0
- package/build/development/shared/components/selectors/CustomDropdown/index.js +105 -0
- package/build/development/shared/components/selectors/CustomDropdown/index.js.map +1 -0
- package/build/development/shared/components/{Dropdown → selectors/NativeDropdown}/index.js +25 -34
- package/build/development/shared/components/selectors/NativeDropdown/index.js.map +1 -0
- package/build/development/shared/components/selectors/Switch/index.js +76 -0
- package/build/development/shared/components/selectors/Switch/index.js.map +1 -0
- package/build/development/shared/components/selectors/common.js +24 -0
- package/build/development/shared/components/selectors/common.js.map +1 -0
- package/build/development/shared/components/selectors/index.js +28 -0
- package/build/development/shared/components/selectors/index.js.map +1 -0
- package/build/development/style.css +387 -225
- package/build/development/web.bundle.js +109 -49
- package/build/production/client/index.js +1 -1
- package/build/production/client/index.js.map +1 -1
- package/build/production/index.js +1 -1
- package/build/production/index.js.map +1 -1
- package/build/production/shared/components/Checkbox/index.js +2 -2
- package/build/production/shared/components/Checkbox/index.js.map +1 -1
- package/build/production/shared/components/Input/index.js +1 -1
- package/build/production/shared/components/Input/index.js.map +1 -1
- package/build/production/shared/components/Modal/index.js +3 -2
- package/build/production/shared/components/Modal/index.js.map +1 -1
- package/build/production/shared/components/TextArea/index.js +3 -3
- package/build/production/shared/components/TextArea/index.js.map +1 -1
- package/build/production/shared/components/YouTubeVideo/index.js +2 -2
- package/build/production/shared/components/YouTubeVideo/index.js.map +1 -1
- package/build/production/shared/components/index.js +1 -1
- package/build/production/shared/components/index.js.map +1 -1
- package/build/production/shared/components/selectors/CustomDropdown/Options/index.js +7 -0
- package/build/production/shared/components/selectors/CustomDropdown/Options/index.js.map +1 -0
- package/build/production/shared/components/selectors/CustomDropdown/index.js +4 -0
- package/build/production/shared/components/selectors/CustomDropdown/index.js.map +1 -0
- package/build/production/shared/components/selectors/NativeDropdown/index.js +25 -0
- package/build/production/shared/components/selectors/NativeDropdown/index.js.map +1 -0
- package/build/production/shared/components/selectors/Switch/index.js +2 -0
- package/build/production/shared/components/selectors/Switch/index.js.map +1 -0
- package/build/production/shared/components/selectors/common.js +3 -0
- package/build/production/shared/components/selectors/common.js.map +1 -0
- package/build/production/shared/components/selectors/index.js +2 -0
- package/build/production/shared/components/selectors/index.js.map +1 -0
- package/build/production/style.css +1 -1
- package/build/production/style.css.map +1 -1
- package/build/production/web.bundle.js +1 -1
- package/build/production/web.bundle.js.map +1 -1
- package/build/types-code/client/index.d.ts +1 -0
- package/build/types-code/index.d.ts +1 -1
- package/build/types-code/shared/components/Checkbox/index.d.ts +1 -1
- package/build/types-code/shared/components/Input/index.d.ts +1 -1
- package/build/types-code/shared/components/Modal/index.d.ts +2 -1
- package/build/types-code/shared/components/TextArea/index.d.ts +1 -0
- package/build/types-code/shared/components/index.d.ts +1 -2
- package/build/types-code/shared/components/selectors/CustomDropdown/Options/index.d.ts +17 -0
- package/build/types-code/shared/components/selectors/CustomDropdown/index.d.ts +4 -0
- package/build/types-code/shared/components/selectors/NativeDropdown/index.d.ts +3 -0
- package/build/types-code/shared/components/selectors/Switch/index.d.ts +13 -0
- package/build/types-code/shared/components/selectors/common.d.ts +27 -0
- package/build/types-code/shared/components/selectors/index.d.ts +3 -0
- package/build/types-scss/src/shared/components/Modal/styles.scss.d.ts +1 -0
- package/build/types-scss/src/shared/components/selectors/CustomDropdown/Options/style.scss.d.ts +1 -0
- package/build/types-scss/src/shared/components/selectors/CustomDropdown/theme.scss.d.ts +10 -0
- package/build/types-scss/src/shared/components/{Dropdown → selectors/NativeDropdown}/theme.scss.d.ts +1 -0
- package/build/types-scss/src/shared/components/selectors/Switch/theme.scss.d.ts +6 -0
- package/package.json +6 -6
- package/src/client/index.tsx +2 -1
- package/src/index.ts +1 -0
- package/src/shared/components/Button/style.scss +1 -0
- package/src/shared/components/Checkbox/index.tsx +3 -3
- package/src/shared/components/Input/index.tsx +3 -3
- package/src/shared/components/Modal/base-theme.scss +1 -1
- package/src/shared/components/Modal/index.tsx +24 -5
- package/src/shared/components/Modal/styles.scss +2 -4
- package/src/shared/components/TextArea/index.tsx +5 -0
- package/src/shared/components/TextArea/style.scss +8 -0
- package/src/shared/components/YouTubeVideo/base.scss +3 -1
- package/src/shared/components/YouTubeVideo/index.tsx +2 -3
- package/src/shared/components/index.ts +2 -2
- package/src/shared/components/selectors/CustomDropdown/Options/index.tsx +117 -0
- package/src/shared/components/selectors/CustomDropdown/Options/style.scss +6 -0
- package/src/shared/components/selectors/CustomDropdown/index.tsx +115 -0
- package/src/shared/components/selectors/CustomDropdown/theme.scss +90 -0
- package/src/shared/components/{Dropdown → selectors/NativeDropdown}/index.tsx +21 -50
- package/src/shared/components/{Dropdown → selectors/NativeDropdown}/theme.scss +5 -0
- package/src/shared/components/selectors/Switch/index.tsx +94 -0
- package/src/shared/components/selectors/Switch/theme.scss +39 -0
- package/src/shared/components/selectors/common.ts +54 -0
- package/src/shared/components/selectors/index.ts +3 -0
- package/build/development/shared/components/Dropdown/index.js.map +0 -1
- package/build/development/shared/components/ScalableRect/index.js +0 -80
- package/build/development/shared/components/ScalableRect/index.js.map +0 -1
- package/build/production/shared/components/Dropdown/index.js +0 -24
- package/build/production/shared/components/Dropdown/index.js.map +0 -1
- package/build/production/shared/components/ScalableRect/index.js +0 -21
- package/build/production/shared/components/ScalableRect/index.js.map +0 -1
- package/build/types-code/shared/components/Dropdown/index.d.ts +0 -17
- package/build/types-code/shared/components/ScalableRect/index.d.ts +0 -19
- package/build/types-scss/src/shared/components/ScalableRect/style.scss.d.ts +0 -2
- package/src/shared/components/ScalableRect/index.tsx +0 -84
- package/src/shared/components/ScalableRect/style.scss +0 -10
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _propTypes=_interopRequireDefault(require("prop-types"));var _reactThemes=_interopRequireDefault(require("@dr.pogodin/react-themes"));var _jsxRuntime=require("react/jsx-runtime");const defaultTheme={"context":"dNQcC6","ad":"earXxa","hoc":"qAPfQ6","checkbox":"A-f8qJ","container":"Kr0g3M","label":"_3dML-O"};const validThemeKeys=["checkbox","container","label"];const Checkbox=({checked,label,onChange,theme})=>/*#__PURE__*/(0,_jsxRuntime.jsxs)("div",{className:theme.container,children:[label===undefined?null:/*#__PURE__*/(0,_jsxRuntime.jsx)("
|
|
1
|
+
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _propTypes=_interopRequireDefault(require("prop-types"));var _reactThemes=_interopRequireDefault(require("@dr.pogodin/react-themes"));var _jsxRuntime=require("react/jsx-runtime");const defaultTheme={"context":"dNQcC6","ad":"earXxa","hoc":"qAPfQ6","checkbox":"A-f8qJ","container":"Kr0g3M","label":"_3dML-O"};const validThemeKeys=["checkbox","container","label"];const Checkbox=({checked,label,onChange,theme})=>/*#__PURE__*/(0,_jsxRuntime.jsxs)("div",{className:theme.container,children:[label===undefined?null:/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:theme.label,children:label}),/*#__PURE__*/(0,_jsxRuntime.jsx)("input",{checked:checked,className:theme.checkbox,onChange:onChange,type:"checkbox"})]});/**
|
|
2
2
|
* Checkbox component theme: a map of
|
|
3
3
|
* CSS classes to append to its elements:
|
|
4
4
|
* @prop [checkbox] to the underlying checkbox `<input>` element.
|
|
@@ -13,5 +13,5 @@
|
|
|
13
13
|
* @param [props.theme] _Ad hoc_ theme.
|
|
14
14
|
* @param [props....]
|
|
15
15
|
* [Other properties of themeable components](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties).
|
|
16
|
-
*/Checkbox.propTypes={checked:_propTypes.default.bool,label:_propTypes.default.
|
|
16
|
+
*/Checkbox.propTypes={checked:_propTypes.default.bool,label:_propTypes.default.node,onChange:_propTypes.default.func,theme:ThemedCheckbox.themeType.isRequired};Checkbox.defaultProps={checked:undefined,label:undefined,onChange:undefined};var _default=exports.default=ThemedCheckbox;
|
|
17
17
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_reactThemes","_jsxRuntime","defaultTheme","validThemeKeys","Checkbox","checked","label","onChange","theme","jsxs","className","container","children","undefined","jsx","checkbox","type","ThemedCheckbox","themed","propTypes","PT","bool","
|
|
1
|
+
{"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_reactThemes","_jsxRuntime","defaultTheme","validThemeKeys","Checkbox","checked","label","onChange","theme","jsxs","className","container","children","undefined","jsx","checkbox","type","ThemedCheckbox","themed","propTypes","PT","bool","node","func","themeType","isRequired","defaultProps","_default","exports","default"],"sources":["../../../../../src/shared/components/Checkbox/index.tsx"],"sourcesContent":["import PT from 'prop-types';\n\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './theme.scss';\n\nconst validThemeKeys = ['checkbox', 'container', 'label'] as const;\n\ntype PropT = {\n checked?: boolean;\n label?: React.ReactNode;\n onChange?: React.ChangeEventHandler<HTMLInputElement>;\n theme: Theme<typeof validThemeKeys>;\n};\n\nconst Checkbox: React.FunctionComponent<PropT> = ({\n checked,\n label,\n onChange,\n theme,\n}) => (\n <div className={theme.container}>\n { label === undefined ? null : <div className={theme.label}>{label}</div> }\n <input\n checked={checked}\n className={theme.checkbox}\n onChange={onChange}\n type=\"checkbox\"\n />\n </div>\n);\n\n/**\n * Checkbox component theme: a map of\n * CSS classes to append to its elements:\n * @prop [checkbox] to the underlying checkbox `<input>` element.\n * @prop [container] to the root checkbox element.\n * @prop [label] to the checkbox label element.\n */\nconst ThemedCheckbox = themed(\n Checkbox,\n 'Checkbox',\n validThemeKeys,\n defaultTheme,\n);\n\n/**\n * The `<Checkbox>` component implements themeable checkboxes.\n * @param [props] Component properties.\n * @param [props.checked] Checkbox value.\n * @param [props.label] Checkbox label.\n * @param [props.onChange] State change handler.\n * @param [props.theme] _Ad hoc_ theme.\n * @param [props....]\n * [Other properties of themeable components](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties).\n */\nCheckbox.propTypes = {\n checked: PT.bool,\n label: PT.node,\n onChange: PT.func,\n theme: ThemedCheckbox.themeType.isRequired,\n};\n\nCheckbox.defaultProps = {\n checked: undefined,\n label: undefined,\n onChange: undefined,\n};\n\nexport default ThemedCheckbox;\n"],"mappings":"gLAAA,IAAAA,UAAA,CAAAC,sBAAA,CAAAC,OAAA,gBAEA,IAAAC,YAAA,CAAAF,sBAAA,CAAAC,OAAA,8BAA8D,IAAAE,WAAA,CAAAF,OAAA,4BAAAG,YAAA,8GAI9D,KAAM,CAAAC,cAAc,CAAG,CAAC,UAAU,CAAE,WAAW,CAAE,OAAO,CAAU,CASlE,KAAM,CAAAC,QAAwC,CAAGA,CAAC,CAChDC,OAAO,CACPC,KAAK,CACLC,QAAQ,CACRC,KACF,CAAC,gBACC,GAAAP,WAAA,CAAAQ,IAAA,SAAKC,SAAS,CAAEF,KAAK,CAACG,SAAU,CAAAC,QAAA,EAC5BN,KAAK,GAAKO,SAAS,CAAG,IAAI,cAAG,GAAAZ,WAAA,CAAAa,GAAA,SAAKJ,SAAS,CAAEF,KAAK,CAACF,KAAM,CAAAM,QAAA,CAAEN,KAAK,CAAM,CAAC,cACzE,GAAAL,WAAA,CAAAa,GAAA,WACET,OAAO,CAAEA,OAAQ,CACjBK,SAAS,CAAEF,KAAK,CAACO,QAAS,CAC1BR,QAAQ,CAAEA,QAAS,CACnBS,IAAI,CAAC,UAAU,CAChB,CAAC,EACC,CACN,CAED;AACA;AACA;AACA;AACA;AACA;AACA,GACA,KAAM,CAAAC,cAAc,CAAG,GAAAC,oBAAM,EAC3Bd,QAAQ,CACR,UAAU,CACVD,cAAc,CACdD,YACF,CAAC,CAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GACAE,QAAQ,CAACe,SAAS,CAAG,CACnBd,OAAO,CAAEe,kBAAE,CAACC,IAAI,CAChBf,KAAK,CAAEc,kBAAE,CAACE,IAAI,CACdf,QAAQ,CAAEa,kBAAE,CAACG,IAAI,CACjBf,KAAK,CAAES,cAAc,CAACO,SAAS,CAACC,UAClC,CAAC,CAEDrB,QAAQ,CAACsB,YAAY,CAAG,CACtBrB,OAAO,CAAEQ,SAAS,CAClBP,KAAK,CAAEO,SAAS,CAChBN,QAAQ,CAAEM,SACZ,CAAC,CAAC,IAAAc,QAAA,CAAAC,OAAA,CAAAC,OAAA,CAEaZ,cAAc","ignoreList":[]}
|
|
@@ -6,5 +6,5 @@
|
|
|
6
6
|
* @param [props...] [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties)
|
|
7
7
|
* @param [props...] Any other properties are passed to the underlying
|
|
8
8
|
* `<input>` element.
|
|
9
|
-
*/const Input=/*#__PURE__*/(0,_react.forwardRef)(({label,theme,...rest},ref)=>/*#__PURE__*/(0,_jsxRuntime.jsxs)("span",{className:theme.container,children:[label===undefined?null:/*#__PURE__*/(0,_jsxRuntime.jsx)("
|
|
9
|
+
*/const Input=/*#__PURE__*/(0,_react.forwardRef)(({label,theme,...rest},ref)=>/*#__PURE__*/(0,_jsxRuntime.jsxs)("span",{className:theme.container,children:[label===undefined?null:/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:theme.label,children:label}),/*#__PURE__*/(0,_jsxRuntime.jsx)("input",{className:theme.input,ref:ref,...rest})]}));const ThemedInput=(0,_reactThemes.default)(Input,"Input",validThemeKeys,defaultTheme);Input.propTypes={label:_propTypes.default.node,theme:ThemedInput.themeType.isRequired};Input.defaultProps={label:undefined};var _default=exports.default=ThemedInput;
|
|
10
10
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_react","_reactThemes","_jsxRuntime","defaultTheme","validThemeKeys","Input","forwardRef","label","theme","rest","ref","jsxs","className","container","children","undefined","jsx","input","ThemedInput","themed","propTypes","PT","
|
|
1
|
+
{"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_react","_reactThemes","_jsxRuntime","defaultTheme","validThemeKeys","Input","forwardRef","label","theme","rest","ref","jsxs","className","container","children","undefined","jsx","input","ThemedInput","themed","propTypes","PT","node","themeType","isRequired","defaultProps","_default","exports","default"],"sources":["../../../../../src/shared/components/Input/index.tsx"],"sourcesContent":["import PT from 'prop-types';\nimport { forwardRef } from 'react';\n\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './theme.scss';\n\nconst validThemeKeys = [\n 'container',\n 'input',\n 'label',\n] as const;\n\ntype PropsT = React.InputHTMLAttributes<HTMLInputElement> & {\n label?: React.ReactNode;\n theme: Theme<typeof validThemeKeys>;\n};\n\n/**\n * Themeable input field, based on the standard HTML `<input>` element.\n * @param [props]\n * @param [props.label] Input label.\n * @param [props.theme] _Ad hoc_ theme.\n * @param [props...] [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties)\n * @param [props...] Any other properties are passed to the underlying\n * `<input>` element.\n */\nconst Input = forwardRef<HTMLInputElement, PropsT>((\n {\n label,\n theme,\n ...rest\n }: PropsT,\n ref,\n) => (\n <span className={theme.container}>\n { label === undefined ? null : <div className={theme.label}>{label}</div> }\n <input\n className={theme.input}\n ref={ref}\n {...rest} // eslint-disable-line react/jsx-props-no-spreading\n />\n </span>\n));\n\nconst ThemedInput = themed(Input, 'Input', validThemeKeys, defaultTheme);\n\nInput.propTypes = {\n label: PT.node,\n theme: ThemedInput.themeType.isRequired,\n};\n\nInput.defaultProps = {\n label: undefined,\n};\n\nexport default ThemedInput;\n"],"mappings":"gLAAA,IAAAA,UAAA,CAAAC,sBAAA,CAAAC,OAAA,gBACA,IAAAC,MAAA,CAAAD,OAAA,UAEA,IAAAE,YAAA,CAAAH,sBAAA,CAAAC,OAAA,8BAA8D,IAAAG,WAAA,CAAAH,OAAA,4BAAAI,YAAA,2GAI9D,KAAM,CAAAC,cAAc,CAAG,CACrB,WAAW,CACX,OAAO,CACP,OAAO,CACC,CAOV;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GACA,KAAM,CAAAC,KAAK,cAAG,GAAAC,iBAAU,EAA2B,CACjD,CACEC,KAAK,CACLC,KAAK,CACL,GAAGC,IACG,CAAC,CACTC,GAAG,gBAEH,GAAAR,WAAA,CAAAS,IAAA,UAAMC,SAAS,CAAEJ,KAAK,CAACK,SAAU,CAAAC,QAAA,EAC7BP,KAAK,GAAKQ,SAAS,CAAG,IAAI,cAAG,GAAAb,WAAA,CAAAc,GAAA,SAAKJ,SAAS,CAAEJ,KAAK,CAACD,KAAM,CAAAO,QAAA,CAAEP,KAAK,CAAM,CAAC,cACzE,GAAAL,WAAA,CAAAc,GAAA,WACEJ,SAAS,CAAEJ,KAAK,CAACS,KAAM,CACvBP,GAAG,CAAEA,GAAI,IACLD,IAAI,CACT,CAAC,EACE,CACP,CAAC,CAEF,KAAM,CAAAS,WAAW,CAAG,GAAAC,oBAAM,EAACd,KAAK,CAAE,OAAO,CAAED,cAAc,CAAED,YAAY,CAAC,CAExEE,KAAK,CAACe,SAAS,CAAG,CAChBb,KAAK,CAAEc,kBAAE,CAACC,IAAI,CACdd,KAAK,CAAEU,WAAW,CAACK,SAAS,CAACC,UAC/B,CAAC,CAEDnB,KAAK,CAACoB,YAAY,CAAG,CACnBlB,KAAK,CAAEQ,SACT,CAAC,CAAC,IAAAW,QAAA,CAAAC,OAAA,CAAAC,OAAA,CAEaV,WAAW","ignoreList":[]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=exports.BaseModal=void 0;var _lodash=require("lodash");var _react=require("react");var _reactDom=_interopRequireDefault(require("react-dom"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactThemes=_interopRequireDefault(require("@dr.pogodin/react-themes"));var _jsxRuntime=require("react/jsx-runtime");/* global document */const baseTheme={"context":"Szmbbz","ad":"Ah-Nsc","hoc":"Wki41G","overlay":"ye2BZo","container":"gyZ4rc"};const validThemeKeys=["container","overlay"];/**
|
|
1
|
+
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=exports.BaseModal=void 0;var _lodash=require("lodash");var _react=require("react");var _reactDom=_interopRequireDefault(require("react-dom"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactThemes=_interopRequireDefault(require("@dr.pogodin/react-themes"));var _jsxRuntime=require("react/jsx-runtime");/* global document */const baseTheme={"context":"Szmbbz","ad":"Ah-Nsc","hoc":"Wki41G","overlay":"ye2BZo","container":"gyZ4rc"};const S={"scrollingDisabledByModal":"_5fRFtF"};const validThemeKeys=["container","overlay"];/**
|
|
2
2
|
* The `<Modal>` component implements a simple themeable modal window, wrapped
|
|
3
3
|
* into the default theme. `<BaseModal>` exposes the base non-themed component.
|
|
4
4
|
* **Children:** Component children are rendered as the modal content.
|
|
@@ -8,5 +8,6 @@
|
|
|
8
8
|
* clicks outside the modal, or presses Escape. It is expected to hide the
|
|
9
9
|
* modal.
|
|
10
10
|
* @param {ModalTheme} [props.theme] _Ad hoc_ theme.
|
|
11
|
-
*/const BaseModal=({children,onCancel,theme})=>{const containerRef=(0,_react.useRef)(null);const overlayRef=(0,_react.useRef)(null);const[portal,setPortal]=(0,_react.useState)();(0,_react.useEffect)(()=>{const p=document.createElement("div");document.body.
|
|
11
|
+
*/const BaseModal=({children,containerStyle,dontDisableScrolling,onCancel,theme})=>{const containerRef=(0,_react.useRef)(null);const overlayRef=(0,_react.useRef)(null);const[portal,setPortal]=(0,_react.useState)();(0,_react.useEffect)(()=>{const p=document.createElement("div");document.body.appendChild(p);setPortal(p);return()=>{document.body.removeChild(p)}},[]);// Disables window scrolling, if it is not opted-out.
|
|
12
|
+
(0,_react.useEffect)(()=>{if(!dontDisableScrolling){document.body.classList.add(S.scrollingDisabledByModal)}return()=>{if(!dontDisableScrolling){document.body.classList.remove(S.scrollingDisabledByModal)}}},[dontDisableScrolling]);const focusLast=(0,_react.useMemo)(()=>/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{onFocus:()=>{const elems=containerRef.current?.querySelectorAll("*");for(let i=elems.length-1;i>=0;--i){elems[i].focus();if(document.activeElement===elems[i])return}overlayRef.current?.focus()}/* eslint-disable jsx-a11y/no-noninteractive-tabindex */,tabIndex:0/* eslint-enable jsx-a11y/no-noninteractive-tabindex */}),[]);return portal?/*#__PURE__*/_reactDom.default.createPortal(/*#__PURE__*/(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[focusLast,/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{"aria-label":"Cancel",className:theme.overlay,onClick:()=>onCancel&&onCancel(),onKeyDown:e=>{if(e.key==="Escape"&&onCancel)onCancel()},ref:node=>{if(node&&node!==overlayRef.current){overlayRef.current=node;node.focus()}},role:"button",tabIndex:0}),/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{"aria-modal":"true",className:theme.container,onWheel:event=>event.stopPropagation(),ref:containerRef,role:"dialog",style:containerStyle,children:children}),/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{onFocus:()=>{overlayRef.current?.focus()}/* eslint-disable jsx-a11y/no-noninteractive-tabindex */,tabIndex:0/* eslint-enable jsx-a11y/no-noninteractive-tabindex */}),focusLast]}),portal):null};exports.BaseModal=BaseModal;const ThemedModal=(0,_reactThemes.default)(BaseModal,"Modal",validThemeKeys,baseTheme);BaseModal.propTypes={children:_propTypes.default.node,containerStyle:_propTypes.default.shape({}),dontDisableScrolling:_propTypes.default.bool,onCancel:_propTypes.default.func,theme:ThemedModal.themeType.isRequired};BaseModal.defaultProps={children:null,containerStyle:undefined,dontDisableScrolling:false,onCancel:_lodash.noop};var _default=exports.default=ThemedModal;/* Non-themed version of the Modal. */
|
|
12
13
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["_lodash","require","_react","_reactDom","_interopRequireDefault","_propTypes","_reactThemes","_jsxRuntime","baseTheme","validThemeKeys","BaseModal","children","onCancel","theme","containerRef","useRef","overlayRef","portal","setPortal","useState","useEffect","p","document","createElement","body","classList","add","
|
|
1
|
+
{"version":3,"file":"index.js","names":["_lodash","require","_react","_reactDom","_interopRequireDefault","_propTypes","_reactThemes","_jsxRuntime","baseTheme","S","validThemeKeys","BaseModal","children","containerStyle","dontDisableScrolling","onCancel","theme","containerRef","useRef","overlayRef","portal","setPortal","useState","useEffect","p","document","createElement","body","appendChild","removeChild","classList","add","scrollingDisabledByModal","remove","focusLast","useMemo","jsx","onFocus","elems","current","querySelectorAll","i","length","focus","activeElement","tabIndex","ReactDom","createPortal","jsxs","Fragment","className","overlay","onClick","onKeyDown","e","key","ref","node","role","container","onWheel","event","stopPropagation","style","exports","ThemedModal","themed","propTypes","PT","shape","bool","func","themeType","isRequired","defaultProps","undefined","noop","_default","default"],"sources":["../../../../../src/shared/components/Modal/index.tsx"],"sourcesContent":["/* global document */\n\nimport { noop } from 'lodash';\n\nimport {\n type ReactNode,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\n\nimport ReactDom from 'react-dom';\nimport PT from 'prop-types';\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport baseTheme from './base-theme.scss';\nimport S from './styles.scss';\n\nconst validThemeKeys = ['container', 'overlay'] as const;\n\ntype PropsT = {\n children?: ReactNode;\n containerStyle?: React.CSSProperties;\n dontDisableScrolling?: boolean;\n onCancel?: () => void;\n theme: Theme<typeof validThemeKeys>;\n};\n\n/**\n * The `<Modal>` component implements a simple themeable modal window, wrapped\n * into the default theme. `<BaseModal>` exposes the base non-themed component.\n * **Children:** Component children are rendered as the modal content.\n * @param {object} props Component properties. Beside props documented below,\n * [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties) are supported as well.\n * @param {function} [props.onCancel] The callback to trigger when user\n * clicks outside the modal, or presses Escape. It is expected to hide the\n * modal.\n * @param {ModalTheme} [props.theme] _Ad hoc_ theme.\n */\nconst BaseModal: React.FunctionComponent<PropsT> = ({\n children,\n containerStyle,\n dontDisableScrolling,\n onCancel,\n theme,\n}) => {\n const containerRef = useRef<HTMLDivElement | null>(null);\n const overlayRef = useRef<HTMLDivElement | null>(null);\n const [portal, setPortal] = useState<HTMLDivElement>();\n\n useEffect(() => {\n const p = document.createElement('div');\n document.body.appendChild(p);\n setPortal(p);\n return () => {\n document.body.removeChild(p);\n };\n }, []);\n\n // Disables window scrolling, if it is not opted-out.\n useEffect(() => {\n if (!dontDisableScrolling) {\n document.body.classList.add(S.scrollingDisabledByModal);\n }\n return () => {\n if (!dontDisableScrolling) {\n document.body.classList.remove(S.scrollingDisabledByModal);\n }\n };\n }, [dontDisableScrolling]);\n\n const focusLast = useMemo(() => (\n <div\n onFocus={() => {\n const elems = containerRef.current?.querySelectorAll('*') as NodeListOf<HTMLElement>;\n for (let i = elems.length - 1; i >= 0; --i) {\n elems[i].focus();\n if (document.activeElement === elems[i]) return;\n }\n overlayRef.current?.focus();\n }}\n /* eslint-disable jsx-a11y/no-noninteractive-tabindex */\n tabIndex={0}\n /* eslint-enable jsx-a11y/no-noninteractive-tabindex */\n />\n ), []);\n\n return portal ? ReactDom.createPortal(\n (\n <>\n {focusLast}\n <div\n aria-label=\"Cancel\"\n className={theme.overlay}\n onClick={() => onCancel && onCancel()}\n onKeyDown={(e) => {\n if (e.key === 'Escape' && onCancel) onCancel();\n }}\n ref={(node) => {\n if (node && node !== overlayRef.current) {\n overlayRef.current = node;\n node.focus();\n }\n }}\n role=\"button\"\n tabIndex={0}\n />\n <div\n aria-modal=\"true\"\n className={theme.container}\n onWheel={(event) => event.stopPropagation()}\n ref={containerRef}\n role=\"dialog\"\n style={containerStyle}\n >\n {children}\n </div>\n <div\n onFocus={() => {\n overlayRef.current?.focus();\n }}\n /* eslint-disable jsx-a11y/no-noninteractive-tabindex */\n tabIndex={0}\n /* eslint-enable jsx-a11y/no-noninteractive-tabindex */\n />\n {focusLast}\n </>\n ),\n portal,\n ) : null;\n};\n\nconst ThemedModal = themed(\n BaseModal,\n 'Modal',\n validThemeKeys,\n baseTheme,\n);\n\nBaseModal.propTypes = {\n children: PT.node,\n containerStyle: PT.shape({}),\n dontDisableScrolling: PT.bool,\n onCancel: PT.func,\n theme: ThemedModal.themeType.isRequired,\n};\n\nBaseModal.defaultProps = {\n children: null,\n containerStyle: undefined,\n dontDisableScrolling: false,\n onCancel: noop,\n};\n\nexport default ThemedModal;\n\n/* Non-themed version of the Modal. */\nexport { BaseModal };\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=require("react");var _propTypes=_interopRequireDefault(require("prop-types"));var _reactThemes=_interopRequireDefault(require("@dr.pogodin/react-themes"));var _jsxRuntime=require("react/jsx-runtime");const defaultTheme={"context":"KVPc7g","ad":"z2GQ0Z","hoc":"_8R1Qdj","container":"dzMVIB","textarea":"zd-OFg","hidden":"GiHBXI"};const validThemeKeys=["container","hidden","textarea"];const TextArea=({onChange,onKeyDown,placeholder,theme,value})=>{const hiddenAreaRef=(0,_react.useRef)(null);const[height,setHeight]=(0,_react.useState)();const[localValue,setLocalValue]=(0,_react.useState)(value||"");if(value!==undefined&&localValue!==value)setLocalValue(value);// This resizes text area's height when its width is changed for any reason.
|
|
1
|
+
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=require("react");var _propTypes=_interopRequireDefault(require("prop-types"));var _reactThemes=_interopRequireDefault(require("@dr.pogodin/react-themes"));var _jsxRuntime=require("react/jsx-runtime");const defaultTheme={"context":"KVPc7g","ad":"z2GQ0Z","hoc":"_8R1Qdj","container":"dzMVIB","textarea":"zd-OFg","hidden":"GiHBXI"};const validThemeKeys=["container","hidden","textarea"];const TextArea=({disabled,onChange,onKeyDown,placeholder,theme,value})=>{const hiddenAreaRef=(0,_react.useRef)(null);const[height,setHeight]=(0,_react.useState)();const[localValue,setLocalValue]=(0,_react.useState)(value||"");if(value!==undefined&&localValue!==value)setLocalValue(value);// This resizes text area's height when its width is changed for any reason.
|
|
2
2
|
(0,_react.useEffect)(()=>{const el=hiddenAreaRef.current;if(!el)return undefined;const cb=()=>{setHeight(el.scrollHeight)};const observer=new ResizeObserver(cb);observer.observe(el);return()=>{observer.disconnect()}},[]);// This resizes the text area when its content is modified.
|
|
3
3
|
(0,_react.useEffect)(()=>{const el=hiddenAreaRef.current;if(el)setHeight(el.scrollHeight)},[localValue]);return/*#__PURE__*/(0,_jsxRuntime.jsxs)("div",{className:theme.container,children:[/*#__PURE__*/(0,_jsxRuntime.jsx)("textarea",{// This text area is hidden underneath the primary one below,
|
|
4
4
|
// and it is used for text measurements, to implement auto-scaling
|
|
5
5
|
// of the primary textarea's height.
|
|
6
|
-
readOnly:true,ref:hiddenAreaRef,className:`${theme.textarea} ${theme.hidden}`,value:localValue}),/*#__PURE__*/(0,_jsxRuntime.jsx)("textarea",{// When value is "undefined" the text area is not-managed, and we should
|
|
6
|
+
readOnly:true,ref:hiddenAreaRef,className:`${theme.textarea} ${theme.hidden}`,value:localValue}),/*#__PURE__*/(0,_jsxRuntime.jsx)("textarea",{disabled:disabled// When value is "undefined" the text area is not-managed, and we should
|
|
7
7
|
// manage it internally for the measurement / resizing functionality
|
|
8
8
|
// to work.
|
|
9
|
-
onChange:value===undefined?e=>{setLocalValue(e.target.value)}:onChange,onKeyDown:onKeyDown,placeholder:placeholder,style:{height},className:theme.textarea,value:localValue})]})};const ThemedTextArea=(0,_reactThemes.default)(TextArea,"TextArea",validThemeKeys,defaultTheme);TextArea.propTypes={onChange:_propTypes.default.func,onKeyDown:_propTypes.default.func,placeholder:_propTypes.default.string,theme:ThemedTextArea.themeType.isRequired,value:_propTypes.default.string};TextArea.defaultProps={onChange:undefined,onKeyDown:undefined,placeholder:"",value:undefined};var _default=exports.default=ThemedTextArea;
|
|
9
|
+
,onChange:value===undefined?e=>{setLocalValue(e.target.value)}:onChange,onKeyDown:onKeyDown,placeholder:placeholder,style:{height},className:theme.textarea,value:localValue})]})};const ThemedTextArea=(0,_reactThemes.default)(TextArea,"TextArea",validThemeKeys,defaultTheme);TextArea.propTypes={disabled:_propTypes.default.bool,onChange:_propTypes.default.func,onKeyDown:_propTypes.default.func,placeholder:_propTypes.default.string,theme:ThemedTextArea.themeType.isRequired,value:_propTypes.default.string};TextArea.defaultProps={disabled:false,onChange:undefined,onKeyDown:undefined,placeholder:"",value:undefined};var _default=exports.default=ThemedTextArea;
|
|
10
10
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["_react","require","_propTypes","_interopRequireDefault","_reactThemes","_jsxRuntime","defaultTheme","validThemeKeys","TextArea","onChange","onKeyDown","placeholder","theme","value","hiddenAreaRef","useRef","height","setHeight","useState","localValue","setLocalValue","undefined","useEffect","el","current","cb","scrollHeight","observer","ResizeObserver","observe","disconnect","jsxs","className","container","children","jsx","readOnly","ref","textarea","hidden","e","target","style","ThemedTextArea","themed","propTypes","PT","func","string","themeType","isRequired","defaultProps","_default","exports","default"],"sources":["../../../../../src/shared/components/TextArea/index.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport PT from 'prop-types';\n\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './style.scss';\n\nconst validThemeKeys = [\n 'container',\n 'hidden',\n 'textarea',\n] as const;\n\ntype Props = {\n onChange?: React.ChangeEventHandler<HTMLTextAreaElement>;\n onKeyDown?: React.KeyboardEventHandler<HTMLTextAreaElement>;\n placeholder?: string;\n theme: Theme<typeof validThemeKeys>;\n value?: string;\n};\n\nconst TextArea: React.FunctionComponent<Props> = ({\n onChange,\n onKeyDown,\n placeholder,\n theme,\n value,\n}) => {\n const hiddenAreaRef = useRef<HTMLTextAreaElement>(null);\n const [height, setHeight] = useState<number | undefined>();\n\n const [localValue, setLocalValue] = useState(value || '');\n if (value !== undefined && localValue !== value) setLocalValue(value);\n\n // This resizes text area's height when its width is changed for any reason.\n useEffect(() => {\n const el = hiddenAreaRef.current;\n if (!el) return undefined;\n\n const cb = () => {\n setHeight(el.scrollHeight);\n };\n const observer = new ResizeObserver(cb);\n observer.observe(el);\n\n return () => {\n observer.disconnect();\n };\n }, []);\n\n // This resizes the text area when its content is modified.\n useEffect(() => {\n const el = hiddenAreaRef.current;\n if (el) setHeight(el.scrollHeight);\n }, [localValue]);\n\n return (\n <div className={theme.container}>\n <textarea\n // This text area is hidden underneath the primary one below,\n // and it is used for text measurements, to implement auto-scaling\n // of the primary textarea's height.\n readOnly\n ref={hiddenAreaRef}\n className={`${theme.textarea} ${theme.hidden}`}\n value={localValue}\n />\n <textarea\n // When value is \"undefined\" the text area is not-managed, and we should\n // manage it internally for the measurement / resizing functionality\n // to work.\n onChange={value === undefined ? ((e) => {\n setLocalValue(e.target.value);\n }) : onChange}\n onKeyDown={onKeyDown}\n placeholder={placeholder}\n style={{ height }}\n className={theme.textarea}\n value={localValue}\n />\n </div>\n );\n};\n\nconst ThemedTextArea = themed(\n TextArea,\n 'TextArea',\n validThemeKeys,\n defaultTheme,\n);\n\nTextArea.propTypes = {\n onChange: PT.func,\n onKeyDown: PT.func,\n placeholder: PT.string,\n theme: ThemedTextArea.themeType.isRequired,\n value: PT.string,\n};\n\nTextArea.defaultProps = {\n onChange: undefined,\n onKeyDown: undefined,\n placeholder: '',\n value: undefined,\n};\n\nexport default ThemedTextArea;\n"],"mappings":"gLAAA,IAAAA,MAAA,CAAAC,OAAA,UACA,IAAAC,UAAA,CAAAC,sBAAA,CAAAF,OAAA,gBAEA,IAAAG,YAAA,CAAAD,sBAAA,CAAAF,OAAA,8BAA8D,IAAAI,WAAA,CAAAJ,OAAA,4BAAAK,YAAA,+GAI9D,KAAM,CAAAC,cAAc,CAAG,CACrB,WAAW,CACX,QAAQ,CACR,UAAU,CACF,
|
|
1
|
+
{"version":3,"file":"index.js","names":["_react","require","_propTypes","_interopRequireDefault","_reactThemes","_jsxRuntime","defaultTheme","validThemeKeys","TextArea","disabled","onChange","onKeyDown","placeholder","theme","value","hiddenAreaRef","useRef","height","setHeight","useState","localValue","setLocalValue","undefined","useEffect","el","current","cb","scrollHeight","observer","ResizeObserver","observe","disconnect","jsxs","className","container","children","jsx","readOnly","ref","textarea","hidden","e","target","style","ThemedTextArea","themed","propTypes","PT","bool","func","string","themeType","isRequired","defaultProps","_default","exports","default"],"sources":["../../../../../src/shared/components/TextArea/index.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport PT from 'prop-types';\n\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './style.scss';\n\nconst validThemeKeys = [\n 'container',\n 'hidden',\n 'textarea',\n] as const;\n\ntype Props = {\n disabled?: boolean;\n onChange?: React.ChangeEventHandler<HTMLTextAreaElement>;\n onKeyDown?: React.KeyboardEventHandler<HTMLTextAreaElement>;\n placeholder?: string;\n theme: Theme<typeof validThemeKeys>;\n value?: string;\n};\n\nconst TextArea: React.FunctionComponent<Props> = ({\n disabled,\n onChange,\n onKeyDown,\n placeholder,\n theme,\n value,\n}) => {\n const hiddenAreaRef = useRef<HTMLTextAreaElement>(null);\n const [height, setHeight] = useState<number | undefined>();\n\n const [localValue, setLocalValue] = useState(value || '');\n if (value !== undefined && localValue !== value) setLocalValue(value);\n\n // This resizes text area's height when its width is changed for any reason.\n useEffect(() => {\n const el = hiddenAreaRef.current;\n if (!el) return undefined;\n\n const cb = () => {\n setHeight(el.scrollHeight);\n };\n const observer = new ResizeObserver(cb);\n observer.observe(el);\n\n return () => {\n observer.disconnect();\n };\n }, []);\n\n // This resizes the text area when its content is modified.\n useEffect(() => {\n const el = hiddenAreaRef.current;\n if (el) setHeight(el.scrollHeight);\n }, [localValue]);\n\n return (\n <div className={theme.container}>\n <textarea\n // This text area is hidden underneath the primary one below,\n // and it is used for text measurements, to implement auto-scaling\n // of the primary textarea's height.\n readOnly\n ref={hiddenAreaRef}\n className={`${theme.textarea} ${theme.hidden}`}\n value={localValue}\n />\n <textarea\n disabled={disabled}\n // When value is \"undefined\" the text area is not-managed, and we should\n // manage it internally for the measurement / resizing functionality\n // to work.\n onChange={value === undefined ? ((e) => {\n setLocalValue(e.target.value);\n }) : onChange}\n onKeyDown={onKeyDown}\n placeholder={placeholder}\n style={{ height }}\n className={theme.textarea}\n value={localValue}\n />\n </div>\n );\n};\n\nconst ThemedTextArea = themed(\n TextArea,\n 'TextArea',\n validThemeKeys,\n defaultTheme,\n);\n\nTextArea.propTypes = {\n disabled: PT.bool,\n onChange: PT.func,\n onKeyDown: PT.func,\n placeholder: PT.string,\n theme: ThemedTextArea.themeType.isRequired,\n value: PT.string,\n};\n\nTextArea.defaultProps = {\n disabled: false,\n onChange: undefined,\n onKeyDown: undefined,\n placeholder: '',\n value: undefined,\n};\n\nexport default ThemedTextArea;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _propTypes=_interopRequireDefault(require("prop-types"));var _qs=_interopRequireDefault(require("qs"));var _reactThemes=_interopRequireDefault(require("@dr.pogodin/react-themes"));var
|
|
1
|
+
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _propTypes=_interopRequireDefault(require("prop-types"));var _qs=_interopRequireDefault(require("qs"));var _reactThemes=_interopRequireDefault(require("@dr.pogodin/react-themes"));var _Throbber=_interopRequireDefault(require("../Throbber"));var _jsxRuntime=require("react/jsx-runtime");const baseTheme={"context":"veKyYi","ad":"r3ABzd","hoc":"YKcPnR","container":"sXHM81","video":"SlV2zw"};const throbberTheme={"context":"dzIcLh","ad":"_5a9XX1","hoc":"_7sH52O","container":"jTxmOX"};const validThemeKeys=["container","video"];/**
|
|
2
2
|
* A component for embeding a YouTube video.
|
|
3
3
|
* @param [props] Component properties.
|
|
4
4
|
* @param [props.autoplay] If `true` the video will start to play
|
|
@@ -14,5 +14,5 @@
|
|
|
14
14
|
* IFrame.
|
|
15
15
|
*/const YouTubeVideo=({autoplay,src,theme,title})=>{const srcParts=src.split("?");let url=srcParts[0];const queryString=srcParts[1];const query=queryString?_qs.default.parse(queryString):{};const videoId=query.v||url.match(/\/([a-zA-Z0-9-_]*)$/)?.[1];url=`https://www.youtube.com/embed/${videoId}`;delete query.v;query.autoplay=autoplay?"1":"0";url+=`?${_qs.default.stringify(query)}`;// TODO: https://developers.google.com/youtube/player_parameters
|
|
16
16
|
// More query parameters can be exposed via the component props.
|
|
17
|
-
return/*#__PURE__*/(0,_jsxRuntime.jsxs)(
|
|
17
|
+
return/*#__PURE__*/(0,_jsxRuntime.jsxs)("div",{className:theme.container,children:[/*#__PURE__*/(0,_jsxRuntime.jsx)(_Throbber.default,{theme:throbberTheme}),/*#__PURE__*/(0,_jsxRuntime.jsx)("iframe",{allow:"autoplay",allowFullScreen:true,className:theme.video,src:url,title:title})]})};const ThemedYouTubeVideo=(0,_reactThemes.default)(YouTubeVideo,"YouTubeVideo",validThemeKeys,baseTheme);YouTubeVideo.propTypes={autoplay:_propTypes.default.bool,src:_propTypes.default.string.isRequired,theme:ThemedYouTubeVideo.themeType.isRequired,title:_propTypes.default.string};YouTubeVideo.defaultProps={autoplay:false,title:""};var _default=exports.default=ThemedYouTubeVideo;
|
|
18
18
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_qs","_reactThemes","
|
|
1
|
+
{"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_qs","_reactThemes","_Throbber","_jsxRuntime","baseTheme","throbberTheme","validThemeKeys","YouTubeVideo","autoplay","src","theme","title","srcParts","split","url","queryString","query","qs","parse","videoId","v","match","stringify","jsxs","className","container","children","jsx","default","allow","allowFullScreen","video","ThemedYouTubeVideo","themed","propTypes","PT","bool","string","isRequired","themeType","defaultProps","_default","exports"],"sources":["../../../../../src/shared/components/YouTubeVideo/index.tsx"],"sourcesContent":["import PT from 'prop-types';\nimport qs from 'qs';\n\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport Throbber from 'components/Throbber';\n\nimport baseTheme from './base.scss';\nimport throbberTheme from './throbber.scss';\n\nconst validThemeKeys = ['container', 'video'] as const;\n\ntype ComponentThemeT = Theme<typeof validThemeKeys>;\n\ntype PropsT = {\n autoplay?: boolean;\n src: string;\n theme: ComponentThemeT,\n title?: string;\n};\n\n/**\n * A component for embeding a YouTube video.\n * @param [props] Component properties.\n * @param [props.autoplay] If `true` the video will start to play\n * automatically once loaded.\n * @param [props.src] URL of the video to play. Can be in any of\n * the following formats, and keeps any additional query parameters understood\n * by the YouTube IFrame player:\n * - `https://www.youtube.com/watch?v=NdF6Rmt6Ado`\n * - `https://youtu.be/NdF6Rmt6Ado`\n * - `https://www.youtube.com/embed/NdF6Rmt6Ado`\n * @param [props.theme] _Ad hoc_ theme.\n * @param [props.title] The `title` attribute to add to the player\n * IFrame.\n */\nconst YouTubeVideo: React.FunctionComponent<PropsT> = ({\n autoplay,\n src,\n theme,\n title,\n}) => {\n const srcParts = src.split('?');\n let url = srcParts[0];\n const queryString = srcParts[1];\n const query = queryString ? qs.parse(queryString) : {};\n\n const videoId = query.v || url.match(/\\/([a-zA-Z0-9-_]*)$/)?.[1];\n url = `https://www.youtube.com/embed/${videoId}`;\n\n delete query.v;\n query.autoplay = autoplay ? '1' : '0';\n url += `?${qs.stringify(query)}`;\n\n // TODO: https://developers.google.com/youtube/player_parameters\n // More query parameters can be exposed via the component props.\n\n return (\n <div className={theme.container}>\n <Throbber theme={throbberTheme} />\n <iframe\n allow=\"autoplay\"\n allowFullScreen\n className={theme.video}\n src={url}\n title={title}\n />\n </div>\n );\n};\n\nconst ThemedYouTubeVideo = themed(\n YouTubeVideo,\n 'YouTubeVideo',\n validThemeKeys,\n baseTheme,\n);\n\nYouTubeVideo.propTypes = {\n autoplay: PT.bool,\n src: PT.string.isRequired,\n theme: ThemedYouTubeVideo.themeType.isRequired,\n title: PT.string,\n};\n\nYouTubeVideo.defaultProps = {\n autoplay: false,\n title: '',\n};\n\nexport default ThemedYouTubeVideo;\n"],"mappings":"gLAAA,IAAAA,UAAA,CAAAC,sBAAA,CAAAC,OAAA,gBACA,IAAAC,GAAA,CAAAF,sBAAA,CAAAC,OAAA,QAEA,IAAAE,YAAA,CAAAH,sBAAA,CAAAC,OAAA,8BAEA,IAAAG,SAAA,CAAAJ,sBAAA,CAAAC,OAAA,iBAA2C,IAAAI,WAAA,CAAAJ,OAAA,4BAAAK,SAAA,+FAAAC,aAAA,0EAK3C,KAAM,CAAAC,cAAc,CAAG,CAAC,WAAW,CAAE,OAAO,CAAU,CAWtD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GACA,KAAM,CAAAC,YAA6C,CAAGA,CAAC,CACrDC,QAAQ,CACRC,GAAG,CACHC,KAAK,CACLC,KACF,CAAC,GAAK,CACJ,KAAM,CAAAC,QAAQ,CAAGH,GAAG,CAACI,KAAK,CAAC,GAAG,CAAC,CAC/B,GAAI,CAAAC,GAAG,CAAGF,QAAQ,CAAC,CAAC,CAAC,CACrB,KAAM,CAAAG,WAAW,CAAGH,QAAQ,CAAC,CAAC,CAAC,CAC/B,KAAM,CAAAI,KAAK,CAAGD,WAAW,CAAGE,WAAE,CAACC,KAAK,CAACH,WAAW,CAAC,CAAG,CAAC,CAAC,CAEtD,KAAM,CAAAI,OAAO,CAAGH,KAAK,CAACI,CAAC,EAAIN,GAAG,CAACO,KAAK,CAAC,qBAAqB,CAAC,GAAG,CAAC,CAAC,CAChEP,GAAG,CAAI,iCAAgCK,OAAQ,EAAC,CAEhD,MAAO,CAAAH,KAAK,CAACI,CAAC,CACdJ,KAAK,CAACR,QAAQ,CAAGA,QAAQ,CAAG,GAAG,CAAG,GAAG,CACrCM,GAAG,EAAK,IAAGG,WAAE,CAACK,SAAS,CAACN,KAAK,CAAE,EAAC,CAEhC;AACA;AAEA,mBACE,GAAAb,WAAA,CAAAoB,IAAA,SAAKC,SAAS,CAAEd,KAAK,CAACe,SAAU,CAAAC,QAAA,eAC9B,GAAAvB,WAAA,CAAAwB,GAAA,EAACzB,SAAA,CAAA0B,OAAQ,EAAClB,KAAK,CAAEL,aAAc,CAAE,CAAC,cAClC,GAAAF,WAAA,CAAAwB,GAAA,YACEE,KAAK,CAAC,UAAU,CAChBC,eAAe,MACfN,SAAS,CAAEd,KAAK,CAACqB,KAAM,CACvBtB,GAAG,CAAEK,GAAI,CACTH,KAAK,CAAEA,KAAM,CACd,CAAC,EACC,CAET,CAAC,CAED,KAAM,CAAAqB,kBAAkB,CAAG,GAAAC,oBAAM,EAC/B1B,YAAY,CACZ,cAAc,CACdD,cAAc,CACdF,SACF,CAAC,CAEDG,YAAY,CAAC2B,SAAS,CAAG,CACvB1B,QAAQ,CAAE2B,kBAAE,CAACC,IAAI,CACjB3B,GAAG,CAAE0B,kBAAE,CAACE,MAAM,CAACC,UAAU,CACzB5B,KAAK,CAAEsB,kBAAkB,CAACO,SAAS,CAACD,UAAU,CAC9C3B,KAAK,CAAEwB,kBAAE,CAACE,MACZ,CAAC,CAED9B,YAAY,CAACiC,YAAY,CAAG,CAC1BhC,QAAQ,CAAE,KAAK,CACfG,KAAK,CAAE,EACT,CAAC,CAAC,IAAA8B,QAAA,CAAAC,OAAA,CAAAd,OAAA,CAEaI,kBAAkB","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});
|
|
1
|
+
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});var _exportNames={Button:true,Checkbox:true,Input:true,Link:true,PageLayout:true,MetaTags:true,Modal:true,BaseModal:true,NavLink:true,Throbber:true,WithTooltip:true,YouTubeVideo:true,TextArea:true};Object.defineProperty(exports,"BaseModal",{enumerable:true,get:function(){return _Modal.BaseModal}});Object.defineProperty(exports,"Button",{enumerable:true,get:function(){return _Button.default}});Object.defineProperty(exports,"Checkbox",{enumerable:true,get:function(){return _Checkbox.default}});Object.defineProperty(exports,"Input",{enumerable:true,get:function(){return _Input.default}});Object.defineProperty(exports,"Link",{enumerable:true,get:function(){return _Link.default}});Object.defineProperty(exports,"MetaTags",{enumerable:true,get:function(){return _MetaTags.default}});Object.defineProperty(exports,"Modal",{enumerable:true,get:function(){return _Modal.default}});Object.defineProperty(exports,"NavLink",{enumerable:true,get:function(){return _NavLink.default}});Object.defineProperty(exports,"PageLayout",{enumerable:true,get:function(){return _PageLayout.default}});Object.defineProperty(exports,"TextArea",{enumerable:true,get:function(){return _TextArea.default}});Object.defineProperty(exports,"Throbber",{enumerable:true,get:function(){return _Throbber.default}});Object.defineProperty(exports,"WithTooltip",{enumerable:true,get:function(){return _WithTooltip.default}});Object.defineProperty(exports,"YouTubeVideo",{enumerable:true,get:function(){return _YouTubeVideo.default}});var _selectors=require("./selectors");Object.keys(_selectors).forEach(function(key){if(key==="default"||key==="__esModule")return;if(Object.prototype.hasOwnProperty.call(_exportNames,key))return;if(key in exports&&exports[key]===_selectors[key])return;Object.defineProperty(exports,key,{enumerable:true,get:function(){return _selectors[key]}})});var _Button=_interopRequireDefault(require("./Button"));var _Checkbox=_interopRequireDefault(require("./Checkbox"));var _Input=_interopRequireDefault(require("./Input"));var _Link=_interopRequireDefault(require("./Link"));var _PageLayout=_interopRequireDefault(require("./PageLayout"));var _MetaTags=_interopRequireDefault(require("./MetaTags"));var _Modal=_interopRequireWildcard(require("./Modal"));var _NavLink=_interopRequireDefault(require("./NavLink"));var _Throbber=_interopRequireDefault(require("./Throbber"));var _WithTooltip=_interopRequireDefault(require("./WithTooltip"));var _YouTubeVideo=_interopRequireDefault(require("./YouTubeVideo"));var _TextArea=_interopRequireDefault(require("./TextArea"));function _getRequireWildcardCache(e){if("function"!=typeof WeakMap)return null;var r=new WeakMap,t=new WeakMap;return(_getRequireWildcardCache=function(e){return e?t:r})(e)}function _interopRequireWildcard(e,r){if(!r&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var t=_getRequireWildcardCache(r);if(t&&t.has(e))return t.get(e);var n={__proto__:null},a=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var u in e)if("default"!==u&&Object.prototype.hasOwnProperty.call(e,u)){var i=a?Object.getOwnPropertyDescriptor(e,u):null;i&&(i.get||i.set)?Object.defineProperty(n,u,i):n[u]=e[u]}return n.default=e,t&&t.set(e,n),n}
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["
|
|
1
|
+
{"version":3,"file":"index.js","names":["_selectors","require","Object","keys","forEach","key","prototype","hasOwnProperty","call","_exportNames","exports","defineProperty","enumerable","get","_Button","_interopRequireDefault","_Checkbox","_Input","_Link","_PageLayout","_MetaTags","_Modal","_interopRequireWildcard","_NavLink","_Throbber","_WithTooltip","_YouTubeVideo","_TextArea","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","n","__proto__","a","getOwnPropertyDescriptor","u","i","set"],"sources":["../../../../src/shared/components/index.ts"],"sourcesContent":["/**\n * Just an aggregation of all exported components into a single module.\n */\n\nexport * from 'components/selectors';\n\nexport { default as Button } from 'components/Button';\nexport { default as Checkbox } from 'components/Checkbox';\nexport { default as Input } from 'components/Input';\nexport { default as Link } from 'components/Link';\nexport { default as PageLayout } from 'components/PageLayout';\nexport { default as MetaTags } from 'components/MetaTags';\nexport { default as Modal, BaseModal } from 'components/Modal';\nexport { default as NavLink } from 'components/NavLink';\nexport { default as Throbber } from 'components/Throbber';\nexport { default as WithTooltip } from 'components/WithTooltip';\nexport { default as YouTubeVideo } from 'components/YouTubeVideo';\n\nexport { default as TextArea } from './TextArea';\n"],"mappings":"wnDAIA,IAAAA,UAAA,CAAAC,OAAA,gBAAAC,MAAA,CAAAC,IAAA,CAAAH,UAAA,EAAAI,OAAA,UAAAC,GAAA,KAAAA,GAAA,cAAAA,GAAA,0BAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAC,YAAA,CAAAJ,GAAA,YAAAA,GAAA,IAAAK,OAAA,EAAAA,OAAA,CAAAL,GAAA,IAAAL,UAAA,CAAAK,GAAA,SAAAH,MAAA,CAAAS,cAAA,CAAAD,OAAA,CAAAL,GAAA,EAAAO,UAAA,MAAAC,GAAA,SAAAA,CAAA,SAAAb,UAAA,CAAAK,GAAA,OAEA,IAAAS,OAAA,CAAAC,sBAAA,CAAAd,OAAA,cACA,IAAAe,SAAA,CAAAD,sBAAA,CAAAd,OAAA,gBACA,IAAAgB,MAAA,CAAAF,sBAAA,CAAAd,OAAA,aACA,IAAAiB,KAAA,CAAAH,sBAAA,CAAAd,OAAA,YACA,IAAAkB,WAAA,CAAAJ,sBAAA,CAAAd,OAAA,kBACA,IAAAmB,SAAA,CAAAL,sBAAA,CAAAd,OAAA,gBACA,IAAAoB,MAAA,CAAAC,uBAAA,CAAArB,OAAA,aACA,IAAAsB,QAAA,CAAAR,sBAAA,CAAAd,OAAA,eACA,IAAAuB,SAAA,CAAAT,sBAAA,CAAAd,OAAA,gBACA,IAAAwB,YAAA,CAAAV,sBAAA,CAAAd,OAAA,mBACA,IAAAyB,aAAA,CAAAX,sBAAA,CAAAd,OAAA,oBAEA,IAAA0B,SAAA,CAAAZ,sBAAA,CAAAd,OAAA,gBAAiD,SAAA2B,yBAAAC,CAAA,wBAAAC,OAAA,iBAAAC,CAAA,KAAAD,OAAA,CAAAE,CAAA,KAAAF,OAAA,QAAAF,wBAAA,SAAAA,CAAAC,CAAA,SAAAA,CAAA,CAAAG,CAAA,CAAAD,CAAA,GAAAF,CAAA,WAAAP,wBAAAO,CAAA,CAAAE,CAAA,MAAAA,CAAA,EAAAF,CAAA,EAAAA,CAAA,CAAAI,UAAA,QAAAJ,CAAA,WAAAA,CAAA,mBAAAA,CAAA,qBAAAA,CAAA,QAAAK,OAAA,CAAAL,CAAA,MAAAG,CAAA,CAAAJ,wBAAA,CAAAG,CAAA,KAAAC,CAAA,EAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,SAAAG,CAAA,CAAAnB,GAAA,CAAAgB,CAAA,MAAAO,CAAA,EAAAC,SAAA,OAAAC,CAAA,CAAApC,MAAA,CAAAS,cAAA,EAAAT,MAAA,CAAAqC,wBAAA,SAAAC,CAAA,IAAAX,CAAA,gBAAAW,CAAA,EAAAtC,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAqB,CAAA,CAAAW,CAAA,OAAAC,CAAA,CAAAH,CAAA,CAAApC,MAAA,CAAAqC,wBAAA,CAAAV,CAAA,CAAAW,CAAA,OAAAC,CAAA,GAAAA,CAAA,CAAA5B,GAAA,EAAA4B,CAAA,CAAAC,GAAA,EAAAxC,MAAA,CAAAS,cAAA,CAAAyB,CAAA,CAAAI,CAAA,CAAAC,CAAA,EAAAL,CAAA,CAAAI,CAAA,EAAAX,CAAA,CAAAW,CAAA,SAAAJ,CAAA,CAAAF,OAAA,CAAAL,CAAA,CAAAG,CAAA,EAAAA,CAAA,CAAAU,GAAA,CAAAb,CAAA,CAAAO,CAAA,EAAAA,CAAA","ignoreList":[]}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _propTypes=_interopRequireDefault(require("prop-types"));var _react=require("react");var _Modal=require("../../../Modal");var _common=require("../../common");var _jsxRuntime=require("react/jsx-runtime");const S={"overlay":"jKsMKG"};const Options=({anchorRect,containerClass,filter,onCancel,onChange,optionClass,options})=>{// Closes the dropdown (cancels the selection) on any page scrolling attempt.
|
|
2
|
+
// This is the same native <select> elements do on scrolling, and at least for
|
|
3
|
+
// now we have no reason to deal with complications needed to support open
|
|
4
|
+
// dropdowns during the scrolling (that would need to re-position it in
|
|
5
|
+
// response to the position changes of the root dropdown element).
|
|
6
|
+
(0,_react.useEffect)(()=>{const listener=()=>{onCancel()};window.addEventListener("scroll",listener);return()=>{window.removeEventListener("scroll",listener)}},[onCancel]);const optionNodes=[];for(let i=0;i<options.length;++i){const option=options[i];if(!filter||filter(option)){const[iValue,iName]=(0,_common.optionValueName)(option);optionNodes.push(/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:optionClass,onClick:()=>onChange(iValue),onKeyDown:e=>{if(e.key==="Enter"){onChange(iValue)}},role:"button",tabIndex:0,children:iName},iValue))}}return/*#__PURE__*/(0,_jsxRuntime.jsx)(_Modal.BaseModal,{containerStyle:{left:anchorRect.left,top:anchorRect.bottom,width:anchorRect.width},dontDisableScrolling:true,onCancel:onCancel,theme:{ad:"",hoc:"",container:containerClass,context:"",overlay:S.overlay},children:optionNodes})};Options.propTypes={anchorRect:_propTypes.default.shape({bottom:_propTypes.default.number.isRequired,left:_propTypes.default.number.isRequired,width:_propTypes.default.number.isRequired}).isRequired,containerClass:_propTypes.default.string.isRequired,filter:_propTypes.default.func,onCancel:_propTypes.default.func.isRequired,onChange:_propTypes.default.func.isRequired,optionClass:_propTypes.default.string.isRequired,options:_common.optionsValidator.isRequired};Options.defaultProps={filter:undefined};var _default=exports.default=Options;
|
|
7
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_react","_Modal","_common","_jsxRuntime","S","Options","anchorRect","containerClass","filter","onCancel","onChange","optionClass","options","useEffect","listener","window","addEventListener","removeEventListener","optionNodes","i","length","option","iValue","iName","optionValueName","push","jsx","className","onClick","onKeyDown","e","key","role","tabIndex","children","BaseModal","containerStyle","left","top","bottom","width","dontDisableScrolling","theme","ad","hoc","container","context","overlay","propTypes","PT","shape","number","isRequired","string","func","optionsValidator","defaultProps","undefined","_default","exports","default"],"sources":["../../../../../../../src/shared/components/selectors/CustomDropdown/Options/index.tsx"],"sourcesContent":["import PT from 'prop-types';\nimport { useEffect } from 'react';\n\nimport { BaseModal } from 'components/Modal';\n\nimport S from './style.scss';\n\nimport {\n type OptionT,\n type OptionsT,\n optionsValidator,\n optionValueName,\n} from '../../common';\n\ntype PropsT = {\n anchorRect: {\n bottom: number;\n left: number;\n width: number;\n };\n containerClass: string;\n filter?: (item: OptionT<React.ReactNode> | string) => boolean;\n optionClass: string;\n options: OptionsT<React.ReactNode>;\n onCancel: () => void;\n onChange: (value: string) => void;\n};\n\nconst Options: React.FunctionComponent<PropsT> = ({\n anchorRect,\n containerClass,\n filter,\n onCancel,\n onChange,\n optionClass,\n options,\n}) => {\n // Closes the dropdown (cancels the selection) on any page scrolling attempt.\n // This is the same native <select> elements do on scrolling, and at least for\n // now we have no reason to deal with complications needed to support open\n // dropdowns during the scrolling (that would need to re-position it in\n // response to the position changes of the root dropdown element).\n useEffect(() => {\n const listener = () => {\n onCancel();\n };\n window.addEventListener('scroll', listener);\n return () => {\n window.removeEventListener('scroll', listener);\n };\n }, [onCancel]);\n\n const optionNodes: React.ReactNode[] = [];\n for (let i = 0; i < options.length; ++i) {\n const option = options[i];\n if (!filter || filter(option)) {\n const [iValue, iName] = optionValueName(option);\n optionNodes.push(\n <div\n className={optionClass}\n onClick={() => onChange(iValue)}\n onKeyDown={(e) => {\n if (e.key === 'Enter') {\n onChange(iValue);\n }\n }}\n key={iValue}\n role=\"button\"\n tabIndex={0}\n >\n {iName}\n </div>,\n );\n }\n }\n\n return (\n <BaseModal\n containerStyle={{\n left: anchorRect.left,\n top: anchorRect.bottom,\n width: anchorRect.width,\n }}\n dontDisableScrolling\n onCancel={onCancel}\n theme={{\n ad: '',\n hoc: '',\n container: containerClass,\n context: '',\n overlay: S.overlay,\n }}\n >\n {optionNodes}\n </BaseModal>\n );\n};\n\nOptions.propTypes = {\n anchorRect: PT.shape({\n bottom: PT.number.isRequired,\n left: PT.number.isRequired,\n width: PT.number.isRequired,\n }).isRequired,\n containerClass: PT.string.isRequired,\n filter: PT.func,\n onCancel: PT.func.isRequired,\n onChange: PT.func.isRequired,\n optionClass: PT.string.isRequired,\n options: optionsValidator.isRequired,\n};\n\nOptions.defaultProps = {\n filter: undefined,\n};\n\nexport default Options;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _propTypes=_interopRequireDefault(require("prop-types"));var _react=require("react");var _reactThemes=_interopRequireDefault(require("@dr.pogodin/react-themes"));var _Options=_interopRequireDefault(require("./Options"));var _common=require("../common");var _jsxRuntime=require("react/jsx-runtime");const defaultTheme={"context":"_9Tod5r","ad":"R58zIg","hoc":"O-Tp1i","container":"oQKv0Y","label":"YUPUNs","dropdown":"pNEyAA","option":"LD2Kzy","select":"LP5azC","arrow":"-wscve","active":"k2UDsV"};const BaseCustomDropdown=({filter,label,onChange,options,theme,value})=>{if(!options)throw Error("Internal error");const dropdownRef=(0,_react.useRef)(null);// If "null" the dropdown is closed, otherwise it is displayed
|
|
2
|
+
// at the specified coordinates.
|
|
3
|
+
const[anchor,setAnchor]=(0,_react.useState)(null);const openList=()=>{setAnchor(dropdownRef.current.getBoundingClientRect())};let selected=/*#__PURE__*/(0,_jsxRuntime.jsx)(_jsxRuntime.Fragment,{children:"\u200C"});for(let i=0;i<options.length;++i){const option=options[i];if(!filter||filter(option)){const[iValue,iName]=(0,_common.optionValueName)(option);if(iValue===value){selected=iName;break}}}let containerClassName=theme.container;if(anchor)containerClassName+=` ${theme.active}`;return/*#__PURE__*/(0,_jsxRuntime.jsxs)("div",{className:containerClassName,children:[label===undefined?null:/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:theme.label,children:label}),/*#__PURE__*/(0,_jsxRuntime.jsxs)("div",{className:theme.dropdown,onClick:openList,onKeyDown:e=>{if(e.key==="Enter")openList()},ref:dropdownRef,role:"listbox",tabIndex:0,children:[selected,/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:theme.arrow})]}),anchor?/*#__PURE__*/(0,_jsxRuntime.jsx)(_Options.default,{anchorRect:anchor,containerClass:theme.select||"",onCancel:()=>setAnchor(null),onChange:newValue=>{setAnchor(null);if(onChange)onChange(newValue)},optionClass:theme.option||"",options:options}):null]})};const ThemedCustomDropdown=(0,_reactThemes.default)(BaseCustomDropdown,"CustomDropdown",_common.validThemeKeys,defaultTheme);BaseCustomDropdown.propTypes={filter:_propTypes.default.func,label:_propTypes.default.node,onChange:_propTypes.default.func,options:_propTypes.default.arrayOf(_common.optionValidator.isRequired),theme:ThemedCustomDropdown.themeType.isRequired,value:_propTypes.default.string};BaseCustomDropdown.defaultProps={filter:undefined,label:undefined,onChange:undefined,options:[],value:undefined};var _default=exports.default=ThemedCustomDropdown;
|
|
4
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_react","_reactThemes","_Options","_common","_jsxRuntime","defaultTheme","BaseCustomDropdown","filter","label","onChange","options","theme","value","Error","dropdownRef","useRef","anchor","setAnchor","useState","openList","current","getBoundingClientRect","selected","jsx","Fragment","children","i","length","option","iValue","iName","optionValueName","containerClassName","container","active","jsxs","className","undefined","dropdown","onClick","onKeyDown","e","key","ref","role","tabIndex","arrow","default","anchorRect","containerClass","select","onCancel","newValue","optionClass","ThemedCustomDropdown","themed","validThemeKeys","propTypes","PT","func","node","arrayOf","optionValidator","isRequired","themeType","string","defaultProps","_default","exports"],"sources":["../../../../../../src/shared/components/selectors/CustomDropdown/index.tsx"],"sourcesContent":["import PT from 'prop-types';\nimport { useRef, useState } from 'react';\n\nimport themed from '@dr.pogodin/react-themes';\n\nimport Options from './Options';\n\nimport defaultTheme from './theme.scss';\n\nimport {\n type PropsT,\n optionValidator,\n optionValueName,\n validThemeKeys,\n} from '../common';\n\nconst BaseCustomDropdown: React.FunctionComponent<\nPropsT<React.ReactNode, (value: string) => void>\n> = ({\n filter,\n label,\n onChange,\n options,\n theme,\n value,\n}) => {\n if (!options) throw Error('Internal error');\n\n const dropdownRef = useRef<HTMLDivElement>(null);\n\n // If \"null\" the dropdown is closed, otherwise it is displayed\n // at the specified coordinates.\n const [anchor, setAnchor] = useState<DOMRect | null>(null);\n\n const openList = () => {\n setAnchor(dropdownRef.current!.getBoundingClientRect());\n };\n\n let selected: React.ReactNode = <>‌</>;\n for (let i = 0; i < options.length; ++i) {\n const option = options[i];\n if (!filter || filter(option)) {\n const [iValue, iName] = optionValueName(option);\n if (iValue === value) {\n selected = iName;\n break;\n }\n }\n }\n\n let containerClassName = theme.container;\n if (anchor) containerClassName += ` ${theme.active}`;\n\n return (\n <div className={containerClassName}>\n {label === undefined ? null : (\n <div className={theme.label}>{label}</div>\n )}\n <div\n className={theme.dropdown}\n onClick={openList}\n onKeyDown={(e) => {\n if (e.key === 'Enter') openList();\n }}\n ref={dropdownRef}\n role=\"listbox\"\n tabIndex={0}\n >\n {selected}\n <div className={theme.arrow} />\n </div>\n {\n anchor ? (\n <Options\n anchorRect={anchor}\n containerClass={theme.select || ''}\n onCancel={() => setAnchor(null)}\n onChange={(newValue) => {\n setAnchor(null);\n if (onChange) onChange(newValue);\n }}\n optionClass={theme.option || ''}\n options={options}\n />\n ) : null\n }\n </div>\n );\n};\n\nconst ThemedCustomDropdown = themed(\n BaseCustomDropdown,\n 'CustomDropdown',\n validThemeKeys,\n defaultTheme,\n);\n\nBaseCustomDropdown.propTypes = {\n filter: PT.func,\n label: PT.node,\n onChange: PT.func,\n options: PT.arrayOf(optionValidator.isRequired),\n theme: ThemedCustomDropdown.themeType.isRequired,\n value: PT.string,\n};\n\nBaseCustomDropdown.defaultProps = {\n filter: undefined,\n label: undefined,\n onChange: undefined,\n options: [],\n value: undefined,\n};\n\nexport default ThemedCustomDropdown;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _propTypes=_interopRequireDefault(require("prop-types"));var _reactThemes=_interopRequireDefault(require("@dr.pogodin/react-themes"));var _common=require("../common");var _jsxRuntime=require("react/jsx-runtime");// Implements dropdown based on the native HTML <select> element.
|
|
2
|
+
const defaultTheme={"context":"xHyZo4","ad":"ADu59e","hoc":"FTP2bb","dropdown":"kI9A9U","arrow":"DubGkT","container":"WtSZPd","active":"ayMn7O","label":"K7JYKw","option":"_27pZ6W","hiddenOption":"clAKFJ","select":"N0Fc14"};/**
|
|
3
|
+
* Implements a themeable dropdown list. Internally it is rendered with help of
|
|
4
|
+
* the standard HTML `<select>` element, thus the styling support is somewhat
|
|
5
|
+
* limited.
|
|
6
|
+
* @param [props] Component properties.
|
|
7
|
+
* @param [props.filter] Options filter function. If provided, only
|
|
8
|
+
* those elements of `options` list will be used by the dropdown, for which this
|
|
9
|
+
* filter returns `true`.
|
|
10
|
+
* @param [props.label] Dropdown label.
|
|
11
|
+
* @param [props.onChange] Selection event handler.
|
|
12
|
+
* @param [props.options=[]] Array of dropdown
|
|
13
|
+
* options. For string elements the option value and name will be the same.
|
|
14
|
+
* It is allowed to mix DropdownOption and string elements in the same option
|
|
15
|
+
* list.
|
|
16
|
+
* @param [props.theme] _Ad hoc_ theme.
|
|
17
|
+
* @param [props.value] Currently selected value.
|
|
18
|
+
* @param [props....]
|
|
19
|
+
* [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties)
|
|
20
|
+
*/const Dropdown=({filter,label,onChange,options,theme,value})=>{if(!options)throw Error("Internal error");let isValidValue=false;const optionElements=[];for(let i=0;i<options.length;++i){const option=options[i];if(!filter||filter(option)){const[iValue,iName]=(0,_common.optionValueName)(option);isValidValue||=iValue===value;optionElements.push(/*#__PURE__*/(0,_jsxRuntime.jsx)("option",{className:theme.option,value:iValue,children:iName},iValue))}}// NOTE: This element represents the current `value` when it does not match
|
|
21
|
+
// any valid option. In Chrome, and some other browsers, we are able to hide
|
|
22
|
+
// it from the opened dropdown; in others, e.g. Safari, the best we can do is
|
|
23
|
+
// to show it as disabled.
|
|
24
|
+
const hiddenOption=isValidValue?null:/*#__PURE__*/(0,_jsxRuntime.jsx)("option",{disabled:true,className:theme.hiddenOption,value:value,children:value},"__reactUtilsHiddenOption");return/*#__PURE__*/(0,_jsxRuntime.jsxs)("div",{className:theme.container,children:[label===undefined?null:/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:theme.label,children:label}),/*#__PURE__*/(0,_jsxRuntime.jsxs)("div",{className:theme.dropdown,children:[/*#__PURE__*/(0,_jsxRuntime.jsxs)("select",{className:theme.select,onChange:onChange,value:value,children:[hiddenOption,optionElements]}),/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:theme.arrow})]})]})};const ThemedDropdown=(0,_reactThemes.default)(Dropdown,"Dropdown",_common.validThemeKeys,defaultTheme);Dropdown.propTypes={filter:_propTypes.default.func,label:_propTypes.default.node,onChange:_propTypes.default.func,options:_common.optionsValidator,theme:ThemedDropdown.themeType.isRequired,value:_propTypes.default.string};Dropdown.defaultProps={filter:undefined,label:undefined,onChange:undefined,options:[],value:""};var _default=exports.default=ThemedDropdown;
|
|
25
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_reactThemes","_common","_jsxRuntime","defaultTheme","Dropdown","filter","label","onChange","options","theme","value","Error","isValidValue","optionElements","i","length","option","iValue","iName","optionValueName","push","jsx","className","children","hiddenOption","disabled","jsxs","container","undefined","dropdown","select","arrow","ThemedDropdown","themed","validThemeKeys","propTypes","PT","func","node","optionsValidator","themeType","isRequired","string","defaultProps","_default","exports","default"],"sources":["../../../../../../src/shared/components/selectors/NativeDropdown/index.tsx"],"sourcesContent":["// Implements dropdown based on the native HTML <select> element.\n\nimport PT from 'prop-types';\n\nimport themed from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './theme.scss';\n\nimport {\n type PropsT,\n optionsValidator,\n optionValueName,\n validThemeKeys,\n} from '../common';\n\n/**\n * Implements a themeable dropdown list. Internally it is rendered with help of\n * the standard HTML `<select>` element, thus the styling support is somewhat\n * limited.\n * @param [props] Component properties.\n * @param [props.filter] Options filter function. If provided, only\n * those elements of `options` list will be used by the dropdown, for which this\n * filter returns `true`.\n * @param [props.label] Dropdown label.\n * @param [props.onChange] Selection event handler.\n * @param [props.options=[]] Array of dropdown\n * options. For string elements the option value and name will be the same.\n * It is allowed to mix DropdownOption and string elements in the same option\n * list.\n * @param [props.theme] _Ad hoc_ theme.\n * @param [props.value] Currently selected value.\n * @param [props....]\n * [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties)\n */\nconst Dropdown: React.FunctionComponent<PropsT<string>> = ({\n filter,\n label,\n onChange,\n options,\n theme,\n value,\n}) => {\n if (!options) throw Error('Internal error');\n\n let isValidValue = false;\n const optionElements = [];\n\n for (let i = 0; i < options.length; ++i) {\n const option = options[i];\n if (!filter || filter(option)) {\n const [iValue, iName] = optionValueName(option);\n isValidValue ||= iValue === value;\n optionElements.push(\n <option className={theme.option} key={iValue} value={iValue}>\n {iName}\n </option>,\n );\n }\n }\n\n // NOTE: This element represents the current `value` when it does not match\n // any valid option. In Chrome, and some other browsers, we are able to hide\n // it from the opened dropdown; in others, e.g. Safari, the best we can do is\n // to show it as disabled.\n const hiddenOption = isValidValue ? null : (\n <option\n disabled\n className={theme.hiddenOption}\n key=\"__reactUtilsHiddenOption\"\n value={value}\n >\n {value}\n </option>\n );\n\n return (\n <div className={theme.container}>\n { label === undefined ? null : <div className={theme.label}>{label}</div> }\n <div className={theme.dropdown}>\n <select\n className={theme.select}\n onChange={onChange}\n value={value}\n >\n {hiddenOption}\n {optionElements}\n </select>\n <div className={theme.arrow} />\n </div>\n </div>\n );\n};\n\nconst ThemedDropdown = themed(\n Dropdown,\n 'Dropdown',\n validThemeKeys,\n defaultTheme,\n);\n\nDropdown.propTypes = {\n filter: PT.func,\n label: PT.node,\n onChange: PT.func,\n options: optionsValidator,\n theme: ThemedDropdown.themeType.isRequired,\n value: PT.string,\n};\n\nDropdown.defaultProps = {\n filter: undefined,\n label: undefined,\n onChange: undefined,\n options: [],\n value: '',\n};\n\nexport default ThemedDropdown;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _propTypes=_interopRequireDefault(require("prop-types"));var _reactThemes=_interopRequireDefault(require("@dr.pogodin/react-themes"));var _common=require("../common");var _jsxRuntime=require("react/jsx-runtime");const defaultTheme={"context":"VMHfnP","ad":"HNliRC","hoc":"_2Ue-db","container":"AWNvRj","option":"fUfIAd","selected":"Wco-qk","switch":"HR5LN5"};const validThemeKeys=["container","label","option","selected","switch"];const BaseSwitch=({label,onChange,options,theme,value})=>{if(!options||!theme.option)throw Error("Internal error");const optionNodes=[];for(let i=0;i<options?.length;++i){const[iValue,iName]=(0,_common.optionValueName)(options[i]);let className=theme.option;let onPress;if(iValue===value)className+=` ${theme.selected}`;else if(onChange)onPress=()=>onChange(iValue);optionNodes.push(onPress?/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:className,onClick:onPress,onKeyDown:e=>{if(onPress&&e.key==="Enter")onPress()},role:"button",tabIndex:0,children:iName},iValue):/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:className,children:iName},iValue))}return/*#__PURE__*/(0,_jsxRuntime.jsxs)("div",{className:theme.container,children:[label?/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:theme.label,children:label}):null,/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:theme.switch,children:optionNodes})]})};const ThemedSwitch=(0,_reactThemes.default)(BaseSwitch,"Switch",validThemeKeys,defaultTheme);BaseSwitch.propTypes={label:_propTypes.default.node,onChange:_propTypes.default.func,options:_common.optionsValidator,theme:ThemedSwitch.themeType.isRequired,value:_propTypes.default.string};BaseSwitch.defaultProps={label:undefined,onChange:undefined,options:[],value:undefined};var _default=exports.default=ThemedSwitch;
|
|
2
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_reactThemes","_common","_jsxRuntime","defaultTheme","validThemeKeys","BaseSwitch","label","onChange","options","theme","value","option","Error","optionNodes","i","length","iValue","iName","optionValueName","className","onPress","selected","push","jsx","onClick","onKeyDown","e","key","role","tabIndex","children","jsxs","container","switch","ThemedSwitch","themed","propTypes","PT","node","func","optionsValidator","themeType","isRequired","string","defaultProps","undefined","_default","exports","default"],"sources":["../../../../../../src/shared/components/selectors/Switch/index.tsx"],"sourcesContent":["import PT from 'prop-types';\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport { type OptionsT, optionsValidator, optionValueName } from '../common';\n\nimport defaultTheme from './theme.scss';\n\nconst validThemeKeys = [\n 'container',\n 'label',\n 'option',\n 'selected',\n 'switch',\n] as const;\n\ntype PropsT = {\n label?: React.ReactNode;\n onChange?: (value: string) => void;\n options?: Readonly<OptionsT<React.ReactNode>>;\n theme: Theme<typeof validThemeKeys>;\n value?: string;\n};\n\nconst BaseSwitch: React.FunctionComponent<PropsT> = ({\n label,\n onChange,\n options,\n theme,\n value,\n}) => {\n if (!options || !theme.option) throw Error('Internal error');\n\n const optionNodes: React.ReactNode[] = [];\n for (let i = 0; i < options?.length; ++i) {\n const [iValue, iName] = optionValueName(options[i]);\n\n let className: string = theme.option;\n let onPress: (() => void) | undefined;\n if (iValue === value) className += ` ${theme.selected}`;\n else if (onChange) onPress = () => onChange(iValue);\n\n optionNodes.push(\n onPress ? (\n <div\n className={className}\n onClick={onPress}\n onKeyDown={(e) => {\n if (onPress && e.key === 'Enter') onPress();\n }}\n key={iValue}\n role=\"button\"\n tabIndex={0}\n >\n {iName}\n </div>\n ) : (\n <div className={className} key={iValue}>{iName}</div>\n ),\n );\n }\n\n return (\n <div className={theme.container}>\n {label ? <div className={theme.label}>{label}</div> : null}\n <div className={theme.switch}>\n {optionNodes}\n </div>\n </div>\n );\n};\n\nconst ThemedSwitch = themed(\n BaseSwitch,\n 'Switch',\n validThemeKeys,\n defaultTheme,\n);\n\nBaseSwitch.propTypes = {\n label: PT.node,\n onChange: PT.func,\n options: optionsValidator,\n theme: ThemedSwitch.themeType.isRequired,\n value: PT.string,\n};\n\nBaseSwitch.defaultProps = {\n label: undefined,\n onChange: undefined,\n options: [],\n value: undefined,\n};\n\nexport default ThemedSwitch;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.optionValidator=void 0;exports.optionValueName=optionValueName;exports.validThemeKeys=exports.optionsValidator=void 0;var _propTypes=_interopRequireDefault(require("prop-types"));// The stuff common between different dropdown implementations.
|
|
2
|
+
const validThemeKeys=exports.validThemeKeys=["active","arrow","container","dropdown","hiddenOption","label","option","select"];const optionValidator=exports.optionValidator=_propTypes.default.oneOfType([_propTypes.default.shape({name:_propTypes.default.string,value:_propTypes.default.string.isRequired}).isRequired,_propTypes.default.string.isRequired]);const optionsValidator=exports.optionsValidator=_propTypes.default.arrayOf(optionValidator.isRequired);/** Returns option value and name as a tuple. */function optionValueName(option){return typeof option==="string"?[option,option]:[option.value,option.name??option.value]}
|
|
3
|
+
//# sourceMappingURL=common.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"common.js","names":["_propTypes","_interopRequireDefault","require","validThemeKeys","exports","optionValidator","PT","oneOfType","shape","name","string","value","isRequired","optionsValidator","arrayOf","optionValueName","option"],"sources":["../../../../../src/shared/components/selectors/common.ts"],"sourcesContent":["// The stuff common between different dropdown implementations.\n\nimport PT from 'prop-types';\n\nimport type { Theme } from '@dr.pogodin/react-themes';\n\nexport const validThemeKeys = [\n 'active',\n 'arrow',\n 'container',\n 'dropdown',\n 'hiddenOption',\n 'label',\n 'option',\n 'select',\n] as const;\n\nexport type OptionT<NameT> = {\n name?: NameT | null;\n value: string;\n};\n\nexport type OptionsT<NameT> = Array<OptionT<NameT> | string>;\n\nexport type PropsT<\n NameT,\n OnChangeT = React.ChangeEventHandler<HTMLSelectElement>,\n> = {\n filter?: (item: OptionT<NameT> | string) => boolean;\n label?: React.ReactNode;\n onChange?: OnChangeT;\n options?: OptionsT<NameT>;\n theme: Theme<typeof validThemeKeys>;\n value?: string;\n};\n\nexport const optionValidator = PT.oneOfType([\n PT.shape({\n name: PT.string,\n value: PT.string.isRequired,\n }).isRequired,\n PT.string.isRequired,\n]);\n\nexport const optionsValidator = PT.arrayOf(optionValidator.isRequired);\n\n/** Returns option value and name as a tuple. */\nexport function optionValueName<NameT>(\n option: OptionT<NameT> | string,\n): [string, NameT | string] {\n return typeof option === 'string'\n ? [option, option]\n : [option.value, option.name ?? option.value];\n}\n"],"mappings":"uRAEA,IAAAA,UAAA,CAAAC,sBAAA,CAAAC,OAAA,gBAFA;AAMO,KAAM,CAAAC,cAAc,CAAAC,OAAA,CAAAD,cAAA,CAAG,CAC5B,QAAQ,CACR,OAAO,CACP,WAAW,CACX,UAAU,CACV,cAAc,CACd,OAAO,CACP,QAAQ,CACR,QAAQ,CACA,CAqBH,KAAM,CAAAE,eAAe,CAAAD,OAAA,CAAAC,eAAA,CAAGC,kBAAE,CAACC,SAAS,CAAC,CAC1CD,kBAAE,CAACE,KAAK,CAAC,CACPC,IAAI,CAAEH,kBAAE,CAACI,MAAM,CACfC,KAAK,CAAEL,kBAAE,CAACI,MAAM,CAACE,UACnB,CAAC,CAAC,CAACA,UAAU,CACbN,kBAAE,CAACI,MAAM,CAACE,UAAU,CACrB,CAAC,CAEK,KAAM,CAAAC,gBAAgB,CAAAT,OAAA,CAAAS,gBAAA,CAAGP,kBAAE,CAACQ,OAAO,CAACT,eAAe,CAACO,UAAU,CAAC,CAEtE,gDACO,QAAS,CAAAG,eAAeA,CAC7BC,MAA+B,CACL,CAC1B,MAAO,OAAO,CAAAA,MAAM,GAAK,QAAQ,CAC7B,CAACA,MAAM,CAAEA,MAAM,CAAC,CAChB,CAACA,MAAM,CAACL,KAAK,CAAEK,MAAM,CAACP,IAAI,EAAIO,MAAM,CAACL,KAAK,CAChD","ignoreList":[]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"CustomDropdown",{enumerable:true,get:function(){return _CustomDropdown.default}});Object.defineProperty(exports,"Dropdown",{enumerable:true,get:function(){return _NativeDropdown.default}});Object.defineProperty(exports,"Switch",{enumerable:true,get:function(){return _Switch.default}});var _CustomDropdown=_interopRequireDefault(require("./CustomDropdown"));var _NativeDropdown=_interopRequireDefault(require("./NativeDropdown"));var _Switch=_interopRequireDefault(require("./Switch"));
|
|
2
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["_CustomDropdown","_interopRequireDefault","require","_NativeDropdown","_Switch"],"sources":["../../../../../src/shared/components/selectors/index.ts"],"sourcesContent":["export { default as CustomDropdown } from './CustomDropdown';\nexport { default as Dropdown } from './NativeDropdown';\nexport { default as Switch } from './Switch';\n"],"mappings":"sdAAA,IAAAA,eAAA,CAAAC,sBAAA,CAAAC,OAAA,sBACA,IAAAC,eAAA,CAAAF,sBAAA,CAAAC,OAAA,sBACA,IAAAE,OAAA,CAAAH,sBAAA,CAAAC,OAAA","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{border:0;font:inherit;font-size:100%;margin:0;padding:0;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:"";content:none}table{border-collapse:collapse;border-spacing:0}body{text-rendering:auto}*{box-sizing:border-box}.zH52sA[disabled]{cursor:not-allowed}.E1FNQT,.KM0v4f.E1FNQT,._3jm1-Q._0plpDL.E1FNQT{background-image:linear-gradient(0deg,#d3d3d3,#fff 50%,#fff);border:1px solid gray;border-radius:.3em;color:inherit;cursor:pointer;display:inline-block;font:inherit;margin:.1em;padding:.3em 1.2em;text-align:center;text-decoration:none}.E1FNQT:visited,.KM0v4f.E1FNQT:visited,._3jm1-Q._0plpDL.E1FNQT:visited{color:inherit}.E1FNQT.MAe9O6,.E1FNQT:active,.KM0v4f.E1FNQT.MAe9O6,.KM0v4f.E1FNQT:active,._3jm1-Q._0plpDL.E1FNQT.MAe9O6,._3jm1-Q._0plpDL.E1FNQT:active{background-image:linear-gradient(180deg,#d3d3d3,#fff 50%,#fff);border-color:gray;box-shadow:inset 0 1px 3px 0 #d3d3d3}.E1FNQT:focus,.KM0v4f.E1FNQT:focus,._3jm1-Q._0plpDL.E1FNQT:focus{border-color:blue;box-shadow:0 0 3px 1px #add8e6;outline:none}.Br9IWV,.KM0v4f.Br9IWV,._3jm1-Q._0plpDL.Br9IWV{cursor:not-allowed;opacity:.33}.Br9IWV.MAe9O6,.Br9IWV:active,.KM0v4f.Br9IWV.MAe9O6,.KM0v4f.Br9IWV:active,._3jm1-Q._0plpDL.Br9IWV.MAe9O6,._3jm1-Q._0plpDL.Br9IWV:active{background-image:linear-gradient(0deg,#d3d3d3,#fff 50%,#fff);box-shadow:none}.A-f8qJ,.dNQcC6.A-f8qJ,.earXxa.qAPfQ6.A-f8qJ{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;border:1px solid gray;border-radius:.3em;cursor:pointer;font:inherit;height:1.5em;margin:0;outline:none;width:1.5em}.A-f8qJ:checked:after,.dNQcC6.A-f8qJ:checked:after,.earXxa.qAPfQ6.A-f8qJ:checked:after{background:#000;border-radius:.3em;content:"";display:block;height:1em;margin:.2em;width:1em}.A-f8qJ:focus,.dNQcC6.A-f8qJ:focus,.earXxa.qAPfQ6.A-f8qJ:focus{border-color:blue;box-shadow:0 0 3px 1px #add8e6}.Kr0g3M,.dNQcC6.Kr0g3M,.earXxa.qAPfQ6.Kr0g3M{align-items:center;display:inline-flex;margin:.1em}._3dML-O,.dNQcC6._3dML-O,.earXxa.qAPfQ6._3dML-O{margin:0 .6em 0 1.5em}
|
|
1
|
+
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{border:0;font:inherit;font-size:100%;margin:0;padding:0;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:"";content:none}table{border-collapse:collapse;border-spacing:0}body{text-rendering:auto}*{box-sizing:border-box}.Ah-Nsc.Wki41G.ye2BZo,.Szmbbz.ye2BZo,.ye2BZo{background:#eee;height:100%;left:0;opacity:.8;position:fixed;top:0;width:100%;z-index:998}.Ah-Nsc.Wki41G.ye2BZo:focus,.Szmbbz.ye2BZo:focus,.ye2BZo:focus{outline:none}.Ah-Nsc.Wki41G.gyZ4rc,.Szmbbz.gyZ4rc,.gyZ4rc{background:#fff;border-radius:.3em;box-shadow:0 0 14px 1px rgba(38,38,40,.15);left:50%;max-height:95vh;max-width:1024px;overflow:hidden;padding:.6em 1.2em;position:fixed;top:50%;transform:translate(-50%,-50%);width:480px;z-index:999}@media(max-width:1280px){.Ah-Nsc.Wki41G.gyZ4rc,.Szmbbz.gyZ4rc,.gyZ4rc{max-width:95vw}}._5fRFtF{overflow:hidden}.jKsMKG{inset:0;opacity:.2;position:fixed;z-index:1000}.R58zIg.O-Tp1i.oQKv0Y,._9Tod5r.oQKv0Y,.oQKv0Y{align-items:center;display:inline-flex;margin:.1em;position:relative}.R58zIg.O-Tp1i.YUPUNs,.YUPUNs,._9Tod5r.YUPUNs{margin:0 .6em 0 1.2em}.R58zIg.O-Tp1i.pNEyAA,._9Tod5r.pNEyAA,.pNEyAA{border:1px solid gray;border-radius:.3em;cursor:pointer;min-width:200px;outline:none;padding:.3em 3em .3em .6em;position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none}.R58zIg.O-Tp1i.pNEyAA:focus,._9Tod5r.pNEyAA:focus,.pNEyAA:focus{border-color:blue;box-shadow:0 0 3px 1px #add8e6}.LD2Kzy,.R58zIg.O-Tp1i.LD2Kzy,._9Tod5r.LD2Kzy{cursor:pointer;outline:none;padding:0 .6em}.LD2Kzy:focus,.LD2Kzy:hover,.R58zIg.O-Tp1i.LD2Kzy:focus,.R58zIg.O-Tp1i.LD2Kzy:hover,._9Tod5r.LD2Kzy:focus,._9Tod5r.LD2Kzy:hover{background:#4169e1;color:#fff}.LP5azC,.R58zIg.O-Tp1i.LP5azC,._9Tod5r.LP5azC{background:#fff;border:1px solid gray;border-radius:0 0 .3em .3em;border-top:none;box-shadow:0 6px 12px 3px #d3d3d3;left:10px;position:fixed;top:20px;z-index:1001}.-wscve,.R58zIg.O-Tp1i.-wscve,._9Tod5r.-wscve{background-image:linear-gradient(0deg,#d3d3d3,#fff 50%,#fff);border-left:1px solid gray;border-radius:0 .3em .3em 0;bottom:0;padding:.3em .6em;position:absolute;right:0;top:0}.-wscve:after,.R58zIg.O-Tp1i.-wscve:after,._9Tod5r.-wscve:after{content:"▼"}.R58zIg.O-Tp1i.k2UDsV .-wscve,._9Tod5r.k2UDsV .-wscve,.k2UDsV .-wscve{border-radius:0 .3em 0 0}.R58zIg.O-Tp1i.k2UDsV .pNEyAA,._9Tod5r.k2UDsV .pNEyAA,.k2UDsV .pNEyAA{border-color:blue;border-radius:.3em .3em 0 0}.ADu59e.FTP2bb.kI9A9U,.kI9A9U,.xHyZo4.kI9A9U{position:relative}.ADu59e.FTP2bb.DubGkT,.DubGkT,.xHyZo4.DubGkT{background-image:linear-gradient(0deg,#d3d3d3,#fff 50%,#fff);border:1px solid gray;border-radius:0 .3em .3em 0;bottom:0;padding:.3em .6em;pointer-events:none;position:absolute;right:0;top:0}.ADu59e.FTP2bb.DubGkT:after,.DubGkT:after,.xHyZo4.DubGkT:after{content:"▼"}.ADu59e.FTP2bb.WtSZPd,.WtSZPd,.xHyZo4.WtSZPd{align-items:center;display:inline-flex;margin:.1em;position:relative}.ayMn7O+.ADu59e.FTP2bb.DubGkT,.ayMn7O+.DubGkT,.ayMn7O+.xHyZo4.DubGkT,:active+.ADu59e.FTP2bb.DubGkT,:active+.DubGkT,:active+.xHyZo4.DubGkT{background-image:linear-gradient(180deg,#d3d3d3,#fff 50%,#fff);border-bottom-right-radius:0}:focus+.ADu59e.FTP2bb.DubGkT,:focus+.DubGkT,:focus+.xHyZo4.DubGkT{border-color:blue blue blue gray}.ADu59e.FTP2bb.K7JYKw,.K7JYKw,.xHyZo4.K7JYKw{margin:0 .6em 0 1.5em}.ADu59e.FTP2bb.clAKFJ,.clAKFJ,.xHyZo4.clAKFJ{display:none}.ADu59e.FTP2bb.N0Fc14,.N0Fc14,.xHyZo4.N0Fc14{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;border:1px solid gray;border-radius:.3em;color:inherit;cursor:pointer;display:inline-block;font:inherit;outline:none;padding:.3em 3.3em calc(.3em + 1px) 1.2em}.ADu59e.FTP2bb.N0Fc14:active,.N0Fc14:active,.xHyZo4.N0Fc14:active{background:#fff;border-bottom-left-radius:0;border-bottom-right-radius:0}.ADu59e.FTP2bb.N0Fc14:focus,.N0Fc14:focus,.xHyZo4.N0Fc14:focus{border-color:blue;box-shadow:0 0 3px 1px #add8e6}.AWNvRj,.HNliRC._2Ue-db.AWNvRj,.VMHfnP.AWNvRj{align-items:center;display:flex;gap:.6em}.HNliRC._2Ue-db.fUfIAd,.VMHfnP.fUfIAd,.fUfIAd{border:1px solid transparent;border-radius:.3em;cursor:pointer;outline:none;padding:0 .9em}.HNliRC._2Ue-db.fUfIAd:focus,.VMHfnP.fUfIAd:focus,.fUfIAd:focus{border-color:blue;box-shadow:0 0 3px 1px #add8e6}.HNliRC._2Ue-db.Wco-qk,.VMHfnP.Wco-qk,.Wco-qk{background:#fff;border:1px solid gray;cursor:default}.HNliRC._2Ue-db.HR5LN5,.HR5LN5,.VMHfnP.HR5LN5{align-items:center;background:#f5f5f5;border:1px solid gray;border-radius:.3em;display:flex;gap:.3em;padding:.3em;-webkit-user-select:none;-moz-user-select:none;user-select:none}.zH52sA[disabled]{cursor:not-allowed}.E1FNQT,.KM0v4f.E1FNQT,._3jm1-Q._0plpDL.E1FNQT{background-image:linear-gradient(0deg,#d3d3d3,#fff 50%,#fff);border:1px solid gray;border-radius:.3em;color:inherit;cursor:pointer;display:inline-block;font:inherit;margin:.1em;padding:.3em 1.2em;text-align:center;text-decoration:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.E1FNQT:visited,.KM0v4f.E1FNQT:visited,._3jm1-Q._0plpDL.E1FNQT:visited{color:inherit}.E1FNQT.MAe9O6,.E1FNQT:active,.KM0v4f.E1FNQT.MAe9O6,.KM0v4f.E1FNQT:active,._3jm1-Q._0plpDL.E1FNQT.MAe9O6,._3jm1-Q._0plpDL.E1FNQT:active{background-image:linear-gradient(180deg,#d3d3d3,#fff 50%,#fff);border-color:gray;box-shadow:inset 0 1px 3px 0 #d3d3d3}.E1FNQT:focus,.KM0v4f.E1FNQT:focus,._3jm1-Q._0plpDL.E1FNQT:focus{border-color:blue;box-shadow:0 0 3px 1px #add8e6;outline:none}.Br9IWV,.KM0v4f.Br9IWV,._3jm1-Q._0plpDL.Br9IWV{cursor:not-allowed;opacity:.33}.Br9IWV.MAe9O6,.Br9IWV:active,.KM0v4f.Br9IWV.MAe9O6,.KM0v4f.Br9IWV:active,._3jm1-Q._0plpDL.Br9IWV.MAe9O6,._3jm1-Q._0plpDL.Br9IWV:active{background-image:linear-gradient(0deg,#d3d3d3,#fff 50%,#fff);box-shadow:none}.A-f8qJ,.dNQcC6.A-f8qJ,.earXxa.qAPfQ6.A-f8qJ{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;border:1px solid gray;border-radius:.3em;cursor:pointer;font:inherit;height:1.5em;margin:0;outline:none;width:1.5em}.A-f8qJ:checked:after,.dNQcC6.A-f8qJ:checked:after,.earXxa.qAPfQ6.A-f8qJ:checked:after{background:#000;border-radius:.3em;content:"";display:block;height:1em;margin:.2em;width:1em}.A-f8qJ:focus,.dNQcC6.A-f8qJ:focus,.earXxa.qAPfQ6.A-f8qJ:focus{border-color:blue;box-shadow:0 0 3px 1px #add8e6}.Kr0g3M,.dNQcC6.Kr0g3M,.earXxa.qAPfQ6.Kr0g3M{align-items:center;display:inline-flex;margin:.1em}._3dML-O,.dNQcC6._3dML-O,.earXxa.qAPfQ6._3dML-O{margin:0 .6em 0 1.5em}.Cxx397,.X5WszA.Cxx397,._8s7GCr.TVlBYc.Cxx397{align-items:center;display:inline-flex;margin:.1em}.M07d4s,.X5WszA.M07d4s,._8s7GCr.TVlBYc.M07d4s{border:1px solid gray;border-radius:.3em;cursor:text;font:inherit;outline:none;padding:.3em .3em calc(.3em + 1px)}.M07d4s:focus,.X5WszA.M07d4s:focus,._8s7GCr.TVlBYc.M07d4s:focus{border-color:blue;box-shadow:0 0 3px 1px #add8e6}.X5WszA.gfbdq-,._8s7GCr.TVlBYc.gfbdq-,.gfbdq-{margin:0 .6em 0 1.5em}.T3cuHB,.m3-mdC.J15Z4H.T3cuHB,.m4mL-M.T3cuHB{display:flex;min-height:100vh;overflow:hidden;width:100%}.m3-mdC.J15Z4H.pPlQO2,.m4mL-M.pPlQO2,.pPlQO2{overflow:hidden;padding:1.2em;width:1024px}.lqNh4h,.m3-mdC.J15Z4H.lqNh4h,.m4mL-M.lqNh4h{flex:1;overflow:hidden}.XIxe9o.YOyORH._7zdld4,._7zdld4,.uIObt7._7zdld4{display:inline-block}.XIxe9o.YOyORH.dBrB4g,.dBrB4g,.uIObt7.dBrB4g{animation:TJe-6j .4s ease-in infinite alternate;background:#000;border-radius:.3em;display:inline-block;height:.6em;margin:0 .1em;position:relative;width:.6em}@keyframes TJe-6j{0%{top:-.3em}to{top:.3em}}.XIxe9o.YOyORH.dBrB4g:first-child,.dBrB4g:first-child,.uIObt7.dBrB4g:first-child{animation-delay:-.2s}.XIxe9o.YOyORH.dBrB4g:last-child,.dBrB4g:last-child,.uIObt7.dBrB4g:last-child{animation-delay:.2s}@keyframes L4ubm-{0%{opacity:0}to{opacity:1}}.GdZucr.M9gywF,.M9gywF,._4xT7zE.zd-vnH.M9gywF{border:.6em solid gray;height:0;pointer-events:none;position:absolute;width:0}.GdZucr.f9gY8K,._4xT7zE.zd-vnH.f9gY8K,.f9gY8K{animation:L4ubm- .6s;background:gray;border-radius:.3em;color:#fff;display:inline-block;left:0;padding:0 .3em;position:absolute;top:0}.GdZucr._4qDBRM,._4qDBRM,._4xT7zE.zd-vnH._4qDBRM{display:inline-block}* .sXHM81,.r3ABzd.YKcPnR .sXHM81,.veKyYi .sXHM81{aspect-ratio:16/9;background:#f5f5f5;position:relative}* .SlV2zw,.r3ABzd.YKcPnR .SlV2zw,.veKyYi .SlV2zw{height:100%;position:absolute;width:100%}* .jTxmOX,._5a9XX1._7sH52O .jTxmOX,.dzIcLh .jTxmOX{position:absolute;text-align:center;top:40%;transform:translateY(50%);width:100%}.KVPc7g.dzMVIB,.dzMVIB,.z2GQ0Z._8R1Qdj.dzMVIB{margin:.1em;position:relative}.KVPc7g.zd-OFg,.z2GQ0Z._8R1Qdj.zd-OFg,.zd-OFg{background:#fff;border:1px solid gray;border-radius:.3em;box-sizing:border-box;font:inherit;height:0;outline:none;overflow:hidden;padding:.3em .3em calc(.3em + 1px);resize:none}.KVPc7g.zd-OFg:focus,.z2GQ0Z._8R1Qdj.zd-OFg:focus,.zd-OFg:focus{border-color:blue;box-shadow:0 0 3px 1px #add8e6}.KVPc7g.zd-OFg::-moz-placeholder,.z2GQ0Z._8R1Qdj.zd-OFg::-moz-placeholder,.zd-OFg::-moz-placeholder{color:gray}.KVPc7g.zd-OFg::placeholder,.z2GQ0Z._8R1Qdj.zd-OFg::placeholder,.zd-OFg::placeholder{color:gray}.KVPc7g.zd-OFg:disabled,.z2GQ0Z._8R1Qdj.zd-OFg:disabled,.zd-OFg:disabled{border-color:hsla(0,0%,50%,.34);color:hsla(0,0%,50%,.34);cursor:not-allowed;-webkit-user-select:none;-moz-user-select:none;user-select:none}.GiHBXI,.KVPc7g.GiHBXI,.z2GQ0Z._8R1Qdj.GiHBXI{position:absolute;z-index:-1}
|
|
2
2
|
/*# sourceMappingURL=style.css.map*/
|