npm - @vkontakte/vkui - Versions diffs - 4.30.0 → 4.33.0 - Mend

@vkontakte/vkui 4.30.0 → 4.33.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.

Files changed (1906) hide show

package/dist/cssm/components/ModalRoot/ModalRootContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/ModalRoot/ModalRootContext.tsx"],"names":["React","useIsomorphicLayoutEffect","ModalRootContext","createContext","updateModalHeight","undefined","registerModal","isInsideModal","useModalRegistry","id","type","modalContext","useContext","elements","useRef","current","reset","Object","keys","reduce","acc","k","refs","modalElement","e","innerElement","headerElement","contentElement"],"mappings":";;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,yBAAT;AAcA,OAAO,IAAMC,gBAAgB,gBAAGF,KAAK,CAACG,aAAN,CAA+C;AAC7EC,EAAAA,iBAAiB,EAAE;AAAA,WAAMC,SAAN;AAAA,GAD0D;AAE7EC,EAAAA,aAAa,EAAE;AAAA,WAAMD,SAAN;AAAA,GAF8D;AAG7EE,EAAAA,aAAa,EAAE;AAH8D,CAA/C,CAAzB;AAMP;AACA;AACA;;AACA,OAAO,SAASC,gBAAT,CAA0BC,EAA1B,EAAkDC,IAAlD,EAAmE;AACxE,MAAMC,YAAY,GAAGX,KAAK,CAACY,UAAN,CAAiBV,gBAAjB,CAArB;AACA,MAAMW,QAAQ,GAAGb,KAAK,CAACc,MAAN,CAA4B,EAA5B,EAAgCC,OAAjD;AACAd,EAAAA,yBAAyB,CAAC,YAAM;AAC9B,QAAIQ,EAAE,KAAKJ,SAAX,EAAsB;AACpBM,MAAAA,YAAY,CAACL,aAAb,iCAAgCO,QAAhC;AAA0CH,QAAAA,IAAI,EAAJA,IAA1C;AAAgDD,QAAAA,EAAE,EAAFA;AAAhD,UADoB,CAEpB;;AACA,UAAMO,KAAK,GAAGC,MAAM,CAACC,IAAP,CAAYL,QAAZ,EAAsBM,MAAtB,CACZ,UAACC,GAAD,EAAMC,CAAN;AAAA,+CAAkBD,GAAlB,2BAAwBC,CAAxB,EAA4B,IAA5B;AAAA,OADY,EAEZ;AAAEX,QAAAA,IAAI,EAAJA,IAAF;AAAQD,QAAAA,EAAE,EAAFA;AAAR,OAFY,CAAd;AAIA,aAAO;AAAA,eAAME,YAAY,CAACL,aAAb,CAA2BU,KAA3B,CAAN;AAAA,OAAP;AACD;;AACD,WAAOX,SAAP;AACD,GAXwB,EAWtB,EAXsB,CAAzB;AAaA,MAAMiB,IAAI,GAAGtB,KAAK,CAACc,MAAN,CAAkC;AAC7CS,IAAAA,YAAY,EAAE,sBAACC,CAAD;AAAA,aAAQX,QAAQ,CAACU,YAAT,GAAwBC,CAAhC;AAAA,KAD+B;AAE7CC,IAAAA,YAAY,EAAE,sBAACD,CAAD;AAAA,aAAQX,QAAQ,CAACY,YAAT,GAAwBD,CAAhC;AAAA,KAF+B;AAG7CE,IAAAA,aAAa,EAAE,uBAACF,CAAD;AAAA,aAAQX,QAAQ,CAACa,aAAT,GAAyBF,CAAjC;AAAA,KAH8B;AAI7CG,IAAAA,cAAc,EAAE,wBAACH,CAAD;AAAA,aAAQX,QAAQ,CAACc,cAAT,GAA0BH,CAAlC;AAAA;AAJ6B,GAAlC,EAKVT,OALH;AAMA,SAAO;AAAEO,IAAAA,IAAI,EAAJA;AAAF,GAAP;AACD~~,C,CAED;;AACA,eAAepB,gBAAf~~","sourcesContent":["import * as React from \"react\";\nimport { useIsomorphicLayoutEffect } from \"../../lib/useIsomorphicLayoutEffect\";\nimport { ModalElements, ModalsStateEntry, ModalType } from \"./types\";\n\nexport type ModalRegistryEntry = ModalElements &\n Required<Pick<ModalsStateEntry, \"type\" \| \"id\">>;\ntype ModalRefs = { [k in keyof ModalElements]: (e: ModalElements[k]) => void };\n\nexport interface ModalRootContextInterface {\n updateModalHeight: VoidFunction;\n registerModal(data: ModalRegistryEntry): void;\n onClose?: VoidFunction;\n isInsideModal: boolean;\n}\n\nexport const ModalRootContext = React.createContext<ModalRootContextInterface>({\n updateModalHeight: () => undefined,\n registerModal: () => undefined,\n isInsideModal: false,\n});\n\n/*\n All referenced elements must be static\n */\nexport function useModalRegistry(id: string \| undefined, type: ModalType) {\n const modalContext = React.useContext(ModalRootContext);\n const elements = React.useRef<ModalElements>({}).current;\n useIsomorphicLayoutEffect(() => {\n if (id !== undefined) {\n modalContext.registerModal({ ...elements, type, id });\n // unset refs on unmount to prevent leak\n const reset = Object.keys(elements).reduce<ModalRegistryEntry>(\n (acc, k) => ({ ...acc, [k]: null }),\n { type, id }\n );\n return () => modalContext.registerModal(reset);\n }\n return undefined;\n }, []);\n\n const refs = React.useRef<Required<ModalRefs>>({\n modalElement: (e) => (elements.modalElement = e),\n innerElement: (e) => (elements.innerElement = e),\n headerElement: (e) => (elements.headerElement = e),\n contentElement: (e) => (elements.contentElement = e),\n }).current;\n return { refs };\n}\n~~\n// eslint-disable-next-line import/no-default-export\nexport default ModalRootContext;\n~~"],"file":"ModalRootContext.js"}
1	+ {"version":3,"sources":["../../../../src/components/ModalRoot/ModalRootContext.tsx"],"names":["React","useIsomorphicLayoutEffect","ModalRootContext","createContext","updateModalHeight","undefined","registerModal","isInsideModal","useModalRegistry","id","type","modalContext","useContext","elements","useRef","current","reset","Object","keys","reduce","acc","k","refs","modalElement","e","innerElement","headerElement","contentElement"],"mappings":";;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,yBAAT;AAcA,OAAO,IAAMC,gBAAgB,gBAAGF,KAAK,CAACG,aAAN,CAA+C;AAC7EC,EAAAA,iBAAiB,EAAE;AAAA,WAAMC,SAAN;AAAA,GAD0D;AAE7EC,EAAAA,aAAa,EAAE;AAAA,WAAMD,SAAN;AAAA,GAF8D;AAG7EE,EAAAA,aAAa,EAAE;AAH8D,CAA/C,CAAzB;AAMP;AACA;AACA;;AACA,OAAO,SAASC,gBAAT,CAA0BC,EAA1B,EAAkDC,IAAlD,EAAmE;AACxE,MAAMC,YAAY,GAAGX,KAAK,CAACY,UAAN,CAAiBV,gBAAjB,CAArB;AACA,MAAMW,QAAQ,GAAGb,KAAK,CAACc,MAAN,CAA4B,EAA5B,EAAgCC,OAAjD;AACAd,EAAAA,yBAAyB,CAAC,YAAM;AAC9B,QAAIQ,EAAE,KAAKJ,SAAX,EAAsB;AACpBM,MAAAA,YAAY,CAACL,aAAb,iCAAgCO,QAAhC;AAA0CH,QAAAA,IAAI,EAAJA,IAA1C;AAAgDD,QAAAA,EAAE,EAAFA;AAAhD,UADoB,CAEpB;;AACA,UAAMO,KAAK,GAAGC,MAAM,CAACC,IAAP,CAAYL,QAAZ,EAAsBM,MAAtB,CACZ,UAACC,GAAD,EAAMC,CAAN;AAAA,+CAAkBD,GAAlB,2BAAwBC,CAAxB,EAA4B,IAA5B;AAAA,OADY,EAEZ;AAAEX,QAAAA,IAAI,EAAJA,IAAF;AAAQD,QAAAA,EAAE,EAAFA;AAAR,OAFY,CAAd;AAIA,aAAO;AAAA,eAAME,YAAY,CAACL,aAAb,CAA2BU,KAA3B,CAAN;AAAA,OAAP;AACD;;AACD,WAAOX,SAAP;AACD,GAXwB,EAWtB,EAXsB,CAAzB;AAaA,MAAMiB,IAAI,GAAGtB,KAAK,CAACc,MAAN,CAAkC;AAC7CS,IAAAA,YAAY,EAAE,sBAACC,CAAD;AAAA,aAAQX,QAAQ,CAACU,YAAT,GAAwBC,CAAhC;AAAA,KAD+B;AAE7CC,IAAAA,YAAY,EAAE,sBAACD,CAAD;AAAA,aAAQX,QAAQ,CAACY,YAAT,GAAwBD,CAAhC;AAAA,KAF+B;AAG7CE,IAAAA,aAAa,EAAE,uBAACF,CAAD;AAAA,aAAQX,QAAQ,CAACa,aAAT,GAAyBF,CAAjC;AAAA,KAH8B;AAI7CG,IAAAA,cAAc,EAAE,wBAACH,CAAD;AAAA,aAAQX,QAAQ,CAACc,cAAT,GAA0BH,CAAlC;AAAA;AAJ6B,GAAlC,EAKVT,OALH;AAMA,SAAO;AAAEO,IAAAA,IAAI,EAAJA;AAAF,GAAP;AACD","sourcesContent":["import * as React from \"react\";\nimport { useIsomorphicLayoutEffect } from \"../../lib/useIsomorphicLayoutEffect\";\nimport { ModalElements, ModalsStateEntry, ModalType } from \"./types\";\n\nexport type ModalRegistryEntry = ModalElements &\n Required<Pick<ModalsStateEntry, \"type\" \| \"id\">>;\ntype ModalRefs = { [k in keyof ModalElements]: (e: ModalElements[k]) => void };\n\nexport interface ModalRootContextInterface {\n updateModalHeight: VoidFunction;\n registerModal(data: ModalRegistryEntry): void;\n onClose?: VoidFunction;\n isInsideModal: boolean;\n}\n\nexport const ModalRootContext = React.createContext<ModalRootContextInterface>({\n updateModalHeight: () => undefined,\n registerModal: () => undefined,\n isInsideModal: false,\n});\n\n/*\n All referenced elements must be static\n */\nexport function useModalRegistry(id: string \| undefined, type: ModalType) {\n const modalContext = React.useContext(ModalRootContext);\n const elements = React.useRef<ModalElements>({}).current;\n useIsomorphicLayoutEffect(() => {\n if (id !== undefined) {\n modalContext.registerModal({ ...elements, type, id });\n // unset refs on unmount to prevent leak\n const reset = Object.keys(elements).reduce<ModalRegistryEntry>(\n (acc, k) => ({ ...acc, [k]: null }),\n { type, id }\n );\n return () => modalContext.registerModal(reset);\n }\n return undefined;\n }, []);\n\n const refs = React.useRef<Required<ModalRefs>>({\n modalElement: (e) => (elements.modalElement = e),\n innerElement: (e) => (elements.innerElement = e),\n headerElement: (e) => (elements.headerElement = e),\n contentElement: (e) => (elements.contentElement = e),\n }).current;\n return { refs };\n}\n"],"file":"ModalRootContext.js"}

package/dist/cssm/components/ModalRoot/ModalRootDesktop.js CHANGED Viewed

@@ -12,7 +12,7 @@ import { classNames } from "../../lib/classNames";
 import { transitionEvent } from "../../lib/supportEvents";
 import { withPlatform } from "../../hoc/withPlatform";
 import { withContext } from "../../hoc/withContext";
-import ModalRootContext from "./ModalRootContext";
+import { ModalRootContext } from "./ModalRootContext";
 import { ConfigProviderContext, WebviewType } from "../ConfigProvider/ConfigProviderContext";
 import { ANDROID, VKCOM } from "../../lib/platform";
 import { getClassName } from "../../helpers/getClassName";

package/dist/cssm/components/ModalRoot/ModalRootDesktop.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/ModalRoot/ModalRootDesktop.tsx"],"names":["React","classNames","transitionEvent","withPlatform","withContext","ModalRootContext","ConfigProviderContext","WebviewType","ANDROID","VKCOM","getClassName","withDOM","getNavId","warnOnce","FocusTrap","withModalManager","warn","ModalRootDesktopComponent","props","undefined","maskElementRef","createRef","modalRootContext","updateModalHeight","registerModal","id","data","Object","assign","getModalState","onClose","onExit","isInsideModal","platform","Children","toArray","children","prevProps","exitingModal","closeModal","enteringModal","enteringState","onEnter","requestAnimationFrame","waitTransitionFinish","onEntered","animateModalOpacity","activeModal","restoreFocusTo","document","activeElement","focus","prevModalState","onExited","setMaskOpacity","modalState","eventHandler","supported","onceHandler","innerElement","removeEventListener","name","addEventListener","setTimeout","timeout","display","style","transitionDelay","delayEnter","opacity","forceOpacity","history","maskAnimationFrame","cancelAnimationFrame","current","translateY","translateYCurrent","Math","max","min","toString","configProvider","webviewType","VKAPPS","modals","map","Modal","modalId","key","Boolean","Component","ModalRootDesktop"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { transitionEvent } from \"../../lib/supportEvents\";\nimport { HasPlatform } from \"../../types\";\nimport { withPlatform } from \"../../hoc/withPlatform\";\nimport { withContext } from \"../../hoc/withContext\";\nimport ModalRootContext, {\n ModalRootContextInterface,\n} from \"./ModalRootContext\";\nimport {\n ConfigProviderContext,\n ConfigProviderContextInterface,\n WebviewType,\n} from \"../ConfigProvider/ConfigProviderContext\";\nimport { ModalsStateEntry } from \"./types\";\nimport { ANDROID, VKCOM } from \"../../lib/platform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { DOMProps, withDOM } from \"../../lib/dom\";\nimport { getNavId } from \"../../lib/getNavId\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { FocusTrap } from \"../FocusTrap/FocusTrap\";\nimport { ModalTransitionProps, withModalManager } from \"./useModalManager\";\nimport \"./ModalRoot.css\";\n\nconst warn = warnOnce(\"ModalRoot\");\n\nexport interface ModalRootProps extends HasPlatform {\n activeModal?: string \| null;\n /*\n @ignore\n /\n configProvider?: ConfigProviderContextInterface;\n\n /\n Будет вызвано при начале открытия активной модалки с её id\n /\n onOpen?(modalId: string): void;\n\n /\n Будет вызвано при окончательном открытии активной модалки с её id\n /\n onOpened?(modalId: string): void;\n\n /\n Будет вызвано при начале закрытия активной модалки с её id\n /\n onClose?(modalId: string): void;\n\n /\n Будет вызвано при окончательном закрытии активной модалки с её id\n /\n onClosed?(modalId: string): void;\n}\n\nclass ModalRootDesktopComponent extends React.Component<\n ModalRootProps & DOMProps & ModalTransitionProps\n> {\n constructor(props: ModalRootProps & ModalTransitionProps) {\n super(props);\n\n this.maskElementRef = React.createRef();\n\n this.modalRootContext = {\n updateModalHeight: () => undefined,\n registerModal: ({ id, ...data }) =>\n Object.assign(this.getModalState(id), data),\n onClose: () => this.props.onExit(),\n isInsideModal: true,\n };\n }\n\n private readonly maskElementRef: React.RefObject<HTMLDivElement>;\n private maskAnimationFrame: number \| undefined = undefined;\n private readonly modalRootContext: ModalRootContextInterface;\n private restoreFocusTo: HTMLElement \| undefined = undefined;\n\n private get timeout() {\n return this.props.platform === ANDROID \|\| this.props.platform === VKCOM\n ? 320\n : 400;\n }\n\n private get modals() {\n return React.Children.toArray(this.props.children) as React.ReactElement[];\n }\n\n getModalState(id: string \| null) {\n if (id === null) {\n return undefined;\n }\n return this.props.getModalState(id);\n }\n\n componentDidUpdate(prevProps: ModalRootProps & ModalTransitionProps) {\n // transition phase 2: animate exiting modal\n if (\n this.props.exitingModal &&\n this.props.exitingModal !== prevProps.exitingModal\n ) {\n this.closeModal(this.props.exitingModal);\n }\n\n // transition phase 3: animate entering modal\n if (\n this.props.enteringModal &&\n this.props.enteringModal !== prevProps.enteringModal\n ) {\n const { enteringModal } = this.props;\n const enteringState = this.getModalState(enteringModal);\n this.props.onEnter();\n requestAnimationFrame(() => {\n if (this.props.enteringModal === enteringModal) {\n this.waitTransitionFinish(enteringState, () =>\n this.props.onEntered(enteringModal)\n );\n this.animateModalOpacity(enteringState, true);\n }\n });\n }\n\n // focus restoration\n if (this.props.activeModal && !prevProps.activeModal) {\n this.restoreFocusTo = (this.props.document?.activeElement ??\n undefined) as HTMLElement \| undefined;\n }\n if (\n !this.props.activeModal &&\n !this.props.exitingModal &&\n this.restoreFocusTo\n ) {\n this.restoreFocusTo.focus();\n this.restoreFocusTo = undefined;\n }\n }\n\n closeModal(id: string) {\n const prevModalState = this.getModalState(id);\n if (!prevModalState) {\n return;\n }\n\n this.waitTransitionFinish(prevModalState, () => this.props.onExited(id));\n this.animateModalOpacity(prevModalState, false);\n if (!this.props.activeModal) {\n this.setMaskOpacity(prevModalState, 0);\n }\n }\n\n waitTransitionFinish(\n modalState: ModalsStateEntry \| undefined,\n eventHandler: () => void\n ) {\n if (transitionEvent.supported) {\n const onceHandler = () => {\n modalState?.innerElement?.removeEventListener(\n transitionEvent.name as string,\n onceHandler\n );\n eventHandler();\n };\n\n modalState?.innerElement?.addEventListener(\n transitionEvent.name as string,\n onceHandler\n );\n } else {\n setTimeout(eventHandler, this.timeout);\n }\n }\n\n / Анимирует сдвиг модалки /\n animateModalOpacity(\n modalState: ModalsStateEntry \| undefined,\n display: boolean\n ) {\n if (modalState?.innerElement) {\n modalState.innerElement.style.transitionDelay =\n display && this.props.delayEnter ? `${this.timeout}ms` : \"\";\n modalState.innerElement.style.opacity = display ? \"1\" : \"0\";\n }\n }\n\n / Устанавливает прозрачность для полупрозрачной подложки */\n setMaskOpacity(\n modalState: ModalsStateEntry,\n forceOpacity: number \| null = null\n ) {\n if (forceOpacity === null && this.props.history?.[0] !== modalState.id) {\n return;\n }\n\n if (this.maskAnimationFrame) {\n cancelAnimationFrame(this.maskAnimationFrame);\n }\n this.maskAnimationFrame = requestAnimationFrame(() => {\n if (this.maskElementRef.current) {\n const { translateY = 0, translateYCurrent = 0 } = modalState;\n\n const opacity =\n forceOpacity === null\n ? 1 - (translateYCurrent - translateY) / (100 - translateY) \|\| 0\n : forceOpacity;\n this.maskElementRef.current.style.opacity = Math.max(\n 0,\n Math.min(100, opacity)\n ).toString();\n }\n });\n }\n\n render() {\n const { exitingModal, activeModal, enteringModal } = this.props;\n\n if (!activeModal && !exitingModal) {\n return null;\n }\n\n return (\n <ModalRootContext.Provider value={this.modalRootContext}>\n <div\n // eslint-disable-next-line vkui/no-object-expression-in-arguments\n vkuiClass={classNames(\n getClassName(\"ModalRoot\", this.props.platform),\n {\n \"ModalRoot--vkapps\":\n this.props.configProvider?.webviewType === WebviewType.VKAPPS,\n },\n \"ModalRoot--desktop\"\n )}\n >\n <div\n vkuiClass=\"ModalRoot__mask\"\n ref={this.maskElementRef}\n onClick={this.props.onExit}\n />\n <div vkuiClass=\"ModalRoot__viewport\">\n {this.modals.map((Modal: React.ReactElement) => {\n const modalId = getNavId(Modal.props, warn);\n if (modalId !== activeModal && modalId !== exitingModal) {\n return null;\n }\n\n const key = `modal-${modalId}`;\n\n return (\n <FocusTrap\n restoreFocus={false}\n onClose={this.props.onExit}\n timeout={this.timeout}\n key={key}\n // eslint-disable-next-line vkui/no-object-expression-in-arguments\n vkuiClass={classNames(\"ModalRoot__modal\", {\n \"ModalRoot__modal--active\":\n !exitingModal &&\n !enteringModal &&\n modalId === activeModal,\n \"ModalRoot__modal--prev\": modalId === exitingModal,\n \"ModalRoot__modal--next\":\n Boolean(exitingModal) && modalId === activeModal,\n })}\n >\n {Modal}\n </FocusTrap>\n );\n })}\n </div>\n </div>\n </ModalRootContext.Provider>\n );\n }\n}\n\nexport const ModalRootDesktop = withContext(\n withPlatform(\n withDOM<ModalRootProps>(withModalManager()(ModalRootDesktopComponent))\n ),\n ConfigProviderContext,\n \"configProvider\"\n);\n"],"file":"ModalRootDesktop.js"}
1	+ {"version":3,"sources":["../../../../src/components/ModalRoot/ModalRootDesktop.tsx"],"names":["React","classNames","transitionEvent","withPlatform","withContext","ModalRootContext","ConfigProviderContext","WebviewType","ANDROID","VKCOM","getClassName","withDOM","getNavId","warnOnce","FocusTrap","withModalManager","warn","ModalRootDesktopComponent","props","undefined","maskElementRef","createRef","modalRootContext","updateModalHeight","registerModal","id","data","Object","assign","getModalState","onClose","onExit","isInsideModal","platform","Children","toArray","children","prevProps","exitingModal","closeModal","enteringModal","enteringState","onEnter","requestAnimationFrame","waitTransitionFinish","onEntered","animateModalOpacity","activeModal","restoreFocusTo","document","activeElement","focus","prevModalState","onExited","setMaskOpacity","modalState","eventHandler","supported","onceHandler","innerElement","removeEventListener","name","addEventListener","setTimeout","timeout","display","style","transitionDelay","delayEnter","opacity","forceOpacity","history","maskAnimationFrame","cancelAnimationFrame","current","translateY","translateYCurrent","Math","max","min","toString","configProvider","webviewType","VKAPPS","modals","map","Modal","modalId","key","Boolean","Component","ModalRootDesktop"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { transitionEvent } from \"../../lib/supportEvents\";\nimport { HasPlatform } from \"../../types\";\nimport { withPlatform } from \"../../hoc/withPlatform\";\nimport { withContext } from \"../../hoc/withContext\";\nimport {\n ModalRootContext,\n ModalRootContextInterface,\n} from \"./ModalRootContext\";\nimport {\n ConfigProviderContext,\n ConfigProviderContextInterface,\n WebviewType,\n} from \"../ConfigProvider/ConfigProviderContext\";\nimport { ModalsStateEntry } from \"./types\";\nimport { ANDROID, VKCOM } from \"../../lib/platform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { DOMProps, withDOM } from \"../../lib/dom\";\nimport { getNavId } from \"../../lib/getNavId\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { FocusTrap } from \"../FocusTrap/FocusTrap\";\nimport { ModalTransitionProps, withModalManager } from \"./useModalManager\";\nimport \"./ModalRoot.css\";\n\nconst warn = warnOnce(\"ModalRoot\");\n\nexport interface ModalRootProps extends HasPlatform {\n activeModal?: string \| null;\n /*\n @ignore\n /\n configProvider?: ConfigProviderContextInterface;\n\n /\n Будет вызвано при начале открытия активной модалки с её id\n /\n onOpen?(modalId: string): void;\n\n /\n Будет вызвано при окончательном открытии активной модалки с её id\n /\n onOpened?(modalId: string): void;\n\n /\n Будет вызвано при начале закрытия активной модалки с её id\n /\n onClose?(modalId: string): void;\n\n /\n Будет вызвано при окончательном закрытии активной модалки с её id\n /\n onClosed?(modalId: string): void;\n}\n\nclass ModalRootDesktopComponent extends React.Component<\n ModalRootProps & DOMProps & ModalTransitionProps\n> {\n constructor(props: ModalRootProps & ModalTransitionProps) {\n super(props);\n\n this.maskElementRef = React.createRef();\n\n this.modalRootContext = {\n updateModalHeight: () => undefined,\n registerModal: ({ id, ...data }) =>\n Object.assign(this.getModalState(id), data),\n onClose: () => this.props.onExit(),\n isInsideModal: true,\n };\n }\n\n private readonly maskElementRef: React.RefObject<HTMLDivElement>;\n private maskAnimationFrame: number \| undefined = undefined;\n private readonly modalRootContext: ModalRootContextInterface;\n private restoreFocusTo: HTMLElement \| undefined = undefined;\n\n private get timeout() {\n return this.props.platform === ANDROID \|\| this.props.platform === VKCOM\n ? 320\n : 400;\n }\n\n private get modals() {\n return React.Children.toArray(this.props.children) as React.ReactElement[];\n }\n\n getModalState(id: string \| null) {\n if (id === null) {\n return undefined;\n }\n return this.props.getModalState(id);\n }\n\n componentDidUpdate(prevProps: ModalRootProps & ModalTransitionProps) {\n // transition phase 2: animate exiting modal\n if (\n this.props.exitingModal &&\n this.props.exitingModal !== prevProps.exitingModal\n ) {\n this.closeModal(this.props.exitingModal);\n }\n\n // transition phase 3: animate entering modal\n if (\n this.props.enteringModal &&\n this.props.enteringModal !== prevProps.enteringModal\n ) {\n const { enteringModal } = this.props;\n const enteringState = this.getModalState(enteringModal);\n this.props.onEnter();\n requestAnimationFrame(() => {\n if (this.props.enteringModal === enteringModal) {\n this.waitTransitionFinish(enteringState, () =>\n this.props.onEntered(enteringModal)\n );\n this.animateModalOpacity(enteringState, true);\n }\n });\n }\n\n // focus restoration\n if (this.props.activeModal && !prevProps.activeModal) {\n this.restoreFocusTo = (this.props.document?.activeElement ??\n undefined) as HTMLElement \| undefined;\n }\n if (\n !this.props.activeModal &&\n !this.props.exitingModal &&\n this.restoreFocusTo\n ) {\n this.restoreFocusTo.focus();\n this.restoreFocusTo = undefined;\n }\n }\n\n closeModal(id: string) {\n const prevModalState = this.getModalState(id);\n if (!prevModalState) {\n return;\n }\n\n this.waitTransitionFinish(prevModalState, () => this.props.onExited(id));\n this.animateModalOpacity(prevModalState, false);\n if (!this.props.activeModal) {\n this.setMaskOpacity(prevModalState, 0);\n }\n }\n\n waitTransitionFinish(\n modalState: ModalsStateEntry \| undefined,\n eventHandler: () => void\n ) {\n if (transitionEvent.supported) {\n const onceHandler = () => {\n modalState?.innerElement?.removeEventListener(\n transitionEvent.name as string,\n onceHandler\n );\n eventHandler();\n };\n\n modalState?.innerElement?.addEventListener(\n transitionEvent.name as string,\n onceHandler\n );\n } else {\n setTimeout(eventHandler, this.timeout);\n }\n }\n\n / Анимирует сдвиг модалки /\n animateModalOpacity(\n modalState: ModalsStateEntry \| undefined,\n display: boolean\n ) {\n if (modalState?.innerElement) {\n modalState.innerElement.style.transitionDelay =\n display && this.props.delayEnter ? `${this.timeout}ms` : \"\";\n modalState.innerElement.style.opacity = display ? \"1\" : \"0\";\n }\n }\n\n / Устанавливает прозрачность для полупрозрачной подложки */\n setMaskOpacity(\n modalState: ModalsStateEntry,\n forceOpacity: number \| null = null\n ) {\n if (forceOpacity === null && this.props.history?.[0] !== modalState.id) {\n return;\n }\n\n if (this.maskAnimationFrame) {\n cancelAnimationFrame(this.maskAnimationFrame);\n }\n this.maskAnimationFrame = requestAnimationFrame(() => {\n if (this.maskElementRef.current) {\n const { translateY = 0, translateYCurrent = 0 } = modalState;\n\n const opacity =\n forceOpacity === null\n ? 1 - (translateYCurrent - translateY) / (100 - translateY) \|\| 0\n : forceOpacity;\n this.maskElementRef.current.style.opacity = Math.max(\n 0,\n Math.min(100, opacity)\n ).toString();\n }\n });\n }\n\n render() {\n const { exitingModal, activeModal, enteringModal } = this.props;\n\n if (!activeModal && !exitingModal) {\n return null;\n }\n\n return (\n <ModalRootContext.Provider value={this.modalRootContext}>\n <div\n // eslint-disable-next-line vkui/no-object-expression-in-arguments\n vkuiClass={classNames(\n getClassName(\"ModalRoot\", this.props.platform),\n {\n \"ModalRoot--vkapps\":\n this.props.configProvider?.webviewType === WebviewType.VKAPPS,\n },\n \"ModalRoot--desktop\"\n )}\n >\n <div\n vkuiClass=\"ModalRoot__mask\"\n ref={this.maskElementRef}\n onClick={this.props.onExit}\n />\n <div vkuiClass=\"ModalRoot__viewport\">\n {this.modals.map((Modal: React.ReactElement) => {\n const modalId = getNavId(Modal.props, warn);\n if (modalId !== activeModal && modalId !== exitingModal) {\n return null;\n }\n\n const key = `modal-${modalId}`;\n\n return (\n <FocusTrap\n restoreFocus={false}\n onClose={this.props.onExit}\n timeout={this.timeout}\n key={key}\n // eslint-disable-next-line vkui/no-object-expression-in-arguments\n vkuiClass={classNames(\"ModalRoot__modal\", {\n \"ModalRoot__modal--active\":\n !exitingModal &&\n !enteringModal &&\n modalId === activeModal,\n \"ModalRoot__modal--prev\": modalId === exitingModal,\n \"ModalRoot__modal--next\":\n Boolean(exitingModal) && modalId === activeModal,\n })}\n >\n {Modal}\n </FocusTrap>\n );\n })}\n </div>\n </div>\n </ModalRootContext.Provider>\n );\n }\n}\n\nexport const ModalRootDesktop = withContext(\n withPlatform(\n withDOM<ModalRootProps>(withModalManager()(ModalRootDesktopComponent))\n ),\n ConfigProviderContext,\n \"configProvider\"\n);\n"],"file":"ModalRootDesktop.js"}

package/dist/cssm/components/ModalRoot/withModalRootContext.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 import { createScopedElement } from "../../lib/jsxRuntime";
 import * as React from "react";
-import ModalRootContext from "./ModalRootContext";
+import { ModalRootContext } from "./ModalRootContext";
 export function withModalRootContext(Component) {
   function WithModalRootContext(props) {
     var _React$useContext = React.useContext(ModalRootContext),

package/dist/cssm/components/ModalRoot/withModalRootContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/ModalRoot/withModalRootContext.tsx"],"names":["React","ModalRootContext","withModalRootContext","Component","WithModalRootContext","props","useContext","updateModalHeight"],"mappings":";;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,~~OAAOC~~,~~gBAAP~~;~~AAMA~~,OAAO,SAASC,oBAAT,CACLC,SADK,EAE4C;AACjD,WAASC,oBAAT,CAA8BC,KAA9B,EAAiE;AAC/D,4BAA8BL,KAAK,CAACM,UAAN,CAAiBL,gBAAjB,CAA9B;AAAA,QAAQM,iBAAR,qBAAQA,iBAAR;;AAEA,WACE,oBAAC,SAAD,eAAgBF,KAAhB;AAA6B,MAAA,iBAAiB,EAAEE;AAAhD,OADF;AAGD;;AACD,SAAOH,oBAAP;AACD","sourcesContent":["import * as React from \"react\";\nimport ~~ModalRootContext,~~ {\n ModalRootContextInterface,\n} from \"./ModalRootContext\";\n\ntype PickedProps = Pick<ModalRootContextInterface, \"updateModalHeight\">;\n\nexport function withModalRootContext<P extends PickedProps>(\n Component: React.ComponentType<P>\n): React.ComponentType<Omit<P, keyof PickedProps>> {\n function WithModalRootContext(props: Omit<P, keyof PickedProps>) {\n const { updateModalHeight } = React.useContext(ModalRootContext);\n\n return (\n <Component {...(props as P)} updateModalHeight={updateModalHeight} />\n );\n }\n return WithModalRootContext;\n}\n"],"file":"withModalRootContext.js"}
1	+ {"version":3,"sources":["../../../../src/components/ModalRoot/withModalRootContext.tsx"],"names":["React","ModalRootContext","withModalRootContext","Component","WithModalRootContext","props","useContext","updateModalHeight"],"mappings":";;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SACEC,gBADF;AAOA,OAAO,SAASC,oBAAT,CACLC,SADK,EAE4C;AACjD,WAASC,oBAAT,CAA8BC,KAA9B,EAAiE;AAC/D,4BAA8BL,KAAK,CAACM,UAAN,CAAiBL,gBAAjB,CAA9B;AAAA,QAAQM,iBAAR,qBAAQA,iBAAR;;AAEA,WACE,oBAAC,SAAD,eAAgBF,KAAhB;AAA6B,MAAA,iBAAiB,EAAEE;AAAhD,OADF;AAGD;;AACD,SAAOH,oBAAP;AACD","sourcesContent":["import * as React from \"react\";\nimport {\n ModalRootContext,\n ModalRootContextInterface,\n} from \"./ModalRootContext\";\n\ntype PickedProps = Pick<ModalRootContextInterface, \"updateModalHeight\">;\n\nexport function withModalRootContext<P extends PickedProps>(\n Component: React.ComponentType<P>\n): React.ComponentType<Omit<P, keyof PickedProps>> {\n function WithModalRootContext(props: Omit<P, keyof PickedProps>) {\n const { updateModalHeight } = React.useContext(ModalRootContext);\n\n return (\n <Component {...(props as P)} updateModalHeight={updateModalHeight} />\n );\n }\n return WithModalRootContext;\n}\n"],"file":"withModalRootContext.js"}

package/dist/cssm/components/NativeSelect/NativeSelect.d.ts CHANGED Viewed

@@ -1,14 +1,19 @@
 import * as React from "react";
 import { HasAlign, HasRef, HasRootRef } from "../../types";
+import { SelectType } from "../Select/Select";
 import { AdaptivityContextInterface, AdaptivityProps } from "../AdaptivityProvider/AdaptivityContext";
 import "../Select/Select.css";
 export interface NativeSelectProps extends React.SelectHTMLAttributes<HTMLSelectElement>, HasRef<HTMLSelectElement>, HasRootRef<HTMLLabelElement>, HasAlign, AdaptivityProps {
     placeholder?: string;
     multiline?: boolean;
+    selectType?: keyof typeof SelectType;
 }
 export interface SelectState {
     value?: React.SelectHTMLAttributes<HTMLSelectElement>["value"];
     title?: string;
     notSelected?: boolean;
 }
-export declare const NativeSelect: React.FC<Pick<NativeSelectProps & AdaptivityContextInterface, "required" | "disabled" | "hidden" | "dir" | "form" | "slot" | "style" | "title" | "color" | "size" | "multiple" | "translate" | "prefix" | "children" | "className" | "id" | "lang" | "name" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "value" | "autoFocus" | "autoComplete" | "align" | "getRootRef" | "getRef" | "multiline"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;
+/**
+ * @see https://vkcom.github.io/VKUI/#/NativeSelect
+ */
+export declare const NativeSelect: React.FC<Pick<NativeSelectProps & AdaptivityContextInterface, "required" | "disabled" | "hidden" | "dir" | "form" | "slot" | "style" | "title" | "color" | "size" | "multiple" | "translate" | "prefix" | "children" | "className" | "id" | "lang" | "name" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "value" | "autoFocus" | "autoComplete" | "align" | "getRootRef" | "getRef" | "multiline" | "selectType"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;

package/dist/cssm/components/NativeSelect/NativeSelect.js CHANGED Viewed

@@ -1,27 +1,22 @@
 import _extends from "@babel/runtime/helpers/extends";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["style", "defaultValue", "align", "placeholder", "children", "className", "getRef", "getRootRef", "disabled", "sizeX", "sizeY", "multiline"];
+var _excluded = ["style", "defaultValue", "align", "placeholder", "children", "className", "getRef", "getRootRef", "disabled", "sizeX", "sizeY", "multiline", "selectType"];
 import { createScopedElement } from "../../lib/jsxRuntime";
 import * as React from "react";
 import { classNames } from "../../lib/classNames";
 import { DropdownIcon } from "../DropdownIcon/DropdownIcon";
 import { FormField } from "../FormField/FormField";
-import { withAdaptivity, SizeType } from "../../hoc/withAdaptivity";
+import { withAdaptivity } from "../../hoc/withAdaptivity";
 import { getClassName } from "../../helpers/getClassName";
-import Headline from "../Typography/Headline/Headline";
-import Text from "../Typography/Text/Text";
-import { VKCOM } from "../../lib/platform";
 import { useIsomorphicLayoutEffect } from "../../lib/useIsomorphicLayoutEffect";
 import { useEnsuredControl } from "../../hooks/useEnsuredControl";
 import { useExternRef } from "../../hooks/useExternRef";
 import { usePlatform } from "../../hooks/usePlatform";
+import { SelectType, SelectTypography } from "../Select/Select";
 import "../Select/Select.css";
 var NativeSelectComponent = function NativeSelectComponent(_ref) {
-  var _classNames;
   var style = _ref.style,
       _ref$defaultValue = _ref.defaultValue,
       defaultValue = _ref$defaultValue === void 0 ? "" : _ref$defaultValue,
@@ -35,6 +30,8 @@ var NativeSelectComponent = function NativeSelectComponent(_ref) {
       sizeX = _ref.sizeX,
       sizeY = _ref.sizeY,
       multiline = _ref.multiline,
+      _ref$selectType = _ref.selectType,
+      selectType = _ref$selectType === void 0 ? SelectType.default : _ref$selectType,
       restProps = _objectWithoutProperties(_ref, _excluded);
   var platform = usePlatform();
@@ -46,8 +43,8 @@ var NativeSelectComponent = function NativeSelectComponent(_ref) {
   var _React$useState3 = React.useState(false),
       _React$useState4 = _slicedToArray(_React$useState3, 2),
-      notSelected = _React$useState4[0],
-      setNotSelected = _React$useState4[1];
+      empty = _React$useState4[0],
+      setEmpty = _React$useState4[1];
   var _useEnsuredControl = useEnsuredControl(restProps, {
     defaultValue: defaultValue
@@ -64,14 +61,12 @@ var NativeSelectComponent = function NativeSelectComponent(_ref) {
     if (selectedOption) {
       setTitle(selectedOption.text);
-      setNotSelected(selectedOption.value === "" && placeholder != null);
+      setEmpty(selectedOption.value === "" && placeholder != null);
     }
   }, [value, children]);
-  var TypographyComponent = platform === VKCOM || sizeY === SizeType.COMPACT ? Text : Headline;
   return createScopedElement(FormField, {
-    Component: "label" // eslint-disable-next-line vkui/no-object-expression-in-arguments
-    ,
-    vkuiClass: classNames(getClassName("Select", platform), (_classNames = {}, _defineProperty(_classNames, "Select--not-selected", notSelected), _defineProperty(_classNames, "Select--align-".concat(align), !!align), _defineProperty(_classNames, "Select--sizeX--".concat(sizeX), !!sizeX), _defineProperty(_classNames, "Select--sizeY--".concat(sizeY), !!sizeY), _defineProperty(_classNames, "Select--multiline", multiline), _classNames)),
+    Component: "label",
+    vkuiClass: classNames(getClassName("Select", platform), "Select--".concat(selectType), empty && "Select--empty", multiline && "Select--multiline", align && "Select--align-".concat(align), "Select--sizeX-".concat(sizeX), "Select--sizeY-".concat(sizeY)),
     className: className,
     style: style,
     getRootRef: getRootRef,
@@ -85,14 +80,16 @@ var NativeSelectComponent = function NativeSelectComponent(_ref) {
     ref: selectRef
   }), placeholder && createScopedElement("option", {
     value: ""
-  }, placeholder), children), createScopedElement(TypographyComponent, {
-    Component: "div",
-    weight: "regular",
+  }, placeholder), children), createScopedElement("div", {
     vkuiClass: "Select__container"
-  }, createScopedElement("span", {
+  }, createScopedElement(SelectTypography, {
     vkuiClass: "Select__title"
   }, title)));
 };
+/**
+ * @see https://vkcom.github.io/VKUI/#/NativeSelect
+ */
 export var NativeSelect = withAdaptivity(NativeSelectComponent, {
   sizeX: true,

package/dist/cssm/components/NativeSelect/NativeSelect.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/NativeSelect/NativeSelect.tsx"],"names":["React","classNames","DropdownIcon","FormField","withAdaptivity","~~SizeType","~~getClassName","~~Headline~~","~~Text~~","~~VKCOM~~","~~useIsomorphicLayoutEffect~~","~~useEnsuredControl~~","~~useExternRef~~","~~usePlatform","~~NativeSelectComponent","style","defaultValue","align","placeholder","children","className","getRef","getRootRef","disabled","sizeX","sizeY","multiline","restProps","platform","useState","title","setTitle","~~notSelected~~","~~setNotSelected~~","value","onChange","selectRef","selectedOption","current","options","selectedIndex","text","~~TypographyComponent","COMPACT","~~NativeSelect"],"mappings":"~~;;;;;;~~AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,UAAT;AACA,SAASC,YAAT;AACA,SAASC,SAAT;AAEA,SAASC,cAAT~~,EAAyBC,QAAzB~~;AACA,SAASC,YAAT;AACA,~~OAAOC~~,~~QAAP~~;AACA,~~OAAOC,IAAP;AACA,~~SAASC,~~KAAT~~;AACA,SAASC,~~yBAAT~~;AACA,SAASC,~~iBAAT~~;AACA,SAASC,~~YAAT;AACA~~,~~SAASC~~,~~WAAT~~;AAKA;;~~AAkBA~~,IAAMC,qBAEL,GAAG,SAFEA,qBAEF,~~OAcE~~;AAAA~~;;AAAA~~,~~MAbJC~~,~~KAaI~~,~~QAbJA~~,~~KAaI~~;AAAA,+~~BAZJC~~,~~YAYI~~;AAAA,~~MAZJA~~,~~YAYI~~,~~kCAZW~~,~~EAYX~~;AAAA,MAXJC,~~KAWI~~,QAXJA,~~KAWI~~;AAAA,MAVJC,~~WAUI~~,QAVJA,~~WAUI~~;AAAA,MATJC,~~QASI~~,QATJA,~~QASI~~;AAAA,MARJC,~~SAQI~~,QARJA,~~SAQI~~;AAAA,MAPJC,~~MAOI~~,QAPJA,~~MAOI~~;AAAA,MANJC,~~UAMI~~,QANJA,~~UAMI~~;AAAA,MALJC,~~QAKI~~,QALJA,~~QAKI~~;AAAA,MAJJC,KAII,QAJJA,KAII;AAAA,MAHJC,~~KAGI~~,QAHJA,~~KAGI~~;AAAA,~~MAFJC~~,~~SAEI~~,~~QAFJA~~,~~SAEI~~;AAAA,MADDC,SACC;;AACJ,MAAMC,QAAQ,~~GAAGf~~,WAAW,EAA5B;;AACA,~~wBAA0Bb~~,KAAK,CAAC6B,QAAN,CAAe,EAAf,CAA1B;AAAA;AAAA,MAAOC,KAAP;AAAA,MAAcC,QAAd;;AACA,~~yBAAsC~~/B,KAAK,CAAC6B,QAAN,CAAe,KAAf,~~CAAtC~~;AAAA;AAAA,MAAOG,~~WAAP~~;AAAA,~~MAAoBC~~,~~cAApB~~;;AACA,~~2BAA0BtB~~,iBAAiB,~~CAACgB~~,SAAD,EAAY;~~AAAEX~~,IAAAA,YAAY,EAAZA;AAAF,GAAZ,CAA3C;AAAA;AAAA,~~MAAOkB~~,KAAP;AAAA,MAAcC,QAAd;;AACA,MAAMC,SAAS,~~GAAGxB~~,YAAY,~~CAACS~~,MAAD,CAA9B;~~AACAX~~,EAAAA,yBAAyB,CAAC,YAAM;AAAA;;AAC9B,~~QAAM2B~~,cAAc,yBAClBD,SAAS,CAACE,OADQ,uDAClB,mBAAmBC,OAAnB,CAA2BH,SAAS,CAACE,OAAV,CAAkBE,aAA7C,CADF;;AAEA,QAAIH,cAAJ,EAAoB;AAClBN,MAAAA,QAAQ,CAACM,cAAc,CAACI,IAAhB,CAAR;AACAR,MAAAA,~~cAAc~~,CAACI,cAAc,CAACH,KAAf,KAAyB,EAAzB,IAA+~~BhB~~,WAAW,IAAI,IAA/C,~~CAAd~~;AACD;AACF,GAPwB,EAOtB,~~CAACgB~~,KAAD,~~EAAQf~~,QAAR,CAPsB,CAAzB;AASA,~~MAAMuB,mBAAmB,GACvBd,QAAQ,KAAKnB,KAAb,IAAsBgB,KAAK,KAAKpB,QAAQ,CAACsC,OAAzC,GAAmDnC,IAAnD,GAA0DD,QAD5D;AAGA,~~SACE,oBAAC,SAAD;AACE,IAAA,SAAS,EAAC,OADZ~~,CAEE~~;~~AAFF;AAGE~~,IAAA,SAAS,~~EAAEN~~,UAAU,~~CAACK~~,YAAY,CAAC,QAAD,~~EAAWsB~~,QAAX,~~CAAb~~,~~kDAClB~~,~~sBADkB~~,~~EACOI~~,~~WADP~~,~~wDAEDf~~,~~KAFC~~,~~GAES~~,~~CAAC~~,~~CAACA~~,~~KAFX~~,~~yDAGAO~~,~~KAHA~~,~~GAGU~~,~~CAAC~~,~~CAACA~~,~~KAHZ~~,~~yDAIAC~~,~~KAJA~~,~~GAIU~~,~~CAAC,CAACA,KAJZ,gCAKnB,mBALmB,EAKEC,SALF,gBAHvB~~;~~AAUE~~,IAAA,SAAS,~~EAAEN~~,~~SAVb~~;~~AAWE~~,IAAA,KAAK,EAAEL,~~KAXT~~;~~AAYE~~,IAAA,UAAU,EAAEO,~~UAZd~~;~~AAaE~~,IAAA,QAAQ,EAAEC,~~QAbZ~~;~~AAcE~~,IAAA,KAAK,EAAE,oBAAC,YAAD;~~AAdT~~,~~KAgBE~~,~~2CACMI~~,SADN;AAEE,IAAA,QAAQ,~~EAAEJ~~,QAFZ;AAGE,IAAA,SAAS,EAAC,YAHZ;AAIE,IAAA,QAAQ,~~EAAEY~~,QAJZ;AAKE,IAAA,KAAK,EAAED,KALT;AAME,IAAA,GAAG,EAAEE;AANP,~~MAQGlB~~,WAAW,IAAI;AAAQ,IAAA,KAAK,EAAC;AAAd,KAAkBA,WAAlB,CARlB,EASGC,QATH,~~CAhBF~~,~~EA2BE,oBAAC,mBAAD~~;~~AACE~~,IAAA,SAAS,EAAC~~,KADZ~~;~~AAEE~~,~~IAAA~~,~~MAAM~~,~~EAAC,SAFT~~;~~AAGE~~,IAAA,SAAS,EAAC;~~AAHZ~~,~~KAKE;AAAM~~,~~IAAA~~,~~SAAS~~,~~EAAC;AAAhB~~,~~KAAiCW,KAAjC,CALF,CA3BF,~~CADF;~~AAqCD~~,~~CAvED;;AAyEA~~,OAAO,~~IAAMc~~,YAAY,~~GAAGxC~~,cAAc,~~CAACU~~,qBAAD,EAAwB;AAChEU,EAAAA,KAAK,EAAE,IADyD;AAEhEC,EAAAA,KAAK,EAAE;AAFyD,CAAxB,CAAnC","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { DropdownIcon } from \"../DropdownIcon/DropdownIcon\";\nimport { FormField } from \"../FormField/FormField\";\nimport { HasAlign, HasRef, HasRootRef } from \"../../types\";\nimport { withAdaptivity, ~~SizeType~~ } from \"../../hoc/withAdaptivity\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport ~~Headline from \"../Typography/Headline/Headline\";\nimport Text from \"../Typography/Text/Text\";\nimport~~ { ~~VKCOM~~ } from \"../../lib/~~platform~~\";\nimport { ~~useIsomorphicLayoutEffect~~ } from \"../../~~lib~~/~~useIsomorphicLayoutEffect~~\";\nimport { ~~useEnsuredControl~~ } from \"../../hooks/~~useEnsuredControl~~\";\nimport { ~~useExternRef~~ } from \"../../hooks/~~useExternRef~~\";\nimport { ~~usePlatform~~ } from \"~~../../hooks~~/~~usePlatform~~\";\nimport {\n AdaptivityContextInterface,\n AdaptivityProps,\n} from \"../AdaptivityProvider/AdaptivityContext\";\nimport \"../Select/Select.css\";\n\nexport interface NativeSelectProps\n extends React.SelectHTMLAttributes<HTMLSelectElement>,\n HasRef<HTMLSelectElement>,\n HasRootRef<HTMLLabelElement>,\n HasAlign,\n AdaptivityProps {\n placeholder?: string;\n multiline?: boolean;\n}\n\nexport interface SelectState {\n value?: React.SelectHTMLAttributes<HTMLSelectElement>[\"value\"];\n title?: string;\n notSelected?: boolean;\n}\n\nconst NativeSelectComponent: React.FC<\n NativeSelectProps & AdaptivityContextInterface\n> = ({\n style,\n defaultValue = \"\",\n align,\n placeholder,\n children,\n className,\n getRef,\n getRootRef,\n disabled,\n sizeX,\n sizeY,\n multiline,\n ...restProps\n}) => {\n const platform = usePlatform();\n const [title, setTitle] = React.useState(\"\");\n const [~~notSelected~~, ~~setNotSelected~~] = React.useState(false);\n const [value, onChange] = useEnsuredControl(restProps, { defaultValue });\n const selectRef = useExternRef(getRef);\n useIsomorphicLayoutEffect(() => {\n const selectedOption =\n selectRef.current?.options[selectRef.current.selectedIndex];\n if (selectedOption) {\n setTitle(selectedOption.text);\n ~~setNotSelected~~(selectedOption.value === \"\" && placeholder != null);\n }\n }, [value, children]);\n\n ~~const TypographyComponent =\n platform === VKCOM \|\| sizeY === SizeType.COMPACT ? Text : Headline;\n\n~~ return (\n <FormField\n Component=\"label\"\n ~~// eslint-disable-next-line vkui/no-object-expression-in-arguments\n~~ vkuiClass={classNames(getClassName(\"Select\", platform), {\n [\"Select--~~not-selected~~\"~~]: notSelected~~,\n [`Select--align-${align}~~`]: !!align,\~~n [`Select--sizeX~~--$~~{sizeX}~~`]: !!sizeX,\~~n [`Select--sizeY~~--$~~{sizeY}~~`]: !!sizeY,\~~n ~~\"Select--multiline\": multiline,\n~~ })}\n className={className}\n style={style}\n getRootRef={getRootRef}\n disabled={disabled}\n after={<DropdownIcon />}\n >\n <select\n {...restProps}\n disabled={disabled}\n vkuiClass=\"Select__el\"\n onChange={onChange}\n value={value}\n ref={selectRef}\n >\n {placeholder && <option value=\"\">{placeholder}</option>}\n {children}\n </select>\n <~~TypographyComponent\n Component=\"~~div~~\"\n weight=\"regular\"\n~~ vkuiClass=\"Select__container\"\n >\n <~~span~~ vkuiClass=\"Select__title\">{title}</~~span~~>\n </~~TypographyComponent~~>\n </FormField>\n );\n};\n\nexport const NativeSelect = withAdaptivity(NativeSelectComponent, {\n sizeX: true,\n sizeY: true,\n});\n"],"file":"NativeSelect.js"}
1	+ {"version":3,"sources":["../../../../src/components/NativeSelect/NativeSelect.tsx"],"names":["React","classNames","DropdownIcon","FormField","withAdaptivity","getClassName","useIsomorphicLayoutEffect","useEnsuredControl","useExternRef","usePlatform","SelectType","SelectTypography","NativeSelectComponent","style","defaultValue","align","placeholder","children","className","getRef","getRootRef","disabled","sizeX","sizeY","multiline","selectType","default","restProps","platform","useState","title","setTitle","empty","setEmpty","value","onChange","selectRef","selectedOption","current","options","selectedIndex","text","NativeSelect"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { DropdownIcon } from \"../DropdownIcon/DropdownIcon\";\nimport { FormField } from \"../FormField/FormField\";\nimport { HasAlign, HasRef, HasRootRef } from \"../../types\";\nimport { withAdaptivity } from \"../../hoc/withAdaptivity\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { useIsomorphicLayoutEffect } from \"../../lib/useIsomorphicLayoutEffect\";\nimport { useEnsuredControl } from \"../../hooks/useEnsuredControl\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { SelectType, SelectTypography } from \"../Select/Select\";\nimport {\n AdaptivityContextInterface,\n AdaptivityProps,\n} from \"../AdaptivityProvider/AdaptivityContext\";\nimport \"../Select/Select.css\";\n\nexport interface NativeSelectProps\n extends React.SelectHTMLAttributes<HTMLSelectElement>,\n HasRef<HTMLSelectElement>,\n HasRootRef<HTMLLabelElement>,\n HasAlign,\n AdaptivityProps {\n placeholder?: string;\n multiline?: boolean;\n selectType?: keyof typeof SelectType;\n}\n\nexport interface SelectState {\n value?: React.SelectHTMLAttributes<HTMLSelectElement>[\"value\"];\n title?: string;\n notSelected?: boolean;\n}\n\nconst NativeSelectComponent: React.FC<\n NativeSelectProps & AdaptivityContextInterface\n> = ({\n style,\n defaultValue = \"\",\n align,\n placeholder,\n children,\n className,\n getRef,\n getRootRef,\n disabled,\n sizeX,\n sizeY,\n multiline,\n selectType = SelectType.default,\n ...restProps\n}) => {\n const platform = usePlatform();\n const [title, setTitle] = React.useState(\"\");\n const [empty, setEmpty] = React.useState(false);\n const [value, onChange] = useEnsuredControl(restProps, { defaultValue });\n const selectRef = useExternRef(getRef);\n useIsomorphicLayoutEffect(() => {\n const selectedOption =\n selectRef.current?.options[selectRef.current.selectedIndex];\n if (selectedOption) {\n setTitle(selectedOption.text);\n setEmpty(selectedOption.value === \"\" && placeholder != null);\n }\n }, [value, children]);\n\n return (\n <FormField\n Component=\"label\"\n vkuiClass={classNames(\n getClassName(\"Select\", platform),\n `Select--${selectType}`,\n empty && \"Select--empty\",\n multiline && \"Select--multiline\",\n align && `Select--align-${align}`,\n `Select--sizeX-${sizeX}`,\n `Select--sizeY-${sizeY}`\n )}\n className={className}\n style={style}\n getRootRef={getRootRef}\n disabled={disabled}\n after={<DropdownIcon />}\n >\n <select\n {...restProps}\n disabled={disabled}\n vkuiClass=\"Select__el\"\n onChange={onChange}\n value={value}\n ref={selectRef}\n >\n {placeholder && <option value=\"\">{placeholder}</option>}\n {children}\n </select>\n <div vkuiClass=\"Select__container\">\n {/* TODO v5.0.0 поправить под новую адаптивность /}\n <SelectTypography vkuiClass=\"Select__title\">{title}</SelectTypography>\n </div>\n </FormField>\n );\n};\n\n/\n @see https://vkcom.github.io/VKUI/#/NativeSelect\n */\nexport const NativeSelect = withAdaptivity(NativeSelectComponent, {\n sizeX: true,\n sizeY: true,\n});\n"],"file":"NativeSelect.js"}

package/dist/cssm/components/NavTransitionContext/NavTransitionContext.d.ts CHANGED Viewed

@@ -1,7 +1,6 @@
 import * as React from "react";
-interface TransitionContextProps {
+export interface TransitionContextProps {
     entering: boolean;
 }
 export declare const useNavTransition: () => TransitionContextProps;
 export declare const NavTransitionProvider: React.FC<TransitionContextProps>;
-export {};

package/dist/cssm/components/NavTransitionContext/NavTransitionContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/NavTransitionContext/NavTransitionContext.tsx"],"names":["React","useObjectMemo","TransitionContext","createContext","entering","useNavTransition","useContext","NavTransitionProvider","children","parentContext","contextValue"],"mappings":";AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,aAAT;AAKA,IAAMC,iBAAiB,gBAAGF,KAAK,CAACG,aAAN,CAA4C;AACpEC,EAAAA,QAAQ,EAAE;AAD0D,CAA5C,CAA1B;AAGA,OAAO,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB;AAAA,SAAML,KAAK,CAACM,UAAN,CAAiBJ,iBAAjB,CAAN;AAAA,CAAzB;~~AACP~~,OAAO,IAAMK,qBAAuD,GAAG,SAA1DA,qBAA0D,OAGjE;AAAA,MAFJC,QAEI,QAFJA,QAEI;AAAA,MADJJ,QACI,QADJA,QACI;AACJ,MAAMK,aAAa,GAAGJ,gBAAgB,EAAtC;AACA,MAAMK,YAAY,GAAGT,aAAa,CAAC;AACjCG,IAAAA,QAAQ,EAAEK,aAAa,CAACL,QAAd,IAA0BA;AADH,GAAD,CAAlC;AAGA,SACE,oBAAC,iBAAD,CAAmB,QAAnB;AAA4B,IAAA,KAAK,EAAEM;AAAnC,KACGF,QADH,CADF;AAKD,CAbM","sourcesContent":["import * as React from \"react\";\nimport { useObjectMemo } from \"../../hooks/useObjectMemo\";\n\~~ninterface~~ TransitionContextProps {\n entering: boolean;\n}\nconst TransitionContext = React.createContext<TransitionContextProps>({\n entering: false,\n});\nexport const useNavTransition = () => React.useContext(TransitionContext);\nexport const NavTransitionProvider: React.FC<TransitionContextProps> = ({\n children,\n entering,\n}) => {\n const parentContext = useNavTransition();\n const contextValue = useObjectMemo({\n entering: parentContext.entering \|\| entering,\n });\n return (\n <TransitionContext.Provider value={contextValue}>\n {children}\n </TransitionContext.Provider>\n );\n};\n"],"file":"NavTransitionContext.js"}
1	+ {"version":3,"sources":["../../../../src/components/NavTransitionContext/NavTransitionContext.tsx"],"names":["React","useObjectMemo","TransitionContext","createContext","entering","useNavTransition","useContext","NavTransitionProvider","children","parentContext","contextValue"],"mappings":";AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,aAAT;AAKA,IAAMC,iBAAiB,gBAAGF,KAAK,CAACG,aAAN,CAA4C;AACpEC,EAAAA,QAAQ,EAAE;AAD0D,CAA5C,CAA1B;AAGA,OAAO,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB;AAAA,SAAML,KAAK,CAACM,UAAN,CAAiBJ,iBAAjB,CAAN;AAAA,CAAzB;AAEP,OAAO,IAAMK,qBAAuD,GAAG,SAA1DA,qBAA0D,OAGjE;AAAA,MAFJC,QAEI,QAFJA,QAEI;AAAA,MADJJ,QACI,QADJA,QACI;AACJ,MAAMK,aAAa,GAAGJ,gBAAgB,EAAtC;AACA,MAAMK,YAAY,GAAGT,aAAa,CAAC;AACjCG,IAAAA,QAAQ,EAAEK,aAAa,CAACL,QAAd,IAA0BA;AADH,GAAD,CAAlC;AAGA,SACE,oBAAC,iBAAD,CAAmB,QAAnB;AAA4B,IAAA,KAAK,EAAEM;AAAnC,KACGF,QADH,CADF;AAKD,CAbM","sourcesContent":["import * as React from \"react\";\nimport { useObjectMemo } from \"../../hooks/useObjectMemo\";\n\nexport interface TransitionContextProps {\n entering: boolean;\n}\nconst TransitionContext = React.createContext<TransitionContextProps>({\n entering: false,\n});\nexport const useNavTransition = () => React.useContext(TransitionContext);\n\nexport const NavTransitionProvider: React.FC<TransitionContextProps> = ({\n children,\n entering,\n}) => {\n const parentContext = useNavTransition();\n const contextValue = useObjectMemo({\n entering: parentContext.entering \|\| entering,\n });\n return (\n <TransitionContext.Provider value={contextValue}>\n {children}\n </TransitionContext.Provider>\n );\n};\n"],"file":"NavTransitionContext.js"}

package/dist/cssm/components/Pagination/Pagination.css CHANGED Viewed

	@@ -1 +1 @@
1	- .vkuiPagination__list{display:flex;margin:0;padding:0;list-style-type:none}.vkuiPagination__prevButtonContainer{margin-right:8px}.vkuiPagination__nextButtonContainer{margin-left:8px}.vkuiPagination__page{box-sizing:border-box;padding-right:8px;padding-left:8px;width:100%;min-width:40px;border-radius:8px;border-radius:var(--vkui--size_border_radius--regular);text-align:center;color:#818c99;color:var(--vkui--color_text_secondary);-webkit-user-select:none;user-select:none}.vkuiPagination__page--state-hover{background-color:rgba(0,16,61,.04);background-color:var(--vkui--color_transparent--hover)}.vkuiPagination__page--state-active,.vkuiPagination__page--current{color:#000;color:var(--vkui--color_text_primary);background-color:rgba(0,16,61,.08);background-color:var(--vkui--color_transparent--active)}.vkuiPagination__page--disabled{opacity:.4;opacity:var(--vkui--opacity_disable)}.vkuiPagination__page--sizeY-compact{font-size:15px;font-size:var(--vkui--font_text--font_size--compact);line-height:36px;line-height:var(--vkui--size_button_large_height--compact);height:36px;height:var(--vkui--size_button_large_height--compact)~~;letter-spacing:var(--vk-sans-ls-17)~~}.vkuiPagination__page--sizeY-regular{font-size:16px;font-size:var(--vkui--font_text--font_size--regular);line-height:44px;line-height:var(--vkui--size_button_large_height--regular);height:44px;height:var(--vkui--size_button_large_height--regular)~~;letter-spacing:var(--vk-sans-ls-2)~~}.vkuiPagination__page--type-ellipsis{min-width:16px;padding-right:0;padding-left:0}
1	+ .vkuiPagination__list{display:flex;margin:0;padding:0;list-style-type:none}.vkuiPagination__prevButtonContainer{margin-right:8px}.vkuiPagination__nextButtonContainer{margin-left:8px}.vkuiPagination__page{box-sizing:border-box;padding-right:8px;padding-left:8px;width:100%;min-width:40px;border-radius:8px;border-radius:var(--vkui--size_border_radius--regular,8px);text-align:center;color:#818c99;color:var(--vkui--color_text_secondary,#818C99);-webkit-user-select:none;user-select:none}.vkuiPagination__page--state-hover{background-color:rgba(0,16,61,.04);background-color:var(--vkui--color_transparent--hover,rgba(0, 16, 61, 0.04))}.vkuiPagination__page--state-active,.vkuiPagination__page--current{color:#000;color:var(--vkui--color_text_primary,#000000);background-color:rgba(0,16,61,.08);background-color:var(--vkui--color_transparent--active,rgba(0, 16, 61, 0.08))}.vkuiPagination__page--disabled{opacity:.4;opacity:var(--vkui--opacity_disable,0.4)}.vkuiPagination__page--sizeY-compact{font-size:15px;font-size:var(--vkui--font_text--font_size--compact,15px);line-height:36px;line-height:var(--vkui--size_button_large_height--compact,36px);height:36px;height:var(--vkui--size_button_large_height--compact,36px)}.vkuiPagination__page--sizeY-regular{font-size:16px;font-size:var(--vkui--font_text--font_size--regular,16px);line-height:44px;line-height:var(--vkui--size_button_large_height--regular,44px);height:44px;height:var(--vkui--size_button_large_height--regular,44px)}.vkuiPagination__page--type-ellipsis{min-width:16px;padding-right:0;padding-left:0}

package/dist/cssm/components/Pagination/Pagination.d.ts CHANGED Viewed

@@ -39,4 +39,7 @@ export interface PaginationProps extends Omit<React.HTMLAttributes<HTMLElement>,
     getPageAriaLabel?(page: number, isCurrent: boolean): string;
     onChange?(page: number): void;
 }
+/**
+ * @see https://vkcom.github.io/VKUI/#/Pagination
+ */
 export declare const Pagination: React.FC<PaginationProps>;

package/dist/cssm/components/Pagination/Pagination.js CHANGED Viewed

@@ -7,7 +7,7 @@ import { Icon24ChevronCompactLeft, Icon24ChevronCompactRight } from "@vkontakte/
 import { classNames } from "../../lib/classNames";
 import { useAdaptivity } from "../../hooks/useAdaptivity";
 import { usePagination } from "../../hooks/usePagination";
-import Tappable from "../Tappable/Tappable";
+import { Tappable } from "../Tappable/Tappable";
 import { Button } from "../Button/Button";
 import "./Pagination.css";
@@ -15,6 +15,9 @@ function getPageAriaLabelDefault(page, isCurrent) {
   return isCurrent ? "".concat(page, " \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0430") : "\u041F\u0435\u0440\u0435\u0439\u0442\u0438 \u043D\u0430 ".concat(page, " \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0443");
 }
+/**
+ * @see https://vkcom.github.io/VKUI/#/Pagination
+ */
 export var Pagination = function Pagination(_ref) {
   var _ref$currentPage = _ref.currentPage,
       currentPage = _ref$currentPage === void 0 ? 1 : _ref$currentPage,

package/dist/cssm/components/Pagination/Pagination.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/Pagination/Pagination.tsx"],"names":["React","Icon24ChevronCompactLeft","Icon24ChevronCompactRight","classNames","useAdaptivity","usePagination","Tappable","Button","getPageAriaLabelDefault","page","isCurrent","Pagination","currentPage","siblingCount","boundaryCount","totalPages","disabled","getPageAriaLabel","prevButtonAriaLabel","nextButtonAriaLabel","getRootRef","onChange","resetProps","sizeY","pages","isFirstPage","isLastPage","handlePrevClick","useCallback","handleClick","event","currentTarget","dataset","Number","handleNextClick","renderPages","undefined","map"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SACEC,wBADF,EAEEC,yBAFF,QAGO,kBAHP;AAOA,SAASC,UAAT;AAEA,SAASC,aAAT;AACA,SAA6BC,aAA7B;AAEA,~~OAAOC~~,~~QAAP~~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","sourcesContent":["import * as React from \"react\";\nimport {\n Icon24ChevronCompactLeft,\n Icon24ChevronCompactRight,\n} from \"@vkontakte/icons\";\n\nimport type { HasRootRef } from \"../../types\";\n\nimport { classNames } from \"../../lib/classNames\";\n\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { PaginationPageType, usePagination } from \"../../hooks/usePagination\";\n\nimport Tappable from \"../Tappable/Tappable\";\nimport { Button } from \"../Button/Button\";\n\nimport \"./Pagination.css\";\n\nfunction getPageAriaLabelDefault(page: number, isCurrent: boolean): string {\n return isCurrent ? `${page} страница` : `Перейти на ${page} страницу`;\n}\n\nexport interface PaginationProps\n extends Omit<React.HTMLAttributes<HTMLElement>, \"onChange\">,\n HasRootRef<HTMLElement> {\n /*\n Текущая страница.\n /\n currentPage?: number;\n /\n Кол-во всегда видимых страниц по краям текущей страницы.\n /\n siblingCount?: number;\n /\n Кол-во всегда видимых страниц в начале и в конце.\n /\n boundaryCount?: number;\n /\n Общее кол-во страниц.\n /\n totalPages?: number;\n /\n Блокировка всех кнопок.\n /\n disabled?: boolean;\n /\n Переопределение `aria-label` для кнопки навигации назад.\n * По умолчанию используется текст на \"ru_RU\".\n /\n prevButtonAriaLabel?: string;\n /\n Переопределение `aria-label` для кнопки навигации вперёд.\n * По умолчанию используется текст на \"ru_RU\".\n /\n nextButtonAriaLabel?: string;\n /\n Функция для переопределения и/или локализации `aria-label` атрибута.\n * По умолчанию используется текст на \"ru_RU\".\n */\n getPageAriaLabel?(page: number, isCurrent: boolean): string;\n onChange?(page: number): void;\n}\n\nexport const Pagination: React.FC<PaginationProps> = ({\n currentPage = 1,\n siblingCount = 1,\n boundaryCount = 1,\n totalPages = 1,\n disabled,\n getPageAriaLabel = getPageAriaLabelDefault,\n prevButtonAriaLabel = \"Перейти на предыдущую страницу\",\n nextButtonAriaLabel = \"Перейти на следующую страницу\",\n getRootRef,\n onChange,\n ...resetProps\n}) => {\n const { sizeY } = useAdaptivity();\n\n const pages = usePagination({\n currentPage,\n totalPages,\n siblingCount,\n boundaryCount,\n });\n const isFirstPage = currentPage === 1;\n const isLastPage = currentPage === totalPages;\n\n const handlePrevClick = React.useCallback(() => {\n if (onChange && !isFirstPage) {\n onChange(currentPage - 1);\n }\n }, [currentPage, isFirstPage, onChange]);\n\n const handleClick = React.useCallback(\n (event: React.MouseEvent<HTMLElement>) => {\n const page: string = event.currentTarget.dataset.page \|\| \"1\";\n onChange?.(Number(page));\n },\n [onChange]\n );\n\n const handleNextClick = React.useCallback(() => {\n if (onChange && !isLastPage) {\n onChange(currentPage + 1);\n }\n }, [currentPage, isLastPage, onChange]);\n\n const renderPages = React.useCallback(\n (page: PaginationPageType) => {\n switch (page) {\n case \"start-ellipsis\":\n case \"end-ellipsis\":\n return (\n <li key={page}>\n <div\n vkuiClass={classNames(\n \"Pagination__page\",\n \"Pagination__page--type-ellipsis\",\n `Pagination__page--sizeY-${sizeY}`,\n disabled && \"Pagination__page--disabled\"\n )}\n >\n ...\n </div>\n </li>\n );\n default: {\n const isCurrent = page === currentPage;\n return (\n <li key={page}>\n <Tappable\n vkuiClass={classNames(\n \"Pagination__page\",\n `Pagination__page--sizeY-${sizeY}`,\n isCurrent && \"Pagination__page--current\",\n disabled && \"Pagination__page--disabled\"\n )}\n activeMode=\"Pagination__page--state-active\"\n hoverMode=\"Pagination__page--state-hover\"\n hasActive={!isCurrent}\n hasHover={!isCurrent}\n focusVisibleMode=\"outside\"\n disabled={disabled}\n data-page={page}\n aria-current={isCurrent ? true : undefined}\n aria-label={getPageAriaLabel(page, isCurrent)}\n onClick={handleClick}\n >\n {page}\n </Tappable>\n </li>\n );\n }\n }\n },\n [sizeY, currentPage, disabled, getPageAriaLabel, handleClick]\n );\n\n return (\n <nav\n vkuiClass=\"Pagination\"\n role=\"navigation\"\n aria-label=\"Навигация по страницам\"\n ref={getRootRef}\n {...resetProps}\n >\n <ul vkuiClass=\"Pagination__list\">\n <li vkuiClass=\"Pagination__prevButtonContainer\">\n <Button\n size=\"l\"\n before={<Icon24ChevronCompactLeft width={24} />}\n appearance=\"accent\"\n mode=\"tertiary\"\n stretched\n disabled={isFirstPage \|\| disabled}\n aria-label={prevButtonAriaLabel}\n onClick={handlePrevClick}\n />\n </li>\n {pages.map(renderPages)}\n <li vkuiClass=\"Pagination__nextButtonContainer\">\n <Button\n size=\"l\"\n after={<Icon24ChevronCompactRight width={24} />}\n appearance=\"accent\"\n mode=\"tertiary\"\n stretched\n disabled={isLastPage \|\| disabled}\n aria-label={nextButtonAriaLabel}\n onClick={handleNextClick}\n />\n </li>\n </ul>\n </nav>\n );\n};\n"],"file":"Pagination.js"}
1	+ {"version":3,"sources":["../../../../src/components/Pagination/Pagination.tsx"],"names":["React","Icon24ChevronCompactLeft","Icon24ChevronCompactRight","classNames","useAdaptivity","usePagination","Tappable","Button","getPageAriaLabelDefault","page","isCurrent","Pagination","currentPage","siblingCount","boundaryCount","totalPages","disabled","getPageAriaLabel","prevButtonAriaLabel","nextButtonAriaLabel","getRootRef","onChange","resetProps","sizeY","pages","isFirstPage","isLastPage","handlePrevClick","useCallback","handleClick","event","currentTarget","dataset","Number","handleNextClick","renderPages","undefined","map"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport {\n Icon24ChevronCompactLeft,\n Icon24ChevronCompactRight,\n} from \"@vkontakte/icons\";\n\nimport type { HasRootRef } from \"../../types\";\n\nimport { classNames } from \"../../lib/classNames\";\n\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { PaginationPageType, usePagination } from \"../../hooks/usePagination\";\n\nimport { Tappable } from \"../Tappable/Tappable\";\nimport { Button } from \"../Button/Button\";\n\nimport \"./Pagination.css\";\n\nfunction getPageAriaLabelDefault(page: number, isCurrent: boolean): string {\n return isCurrent ? `${page} страница` : `Перейти на ${page} страницу`;\n}\n\nexport interface PaginationProps\n extends Omit<React.HTMLAttributes<HTMLElement>, \"onChange\">,\n HasRootRef<HTMLElement> {\n /*\n Текущая страница.\n /\n currentPage?: number;\n /\n Кол-во всегда видимых страниц по краям текущей страницы.\n /\n siblingCount?: number;\n /\n Кол-во всегда видимых страниц в начале и в конце.\n /\n boundaryCount?: number;\n /\n Общее кол-во страниц.\n /\n totalPages?: number;\n /\n Блокировка всех кнопок.\n /\n disabled?: boolean;\n /\n Переопределение `aria-label` для кнопки навигации назад.\n * По умолчанию используется текст на \"ru_RU\".\n /\n prevButtonAriaLabel?: string;\n /\n Переопределение `aria-label` для кнопки навигации вперёд.\n * По умолчанию используется текст на \"ru_RU\".\n /\n nextButtonAriaLabel?: string;\n /\n Функция для переопределения и/или локализации `aria-label` атрибута.\n * По умолчанию используется текст на \"ru_RU\".\n /\n getPageAriaLabel?(page: number, isCurrent: boolean): string;\n onChange?(page: number): void;\n}\n\n/\n @see https://vkcom.github.io/VKUI/#/Pagination\n */\nexport const Pagination: React.FC<PaginationProps> = ({\n currentPage = 1,\n siblingCount = 1,\n boundaryCount = 1,\n totalPages = 1,\n disabled,\n getPageAriaLabel = getPageAriaLabelDefault,\n prevButtonAriaLabel = \"Перейти на предыдущую страницу\",\n nextButtonAriaLabel = \"Перейти на следующую страницу\",\n getRootRef,\n onChange,\n ...resetProps\n}) => {\n const { sizeY } = useAdaptivity();\n\n const pages = usePagination({\n currentPage,\n totalPages,\n siblingCount,\n boundaryCount,\n });\n const isFirstPage = currentPage === 1;\n const isLastPage = currentPage === totalPages;\n\n const handlePrevClick = React.useCallback(() => {\n if (onChange && !isFirstPage) {\n onChange(currentPage - 1);\n }\n }, [currentPage, isFirstPage, onChange]);\n\n const handleClick = React.useCallback(\n (event: React.MouseEvent<HTMLElement>) => {\n const page: string = event.currentTarget.dataset.page \|\| \"1\";\n onChange?.(Number(page));\n },\n [onChange]\n );\n\n const handleNextClick = React.useCallback(() => {\n if (onChange && !isLastPage) {\n onChange(currentPage + 1);\n }\n }, [currentPage, isLastPage, onChange]);\n\n const renderPages = React.useCallback(\n (page: PaginationPageType) => {\n switch (page) {\n case \"start-ellipsis\":\n case \"end-ellipsis\":\n return (\n <li key={page}>\n <div\n vkuiClass={classNames(\n \"Pagination__page\",\n \"Pagination__page--type-ellipsis\",\n `Pagination__page--sizeY-${sizeY}`,\n disabled && \"Pagination__page--disabled\"\n )}\n >\n ...\n </div>\n </li>\n );\n default: {\n const isCurrent = page === currentPage;\n return (\n <li key={page}>\n <Tappable\n vkuiClass={classNames(\n \"Pagination__page\",\n `Pagination__page--sizeY-${sizeY}`,\n isCurrent && \"Pagination__page--current\",\n disabled && \"Pagination__page--disabled\"\n )}\n activeMode=\"Pagination__page--state-active\"\n hoverMode=\"Pagination__page--state-hover\"\n hasActive={!isCurrent}\n hasHover={!isCurrent}\n focusVisibleMode=\"outside\"\n disabled={disabled}\n data-page={page}\n aria-current={isCurrent ? true : undefined}\n aria-label={getPageAriaLabel(page, isCurrent)}\n onClick={handleClick}\n >\n {page}\n </Tappable>\n </li>\n );\n }\n }\n },\n [sizeY, currentPage, disabled, getPageAriaLabel, handleClick]\n );\n\n return (\n <nav\n vkuiClass=\"Pagination\"\n role=\"navigation\"\n aria-label=\"Навигация по страницам\"\n ref={getRootRef}\n {...resetProps}\n >\n <ul vkuiClass=\"Pagination__list\">\n <li vkuiClass=\"Pagination__prevButtonContainer\">\n <Button\n size=\"l\"\n before={<Icon24ChevronCompactLeft width={24} />}\n appearance=\"accent\"\n mode=\"tertiary\"\n stretched\n disabled={isFirstPage \|\| disabled}\n aria-label={prevButtonAriaLabel}\n onClick={handlePrevClick}\n />\n </li>\n {pages.map(renderPages)}\n <li vkuiClass=\"Pagination__nextButtonContainer\">\n <Button\n size=\"l\"\n after={<Icon24ChevronCompactRight width={24} />}\n appearance=\"accent\"\n mode=\"tertiary\"\n stretched\n disabled={isLastPage \|\| disabled}\n aria-label={nextButtonAriaLabel}\n onClick={handleNextClick}\n />\n </li>\n </ul>\n </nav>\n );\n};\n"],"file":"Pagination.js"}

package/dist/cssm/components/Panel/Panel.css CHANGED Viewed

	@@ -1 +1 @@
1	- .vkuiPanel{position:relative;width:100%;height:100%}.vkuiPanel::after{position:absolute;width:100%;height:100%;left:0;top:0;z-index:1;content:""}.vkuiPanel--centered .vkuiPanelHeader{position:absolute;left:0;top:0;width:100%}.vkuiPanel__in{position:relative;box-sizing:border-box;width:100%;min-height:100%;z-index:2;display:flex;flex-direction:column}.vkuiPanel__centered{display:flex;flex:1 0;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box}.vkuiPanel__centered .vkuiPanelHeader--ios.vkuiPanelHeader--vis+{margin-top:52px;margin-top:var(--panelheader_height_ios)}.vkuiPanel__centered .vkuiPanelHeader--android.vkuiPanelHeader--vis+,.vkuiPanel__centered .vkuiPanelHeader--vkcom.vkuiPanelHeader--vis+{margin-top:56px;margin-top:var(--~~panelheader_height_android~~)}.vkuiPanel--sizeX-compact .vkuiPanel__centered .vkuiPanelHeader--ios.vkuiPanelHeader--sep+{margin-top:calc(52px + 5px);margin-top:calc(var(--panelheader_height_ios) + 5px)}.vkuiPanel--sizeX-compact .vkuiPanel__centered .vkuiPanelHeader--android.vkuiPanelHeader--sep+{margin-top:calc(56px + 5px);margin-top:calc(var(--~~panelheader_height_android~~) + 5px)}.vkuiPanel--sizeX-compact .vkuiPanel__centered .vkuiPanelHeader--vkcom.vkuiPanelHeader--sep+{margin-top:calc(48px + 5px);margin-top:calc(var(--panelheader_height_vkcom) + 5px)}.vkuiPanel--sizeX-regular .vkuiPanel__centered .vkuiPanelHeader--ios.vkuiPanelHeader--sep+{margin-top:calc(52px + 16px);margin-top:calc(var(--panelheader_height_ios) + 16px)}.vkuiPanel--sizeX-regular .vkuiPanel__centered .vkuiPanelHeader--android.vkuiPanelHeader--sep+{margin-top:calc(56px + 16px);margin-top:calc(var(--~~panelheader_height_android~~) + 16px)}.vkuiPanel--sizeX-regular .vkuiPanel__centered .vkuiPanelHeader--vkcom.vkuiPanelHeader--sep+*{margin-top:calc(48px + 16px);margin-top:calc(var(--panelheader_height_vkcom) + 16px)}.vkuiEpic .vkuiPanel__in{padding-bottom:48px;padding-bottom:var(--tabbar_height);padding-bottom:calc(0px + 48px);padding-bottom:calc(var(--safe-area-inset-bottom) + var(--tabbar_height))}.vkuiPanel__in-before{height:1px;margin-bottom:-1px}.vkuiPanel__separator{position:relative;z-index:3}.vkuiPanel__in-after{height:1px;margin-top:-1px}.vkuiPanel .vkuiPanel__in,.vkuiPanel::after{background-color:#fff;background-color:var(--background_content)}.vkuiPanel.vkuiPanel--regular .vkuiPanel__in,.vkuiPanel.vkuiPanel--regular::after{background-color:transparent}
1	+ .vkuiPanel{position:relative;width:100%;height:100%}.vkuiPanel::after{position:absolute;width:100%;height:100%;left:0;top:0;z-index:1;content:""}.vkuiPanel--centered .vkuiPanelHeader{position:absolute;left:0;top:0;width:100%}.vkuiPanel__in{position:relative;box-sizing:border-box;width:100%;min-height:100%;z-index:2;display:flex;flex-direction:column}.vkuiPanel__centered{display:flex;flex:1 0;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box}.vkuiPanel__centered .vkuiPanelHeader--ios.vkuiPanelHeader--vis+{margin-top:52px;margin-top:var(--panelheader_height_ios)}.vkuiPanel__centered .vkuiPanelHeader--android.vkuiPanelHeader--vis+,.vkuiPanel__centered .vkuiPanelHeader--vkcom.vkuiPanelHeader--vis+{margin-top:56px;margin-top:var(--panelheader_height)}.vkuiPanel--sizeX-compact .vkuiPanel__centered .vkuiPanelHeader--ios.vkuiPanelHeader--sep+{margin-top:calc(52px + 5px);margin-top:calc(var(--panelheader_height_ios) + 5px)}.vkuiPanel--sizeX-compact .vkuiPanel__centered .vkuiPanelHeader--android.vkuiPanelHeader--sep+{margin-top:calc(56px + 5px);margin-top:calc(var(--panelheader_height) + 5px)}.vkuiPanel--sizeX-compact .vkuiPanel__centered .vkuiPanelHeader--vkcom.vkuiPanelHeader--sep+{margin-top:calc(48px + 5px);margin-top:calc(var(--panelheader_height_vkcom) + 5px)}.vkuiPanel--sizeX-regular .vkuiPanel__centered .vkuiPanelHeader--ios.vkuiPanelHeader--sep+{margin-top:calc(52px + 16px);margin-top:calc(var(--panelheader_height_ios) + 16px)}.vkuiPanel--sizeX-regular .vkuiPanel__centered .vkuiPanelHeader--android.vkuiPanelHeader--sep+{margin-top:calc(56px + 16px);margin-top:calc(var(--panelheader_height) + 16px)}.vkuiPanel--sizeX-regular .vkuiPanel__centered .vkuiPanelHeader--vkcom.vkuiPanelHeader--sep+*{margin-top:calc(48px + 16px);margin-top:calc(var(--panelheader_height_vkcom) + 16px)}.vkuiEpic .vkuiPanel__in{padding-bottom:48px;padding-bottom:var(--tabbar_height);padding-bottom:calc(0px + 48px);padding-bottom:calc(var(--safe-area-inset-bottom) + var(--tabbar_height))}.vkuiPanel__in-before{height:1px;margin-bottom:-1px}.vkuiPanel__separator{position:relative;z-index:3}.vkuiPanel__in-after{height:1px;margin-top:-1px}.vkuiPanel .vkuiPanel__in,.vkuiPanel::after{background-color:#fff;background-color:var(--background_content)}.vkuiPanel.vkuiPanel--regular .vkuiPanel__in,.vkuiPanel.vkuiPanel--regular::after{background-color:transparent}

package/dist/cssm/components/Panel/Panel.d.ts CHANGED Viewed

@@ -6,4 +6,7 @@ import "./Panel.css";
 export interface PanelProps extends React.HTMLAttributes<HTMLDivElement>, HasRootRef<HTMLDivElement>, AdaptivityProps, NavIdProps {
     centered?: boolean;
 }
+/**
+ * @see https://vkcom.github.io/VKUI/#/Panel
+ */
 export declare const Panel: React.FC<Pick<PanelProps & AdaptivityContextInterface, "hidden" | "dir" | "nav" | "slot" | "style" | "title" | "color" | "translate" | "prefix" | "children" | "className" | "id" | "lang" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "getRootRef" | "centered"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;

package/dist/cssm/components/Panel/Panel.js CHANGED Viewed

@@ -11,6 +11,10 @@ import { withAdaptivity } from "../../hoc/withAdaptivity";
 import { IOS } from "../../lib/platform";
 import { usePlatform } from "../../hooks/usePlatform";
 import "./Panel.css";
+/**
+ * @see https://vkcom.github.io/VKUI/#/Panel
+ */
 export var Panel = withAdaptivity(function (_ref) {
   var _ref$centered = _ref.centered,
       centered = _ref$centered === void 0 ? false : _ref$centered,

package/dist/cssm/components/Panel/Panel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/Panel/Panel.tsx"],"names":["getClassName","classNames","Touch","TooltipContainer","withAdaptivity","IOS","usePlatform","Panel","centered","children","getRootRef","sizeX","nav","restProps","platform"],"mappings":";;;;;AACA,SAASA,YAAT;AACA,SAASC,UAAT;AACA,SAASC,KAAT;AACA,SAASC,gBAAT;AAEA,SAASC,cAAT;AACA,SAASC,GAAT;AACA,SAASC,WAAT;AAMA;~~AAUA~~,OAAO,IAAMC,KAAK,GAAGH,cAAc,CACjC,gBAA0E;AAAA,2BAAvEI,QAAuE;AAAA,MAAvEA,QAAuE,8BAA5D,KAA4D;AAAA,MAArDC,QAAqD,QAArDA,QAAqD;AAAA,MAA3CC,UAA2C,QAA3CA,UAA2C;AAAA,MAA/BC,KAA+B,QAA/BA,KAA+B;AAAA,MAAxBC,GAAwB,QAAxBA,GAAwB;AAAA,MAAhBC,SAAgB;;AACxE,MAAMC,QAAQ,GAAGR,WAAW,EAA5B;AAEA,SACE,wCACMO,SADN;AAEE,IAAA,GAAG,EAAEH,UAFP,CAGE;AAHF;AAIE,IAAA,SAAS,EAAET,UAAU,CACnBD,YAAY,CAAC,OAAD,EAAUc,QAAV,CADO,mBAETH,KAFS;AAIjB,yBAAmBH;AAJF,8BAKAG,KALA,GAKU,IALV;AAJvB,MAaE,oBAAC,KAAD;AAAO,IAAA,SAAS,EAAER,gBAAlB;AAAoC,IAAA,SAAS,EAAC;AAA9C,KACGW,QAAQ,KAAKT,GAAb,IAAoB;AAAK,IAAA,SAAS,EAAC;AAAf,IADvB,EAEE;AAAK,IAAA,SAAS,EAAC;AAAf,IAFF,EAGGG,QAAQ,GACP;AAAK,IAAA,SAAS,EAAC;AAAf,KAAkCC,QAAlC,CADO,GAGPA,QANJ,EAQE;AAAK,IAAA,SAAS,EAAC;AAAf,IARF,CAbF,CADF;AA0BD,CA9BgC,EA+BjC;AACEE,EAAAA,KAAK,EAAE;AADT,CA/BiC,CAA5B","sourcesContent":["import * as React from \"react\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { Touch } from \"../Touch/Touch\";\nimport { TooltipContainer } from \"../Tooltip/TooltipContainer\";\nimport { HasRootRef } from \"../../types\";\nimport { withAdaptivity } from \"../../hoc/withAdaptivity\";\nimport { IOS } from \"../../lib/platform\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { NavIdProps } from \"../../lib/getNavId\";\nimport {\n AdaptivityContextInterface,\n AdaptivityProps,\n} from \"../AdaptivityProvider/AdaptivityContext\";\nimport \"./Panel.css\";\n\nexport interface PanelProps\n extends React.HTMLAttributes<HTMLDivElement>,\n HasRootRef<HTMLDivElement>,\n AdaptivityProps,\n NavIdProps {\n centered?: boolean;\n}\n\nexport const Panel = withAdaptivity<PanelProps & AdaptivityContextInterface>(\n ({ centered = false, children, getRootRef, sizeX, nav, ...restProps }) => {\n const platform = usePlatform();\n\n return (\n <div\n {...restProps}\n ref={getRootRef}\n // eslint-disable-next-line vkui/no-object-expression-in-arguments\n vkuiClass={classNames(\n getClassName(\"Panel\", platform),\n `Panel--${sizeX}`,\n {\n \"Panel--centered\": centered,\n [`Panel--sizeX-${sizeX}`]: true,\n }\n )}\n >\n <Touch Component={TooltipContainer} vkuiClass=\"Panel__in\">\n {platform === IOS && <div vkuiClass=\"Panel__fade\" />}\n <div vkuiClass=\"Panel__in-before\" />\n {centered ? (\n <div vkuiClass=\"Panel__centered\">{children}</div>\n ) : (\n children\n )}\n <div vkuiClass=\"Panel__in-after\" />\n </Touch>\n </div>\n );\n },\n {\n sizeX: true,\n }\n);\n"],"file":"Panel.js"}
1	+ {"version":3,"sources":["../../../../src/components/Panel/Panel.tsx"],"names":["getClassName","classNames","Touch","TooltipContainer","withAdaptivity","IOS","usePlatform","Panel","centered","children","getRootRef","sizeX","nav","restProps","platform"],"mappings":";;;;;AACA,SAASA,YAAT;AACA,SAASC,UAAT;AACA,SAASC,KAAT;AACA,SAASC,gBAAT;AAEA,SAASC,cAAT;AACA,SAASC,GAAT;AACA,SAASC,WAAT;AAMA;;AAUA;AACA;AACA;AACA,OAAO,IAAMC,KAAK,GAAGH,cAAc,CACjC,gBAA0E;AAAA,2BAAvEI,QAAuE;AAAA,MAAvEA,QAAuE,8BAA5D,KAA4D;AAAA,MAArDC,QAAqD,QAArDA,QAAqD;AAAA,MAA3CC,UAA2C,QAA3CA,UAA2C;AAAA,MAA/BC,KAA+B,QAA/BA,KAA+B;AAAA,MAAxBC,GAAwB,QAAxBA,GAAwB;AAAA,MAAhBC,SAAgB;;AACxE,MAAMC,QAAQ,GAAGR,WAAW,EAA5B;AAEA,SACE,wCACMO,SADN;AAEE,IAAA,GAAG,EAAEH,UAFP,CAGE;AAHF;AAIE,IAAA,SAAS,EAAET,UAAU,CACnBD,YAAY,CAAC,OAAD,EAAUc,QAAV,CADO,mBAETH,KAFS;AAIjB,yBAAmBH;AAJF,8BAKAG,KALA,GAKU,IALV;AAJvB,MAaE,oBAAC,KAAD;AAAO,IAAA,SAAS,EAAER,gBAAlB;AAAoC,IAAA,SAAS,EAAC;AAA9C,KACGW,QAAQ,KAAKT,GAAb,IAAoB;AAAK,IAAA,SAAS,EAAC;AAAf,IADvB,EAEE;AAAK,IAAA,SAAS,EAAC;AAAf,IAFF,EAGGG,QAAQ,GACP;AAAK,IAAA,SAAS,EAAC;AAAf,KAAkCC,QAAlC,CADO,GAGPA,QANJ,EAQE;AAAK,IAAA,SAAS,EAAC;AAAf,IARF,CAbF,CADF;AA0BD,CA9BgC,EA+BjC;AACEE,EAAAA,KAAK,EAAE;AADT,CA/BiC,CAA5B","sourcesContent":["import * as React from \"react\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { Touch } from \"../Touch/Touch\";\nimport { TooltipContainer } from \"../Tooltip/TooltipContainer\";\nimport { HasRootRef } from \"../../types\";\nimport { withAdaptivity } from \"../../hoc/withAdaptivity\";\nimport { IOS } from \"../../lib/platform\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { NavIdProps } from \"../../lib/getNavId\";\nimport {\n AdaptivityContextInterface,\n AdaptivityProps,\n} from \"../AdaptivityProvider/AdaptivityContext\";\nimport \"./Panel.css\";\n\nexport interface PanelProps\n extends React.HTMLAttributes<HTMLDivElement>,\n HasRootRef<HTMLDivElement>,\n AdaptivityProps,\n NavIdProps {\n centered?: boolean;\n}\n\n/*\n @see https://vkcom.github.io/VKUI/#/Panel\n */\nexport const Panel = withAdaptivity<PanelProps & AdaptivityContextInterface>(\n ({ centered = false, children, getRootRef, sizeX, nav, ...restProps }) => {\n const platform = usePlatform();\n\n return (\n <div\n {...restProps}\n ref={getRootRef}\n // eslint-disable-next-line vkui/no-object-expression-in-arguments\n vkuiClass={classNames(\n getClassName(\"Panel\", platform),\n `Panel--${sizeX}`,\n {\n \"Panel--centered\": centered,\n [`Panel--sizeX-${sizeX}`]: true,\n }\n )}\n >\n <Touch Component={TooltipContainer} vkuiClass=\"Panel__in\">\n {platform === IOS && <div vkuiClass=\"Panel__fade\" />}\n <div vkuiClass=\"Panel__in-before\" />\n {centered ? (\n <div vkuiClass=\"Panel__centered\">{children}</div>\n ) : (\n children\n )}\n <div vkuiClass=\"Panel__in-after\" />\n </Touch>\n </div>\n );\n },\n {\n sizeX: true,\n }\n);\n"],"file":"Panel.js"}

package/dist/cssm/components/PanelHeader/PanelHeader.css CHANGED Viewed

	@@ -1 +1 @@
1	- .vkuiPanelHeader{position:relative}.vkuiPanelHeader--vis.vkuiPanelHeader--fixed::before{display:block;content:""}.vkuiPanelHeader:not(.vkuiPanelHeader--vis):not(.vkuiPanelHeader--fixed){height:0}.vkuiPanelHeader__fixed{z-index:10}.vkuiPanelHeader__in{display:flex;justify-content:space-between;align-items:center;white-space:nowrap;position:relative;background:#fff;background:var(--header_background)}.vkuiPanelHeader--trnsp .vkuiPanelHeader__in{background:0 0}.vkuiPanelHeader--shadow .vkuiPanelHeader__in{box-shadow:0 0 4px rgba(0,0,0,.08)}.~~vkuiPanelHeader__left~~{box-sizing:border-box;color:#2688eb;color:var(--header_tint);display:flex;flex-shrink:0}.vkuiPanelHeader__content{overflow:hidden}.vkuiPanelHeader__content>{display:block;overflow:hidden;text-overflow:ellipsis}.vkuiPanelHeader__content-in{color:#000;color:var(--header_text);font-weight:500;font-family:"VK Sans Display",-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--font-display)}.~~vkuiPanelHeader__right~~{display:flex;justify-content:flex-end;box-sizing:border-box;color:#2688eb;color:var(--header_tint)}.vkuiPanelHeader--vkapps .~~vkuiPanelHeader__right~~{min-width:90px}.vkuiPanelHeader--ios~~~.vkuiFixedLayout--top,.vkuiPanelHeader--ios~ .vkuiFixedLayout--top:not(.vkuiPanelHeader__fixed)~~{~~top:calc(52px + 0px);top:calc(var(~~--~~panelheader_height_ios) + var(--safe-area-inset-top))}.vkuiPanelHeader--ios::before,.vkuiPanelHeader--ios .vkuiPanelHeader__in{height~~:~~52px;height:~~var(--panelheader_height_ios)~~;padding-top:0;padding-top:var(--safe-area-inset-top)~~}.vkuiPanelHeader--ios .~~vkuiPanelHeader__left~~{flex-basis:0;flex-shrink:0;flex-grow:1;opacity:1;transition:opacity .3s cubic-bezier(.36,.66,.04,1);transition:opacity .3s var(--ios-easing);padding:4px 0 4px 4px}.vkuiPanelHeader--ios .~~vkuiPanelHeader__left~~ .vkuiPanelHeaderButton+.vkuiPanelHeaderButton--primitive{margin-left:-6px;padding-left:0}.vkuiPanelHeader--ios .vkuiPanelHeader__content{text-align:center;opacity:1;transition:opacity .3s cubic-bezier(.36,.66,.04,1);transition:opacity .3s var(--ios-easing)}.vkuiPanelHeader--ios .vkuiPanelHeader__content-in{font-size:21px~~;line-height:52px;line-height:var(--panelheader_height_ios);letter-spacing:var(--vk-sans-ls-2);font-family:var(--vk-sans-display)~~}.vkuiPanelHeader--ios .vkuiPanelHeader__content>{padding:0 4px}.vkuiPanelHeader--ios.vkuiPanelHeader--no-~~left~~ .vkuiPanelHeader__content>{padding-left:0}.vkuiPanelHeader--ios.vkuiPanelHeader--no-~~left~~ .vkuiPanelHeader__content{padding-left:8px}.vkuiPanelHeader--ios.vkuiPanelHeader--no-~~right~~ .vkuiPanelHeader__content>{padding-right:0}.vkuiPanelHeader--ios.vkuiPanelHeader--no-~~right~~ .vkuiPanelHeader__content{padding-right:8px}.vkuiPanelHeader--ios .~~vkuiPanelHeader__right~~{flex-basis:0;flex-shrink:0;flex-grow:1;opacity:1;transition:opacity .3s cubic-bezier(.36,.66,.04,1);transition:opacity .3s var(--ios-easing);padding:4px 4px 4px 0}.vkuiView--ios .vkuiView__panel--prev .~~vkuiPanelHeader__left~~,.vkuiView--ios .vkuiView__panel--prev .~~vkuiPanelHeader__right~~,.vkuiView--ios .vkuiView__panel--prev .vkuiPanelHeader__content{opacity:0}.vkuiPanelHeader--android~.vkuiFixedLayout--top,.vkuiPanelHeader--android~ .~~vkuiFixedLayout--top~~:not(~~.vkuiPanelHeader__fixed){top~~:calc(56px + 0px);top:calc(var(--panelheader_height_android) + var(--safe-area-inset-top))}.vkuiPanelHeader--android::before,.vkuiPanelHeader--android .vkuiPanelHeader__in{height:56px;height:var(--panelheader_height_android);padding-top:0;padding-top:var(--safe-area-inset-top)}.vkuiPanelHeader--android .vkuiPanelHeader__left:not(:empty){padding:4px 0 4px 4px}.vkuiPanelHeader--android .vkuiPanelHeader__content{align-items:center;flex-grow:1;max-width:100%}.vkuiPanelHeader--android .vkuiPanelHeader__content-in{font-size:23px~~;letter-spacing:var(--vk-sans-ls-25);font-family:var(--vk-sans-display)~~}.vkuiPanelHeader--android .vkuiPanelHeader__content>{padding:0 12px}.vkuiPanelHeader--android .vkuiSearch,.vkuiPanelHeader--vkcom .vkuiSearch{padding:0 4px}.vkuiPanelHeader--android.vkuiPanelHeader--no-~~left~~ .vkuiPanelHeader__content>,.vkuiPanelHeader--vkcom.vkuiPanelHeader--no-~~left~~ .vkuiPanelHeader__content>{padding-left:0}.vkuiPanelHeader--android.vkuiPanelHeader--no-~~left~~ .vkuiPanelHeader__content{padding-left:16px}.vkuiSplitCol--spaced .vkuiPanelHeader--android.vkuiPanelHeader--no-~~left~~:not(.vkuiModalPageHeader__in) .vkuiPanelHeader__content{padding-left:0}.vkuiPanelHeader--android.vkuiPanelHeader--no-~~right~~ .vkuiPanelHeader__content>,.vkuiPanelHeader--vkcom.vkuiPanelHeader--no-~~right~~ .vkuiPanelHeader__content>{padding-right:0}.vkuiPanelHeader--android.vkuiPanelHeader--no-~~right~~ .vkuiPanelHeader__content{padding-right:16px}.vkuiSplitCol--spaced .vkuiPanelHeader--android.vkuiPanelHeader--no-~~right~~:not(.vkuiModalPageHeader__in) .vkuiPanelHeader__content{padding-right:0}.vkuiPanelHeader--android .~~vkuiPanelHeader__right~~:not(:empty),.vkuiPanelHeader--vkcom .~~vkuiPanelHeader__right~~:not(:empty){padding:4px 4px 4px 0}.vkuiPanelHeader--vkcom{position:relative;z-index:10}.vkuiPanelHeader--vkcom~~~.vkuiFixedLayout--top,.~~vkuiPanelHeader--~~vkcom~ .vkuiFixedLayout--top~~:not(.~~vkuiPanelHeader__fixed~~){~~top~~:~~calc~~(~~48px + 0px~~);~~top~~:~~calc(~~var(--~~panelheader_height_vkcom~~) + var(--~~safe~~-~~area~~-~~inset~~-~~top~~))}.vkuiPanelHeader--vkcom.vkuiPanelHeader--sizeX-regular:not(.vkuiModalPageHeader__in) .vkuiPanelHeader__in{border-top-left-radius:8px;border-top-right-radius:8px;box-shadow:0 0 0 1px #e1e3e6 inset;box-shadow:0 0 0 var(--thin-border) var(--input_border) inset;border-bottom:none}.vkuiPanelHeader--vkcom.vkuiPanelHeader--sizeX-regular:not(.vkuiModalPageHeader__in)::after{position:absolute;left:1px;left:var(--thin-border);right:1px;right:var(--thin-border);bottom:0;height:1px;height:var(--thin-border);background-color:#fff;background-color:var(--header_background);content:""}.vkuiPanelHeader--vkcom .vkuiPanelHeader__content{text-align:center}.vkuiPanelHeader--vkcom~~::before,.vkuiPanelHeader--vkcom~~ .~~vkuiPanelHeader__in{height~~:~~48px;height:var(--panelheader_height_vkcom);padding-top:0;padding-top:var(--safe-area-inset-top)}.vkuiPanelHeader--vkcom .vkuiPanelHeader__left:~~not(:empty){padding:0 0 0 4px}.vkuiPanelHeader--vkcom .~~vkuiPanelHeader__left~~,.vkuiPanelHeader--vkcom .~~vkuiPanelHeader__right~~{flex-basis:0;flex-shrink:0;flex-grow:1}
1	+ .vkuiPanelHeader{position:relative}.vkuiPanelHeader--vis.vkuiPanelHeader--fixed::before{display:block;content:""}.vkuiPanelHeader:not(.vkuiPanelHeader--vis):not(.vkuiPanelHeader--fixed){height:0}.vkuiPanelHeader__fixed{z-index:10}.vkuiPanelHeader__in{display:flex;justify-content:space-between;align-items:center;white-space:nowrap;position:relative;background:#fff;background:var(--header_background)}.vkuiPanelHeader--trnsp .vkuiPanelHeader__in{background:0 0}.vkuiPanelHeader--shadow .vkuiPanelHeader__in{box-shadow:0 0 4px rgba(0,0,0,.08)}.vkuiPanelHeader__before{box-sizing:border-box;color:#2688eb;color:var(--header_tint);display:flex;flex-shrink:0}.vkuiPanelHeader__content{overflow:hidden}.vkuiPanelHeader__content>{display:block;overflow:hidden;text-overflow:ellipsis}.vkuiPanelHeader__content-in{color:#000;color:var(--header_text);font-weight:500;font-family:"VK Sans Display",-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--font-display)}.vkuiPanelHeader::before,.vkuiPanelHeader__in{height:56px;height:var(--panelheader_height);padding-top:0;padding-top:var(--safe-area-inset-top)}.vkuiPanelHeader__after{display:flex;justify-content:flex-end;box-sizing:border-box;color:#2688eb;color:var(--header_tint)}.vkuiPanelHeader--vkapps .vkuiPanelHeader__after{min-width:90px}.vkuiPanelHeader--ios{--panelheader_height:var(--panelheader_height_ios)}.vkuiPanelHeader--ios .vkuiPanelHeader__before{flex-basis:0;flex-shrink:0;flex-grow:1;opacity:1;transition:opacity .3s cubic-bezier(.36,.66,.04,1);transition:opacity .3s var(--ios-easing);padding:4px 0 4px 4px}.vkuiPanelHeader--ios .vkuiPanelHeader__before .vkuiPanelHeaderButton+.vkuiPanelHeaderButton--primitive{margin-left:-6px;padding-left:0}.vkuiPanelHeader--ios .vkuiPanelHeader__content{text-align:center;opacity:1;transition:opacity .3s cubic-bezier(.36,.66,.04,1);transition:opacity .3s var(--ios-easing)}.vkuiPanelHeader--ios .vkuiPanelHeader__content-in{font-size:21px}.vkuiPanelHeader--ios .vkuiPanelHeader__content>{padding:0 4px}.vkuiPanelHeader--ios.vkuiPanelHeader--no-before .vkuiPanelHeader__content>{padding-left:0}.vkuiPanelHeader--ios.vkuiPanelHeader--no-before .vkuiPanelHeader__content{padding-left:8px}.vkuiPanelHeader--ios.vkuiPanelHeader--no-after .vkuiPanelHeader__content>{padding-right:0}.vkuiPanelHeader--ios.vkuiPanelHeader--no-after .vkuiPanelHeader__content{padding-right:8px}.vkuiPanelHeader--ios .vkuiPanelHeader__after{flex-basis:0;flex-shrink:0;flex-grow:1;opacity:1;transition:opacity .3s cubic-bezier(.36,.66,.04,1);transition:opacity .3s var(--ios-easing);padding:4px 4px 4px 0}.vkuiView--ios .vkuiView__panel--prev .vkuiPanelHeader__before,.vkuiView--ios .vkuiView__panel--prev .vkuiPanelHeader__after,.vkuiView--ios .vkuiView__panel--prev .vkuiPanelHeader__content{opacity:0}.vkuiPanelHeader--android .vkuiPanelHeader__before:not(:empty){padding:4px 0 4px 4px}.vkuiPanelHeader--android .vkuiPanelHeader__content{align-items:center;flex-grow:1;max-width:100%}.vkuiPanelHeader--android .vkuiPanelHeader__content-in{font-size:23px}.vkuiPanelHeader--android .vkuiPanelHeader__content>{padding:0 12px}.vkuiPanelHeader--android .vkuiSearch,.vkuiPanelHeader--vkcom .vkuiSearch{padding:0 4px}.vkuiPanelHeader--android.vkuiPanelHeader--no-before .vkuiPanelHeader__content>,.vkuiPanelHeader--vkcom.vkuiPanelHeader--no-before .vkuiPanelHeader__content>{padding-left:0}.vkuiPanelHeader--android.vkuiPanelHeader--no-before .vkuiPanelHeader__content{padding-left:16px}.vkuiSplitCol--spaced .vkuiPanelHeader--android.vkuiPanelHeader--no-before:not(.vkuiModalPageHeader__in) .vkuiPanelHeader__content{padding-left:0}.vkuiPanelHeader--android.vkuiPanelHeader--no-after .vkuiPanelHeader__content>,.vkuiPanelHeader--vkcom.vkuiPanelHeader--no-after .vkuiPanelHeader__content>*{padding-right:0}.vkuiPanelHeader--android.vkuiPanelHeader--no-after .vkuiPanelHeader__content{padding-right:16px}.vkuiSplitCol--spaced .vkuiPanelHeader--android.vkuiPanelHeader--no-after:not(.vkuiModalPageHeader__in) .vkuiPanelHeader__content{padding-right:0}.vkuiPanelHeader--android .vkuiPanelHeader__after:not(:empty),.vkuiPanelHeader--vkcom .vkuiPanelHeader__after:not(:empty){padding:4px 4px 4px 0}.vkuiPanelHeader--vkcom{--panelheader_height:var(--panelheader_height_vkcom);position:relative;z-index:10}.vkuiPanelHeader--vkcom.vkuiPanelHeader--sizeX-regular:not(.vkuiModalPageHeader__in)::after{position:absolute;left:1px;left:var(--thin-border);right:1px;right:var(--thin-border);bottom:0;height:1px;height:var(--thin-border);background-color:#fff;background-color:var(--header_background);content:""}.vkuiPanelHeader--vkcom.vkuiPanelHeader--sizeX-regular:not(.vkuiModalPageHeader__in) .vkuiPanelHeader__in{border-top-left-radius:8px;border-top-right-radius:8px;box-shadow:0 0 0 1px #e1e3e6 inset;box-shadow:0 0 0 var(--thin-border) var(--input_border) inset;border-bottom:none}.vkuiPanelHeader--vkcom .vkuiPanelHeader__content{text-align:center}.vkuiPanelHeader--vkcom .vkuiPanelHeader__before:not(:empty){padding:0 0 0 4px}.vkuiPanelHeader--vkcom .vkuiPanelHeader__before,.vkuiPanelHeader--vkcom .vkuiPanelHeader__after{flex-basis:0;flex-shrink:0;flex-grow:1}