https://mobiscroll.com/docs/assets/js/30a5c377.f8401d83.js

1"use strict";(globalThis.webpackChunkmobiscroll_docs=globalThis.webpackChunkmobiscroll_docs||[]).push([[16780],{2978(e,n,i){i.r(n),i.d(n,{assets:()=>p,contentTitle:()=>j,default:()=>f,frontMatter:()=>x,metadata:()=>l,toc:()=>u});const l=JSON.parse('{"id":"jquery/forms/switch","title":"Switch","description":"Mobiscroll Switch for jQuery \u2014 a styled boolean toggle with configurable labels, disabled state, and onChange events.","source":"@site/versioned_docs/version-6.1.0/jquery/forms/switch.md","sourceDirName":"jquery/forms","slug":"/jquery/forms/switch","permalink":"/docs/jquery/forms/switch","draft":false,"unlisted":false,"tags":[],"version":"6.1.0","sidebarPosition":8,"frontMatter":{"sidebar_position":8,"sidebar_label":"Switch","displayed_sidebar":"jquerySidebar","description":"Mobiscroll Switch for jQuery \u2014 a styled boolean toggle with configurable labels, disabled state, and onChange events."},"sidebar":"jquerySidebar","previous":{"title":"Stepper","permalink":"/docs/jquery/forms/stepper"},"next":{"title":"Textarea","permalink":"/docs/jquery/forms/textarea"}}');var s=i(74848),c=i(28453);function o(e){const n={a:"a",admonition:"admonition",code:"code",h3:"h3",li:"li",p:"p",strong:"strong",ul:"ul",...(0,c.R)(),...e.components};return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(n.h3,{id:"opt-color",children:"color"}),"\n",(0,s.jsx)(n.p,{children:'"success" | "light" | "dark" | "primary" | "secondary" | "danger" | "warning" | "info"'}),"\n",(0,s.jsx)(n.p,{children:"Specifies the predefined color of the switch."}),"\n",(0,s.jsxs)(n.p,{children:[(0,s.jsx)(n.strong,{children:"Default value"}),": ",(0,s.jsx)(n.code,{children:"undefined"})]}),"\n",(0,s.jsx)(n.h3,{id:"opt-cssClass",children:"cssClass"}),"\n",(0,s.jsx)(n.p,{children:"string"}),"\n",(0,s.jsx)(n.p,{children:"Specifies a custom CSS class for the component."}),"\n",(0,s.jsxs)(n.p,{children:[(0,s.jsx)(n.strong,{children:"Default value"}),": ",(0,s.jsx)(n.code,{children:"undefined"})]}),"\n",(0,s.jsx)(n.h3,{id:"opt-description",children:"description"}),"\n",(0,s.jsx)(n.p,{children:"string"}),"\n",(0,s.jsx)(n.p,{children:"Specifies the description text of the switch."}),"\n",(0,s.jsxs)(n.p,{children:[(0,s.jsx)(n.strong,{children:"Default value"}),": ",(0,s.jsx)(n.code,{children:"undefined"})]}),"\n",(0,s.jsx)(n.h3,{id:"opt-disabled",children:"disabled"}),"\n",(0,s.jsx)(n.p,{children:"boolean"}),"\n",(0,s.jsx)(n.p,{children:"Specifies the disabled state of the switch."}),"\n",(0,s.jsxs)(n.p,{children:[(0,s.jsx)(n.strong,{children:"Default value"}),": ",(0,s.jsx)(n.code,{children:"false"})]}),"\n",(0,s.jsx)(n.h3,{id:"opt-label",children:"label"}),"\n",(0,s.jsx)(n.p,{children:"string"}),"\n",(0,s.jsx)(n.p,{children:"Specifies the label of the switch."}),"\n",(0,s.jsxs)(n.p,{children:[(0,s.jsx)(n.strong,{children:"Default value"}),": ",(0,s.jsx)(n.code,{children:"undefined"})]}),"\n",(0,s.jsx)(n.h3,{id:"opt-position",children:"position"}),"\n",(0,s.jsx)(n.p,{children:'"end" | "start"'}),"\n",(0,s.jsxs)(n.p,{children:["Sets the position of the switch depending on the ",(0,s.jsx)(n.a,{href:"#localization-rtl",children:"rtl"})," option.\nWhen in left-to-right mode, ",(0,s.jsx)(n.code,{children:"'start'"})," will render the switch to the left, and ",(0,s.jsx)(n.code,{children:"'end'"})," will render it to the right.\nIn right-to-left mode, ",(0,s.jsx)(n.code,{children:"'start'"})," will render the switch to the right, and ",(0,s.jsx)(n.code,{children:"'end'"})," will render it to the left."]}),"\n",(0,s.jsxs)(n.p,{children:[(0,s.jsx)(n.strong,{children:"Default value"}),": ",(0,s.jsx)(n.code,{children:"'end'"})]}),"\n",(0,s.jsx)(n.h3,{id:"opt-theme",children:"theme"}),"\n",(0,s.jsx)(n.p,{children:"string"}),"\n",(0,s.jsx)(n.p,{children:"Specifies the visual appearance of the component."}),"\n",(0,s.jsxs)(n.p,{children:["If it is ",(0,s.jsx)(n.code,{children:"'auto'"})," or ",(0,s.jsx)(n.code,{children:"undefined"}),", the theme will automatically be chosen based on the platform.\nIf custom themes are also present, they will take precedence over the built in themes, e.g. if there's an iOS based custom theme,\nit will be chosen on the iOS platform instead of the default iOS theme."]}),"\n",(0,s.jsx)(n.p,{children:"Supplied themes:"}),"\n",(0,s.jsxs)(n.ul,{children:["\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"'ios'"})," - iOS theme"]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"'material'"})," - Material theme"]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"'windows'"})," - Windows theme"]}),"\n"]}),"\n",(0,s.jsxs)(n.p,{children:["It's possible to ",(0,s.jsx)(n.a,{href:"../theming/sass-variables",children:"modify theme colors"})," or\n",(0,s.jsx)(n.a,{href:"../theming/sass-themes",children:"create custom themes"}),"."]}),"\n",(0,s.jsx)(n.admonition,{type:"info",children:(0,s.jsx)(n.p,{children:"Make sure that the theme you set is included in the downloaded package."})}),"\n",(0,s.jsxs)(n.p,{children:[(0,s.jsx)(n.strong,{children:"Default value"}),": ",(0,s.jsx)(n.code,{children:"undefined"})]}),"\n",(0,s.jsx)(n.h3,{id:"opt-themeVariant",children:"themeVariant"}),"\n",(0,s.jsx)(n.p,{children:'"auto" | "light" | "dark"'}),"\n",(0,s.jsxs)(n.p,{children:["Controls which variant of the ",(0,s.jsx)(n.a,{href:"#opt-theme",children:"theme"})," will be used (light or dark)."]}),"\n",(0,s.jsx)(n.p,{children:"Possible values:"}),"\n",(0,s.jsxs)(n.ul,{children:["\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"'light'"})," - Use the light variant of the theme."]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"'dark'"})," - Use the dark variant of the theme."]}),"\n",(0,s.jsxs)(n.li,{children:[(0,s.jsx)(n.code,{children:"'auto'"})," or ",(0,s.jsx)(n.code,{children:"undefined"})," - Detect the preferred system theme on devices where this is supported."]}),"\n"]}),"\n",(0,s.jsxs)(n.p,{children:["To use the option with custom themes, make sure to create two custom themes, where the dark version has the same name as the light one,\nsuffixed with ",(0,s.jsx)(n.code,{children:"'-dark'"}),", e.g.: ",(0,s.jsx)(n.code,{children:"'my-theme'"})," and ",(0,s.jsx)(n.code,{children:"'my-theme-dark'"}),"."]}),"\n",(0,s.jsxs)(n.p,{children:[(0,s.jsx)(n.strong,{children:"Default value"}),": ",(0,s.jsx)(n.code,{children:"undefined"})]})]})}function t(e={}){const{wrapper:n}={...(0,c.R)(),...e.components};return n?(0,s.jsx)(n,{...e,children:(0,s.jsx)(o,{...e})}):o(e)}function d(e){const n={h3:"h3",li:"li",p:"p",ul:"ul",...(0,c.R)(),...e.components};return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(n.h3,{id:"event-onDestroy",children:"onDestroy"}),"\n",(0,s.jsx)(n.p,{children:"(args: any, inst: any) => void"}),"\n",(0,s.jsx)(n.p,{children:"Triggered when the component is destroyed."}),"\n",(0,s.jsx)(n.p,{children:"Parameters:"}),"\n",(0,s.jsxs)(n.ul,{children:["\n",(0,s.jsxs)(n.li,{children:["\n",(0,s.jsx)(n.p,{children:"args - The event argument object."}),"\n"]}),"\n",(0,s.jsxs)(n.li,{children:["\n",(0,s.jsx)(n.p,{children:"inst - The component instance."}),"\n"]}),"\n"]}),"\n",(0,s.jsx)(n.h3,{id:"event-onInit",children:"onInit"}),"\n",(0,s.jsx)(n.p,{children:"(args: any, inst: any) => void"}),"\n",(0,s.jsx)(n.p,{children:"Triggered when the component is initialized."}),"\n",(0,s.jsx)(n.p,{children:"Parameters:"}),"\n",(0,s.jsxs)(n.ul,{children:["\n",(0,s.jsxs)(n.li,{children:["\n",(0,s.jsx)(n.p,{children:"args - The event argument object."}),"\n"]}),"\n",(0,s.jsxs)(n.li,{children:["\n",(0,s.jsx)(n.p,{children:"inst - The component instance."}),"\n"]}),"\n"]})]})}function r(e={}){const{wrapper:n}={...(0,c.R)(),...e.components};return n?(0,s.jsx)(n,{...e,children:(0,s.jsx)(d,{...e})}):d(e)}function h(e){const n={a:"a",code:"code",h3:"h3",li:"li",p:"p",strong:"strong",ul:"ul",...(0,c.R)(),...e.components};return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(n.h3,{id:"localization-locale",children:"locale"}),"\n",(0,s.jsx)(n.p,{children:(0,s.jsx)(n.a,{href:"#type-MbscLocale",children:"MbscLocale"})}),"\n",(0,s.jsxs)(n.p,{children:["Sets the language of the component. The locale object c

1ontains all the translations for a given language.\nThe built in language modules are listed below. If a language is not listed, it can be provided as a\n",(0,s.jsx)(n.a,{href:"https://mobiscroll.com/docs/core-concepts/localization#language-modules",children:"custom language module"}),"."]}),"\n",(0,s.jsx)(n.p,{children:"Supported values:"}),"\n",(0,s.jsxs)(n.ul,{children:["\n",(0,s.jsxs)(n.li,{children:["Arabic: ",(0,s.jsx)(n.code,{children:"localeAr"}),", ",(0,s.jsx)(n.code,{children:"'ar'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Bulgarian: ",(0,s.jsx)(n.code,{children:"localeBg"}),", ",(0,s.jsx)(n.code,{children:"'bg'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Catalan: ",(0,s.jsx)(n.code,{children:"localeCa"}),", ",(0,s.jsx)(n.code,{children:"'ca'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Czech: ",(0,s.jsx)(n.code,{children:"localeCs"}),", ",(0,s.jsx)(n.code,{children:"'cs'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Chinese: ",(0,s.jsx)(n.code,{children:"localeZh"}),", ",(0,s.jsx)(n.code,{children:"'zh'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Croatian: ",(0,s.jsx)(n.code,{children:"localeHr"}),", ",(0,s.jsx)(n.code,{children:"'hr'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Danish: ",(0,s.jsx)(n.code,{children:"localeDa"}),", ",(0,s.jsx)(n.code,{children:"'da'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Dutch: ",(0,s.jsx)(n.code,{children:"localeNl"}),", ",(0,s.jsx)(n.code,{children:"'nl'"})]}),"\n",(0,s.jsxs)(n.li,{children:["English: ",(0,s.jsx)(n.code,{children:"localeEn"})," or ",(0,s.jsx)(n.code,{children:"undefined"}),", ",(0,s.jsx)(n.code,{children:"'en'"})]}),"\n",(0,s.jsxs)(n.li,{children:["English (UK): ",(0,s.jsx)(n.code,{children:"localeEnGB"}),", ",(0,s.jsx)(n.code,{children:"'en-GB'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Farsi: ",(0,s.jsx)(n.code,{children:"localeFa"}),", ",(0,s.jsx)(n.code,{children:"'fa'"})]}),"\n",(0,s.jsxs)(n.li,{children:["German: ",(0,s.jsx)(n.code,{children:"localeDe"}),", ",(0,s.jsx)(n.code,{children:"'de'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Greek: ",(0,s.jsx)(n.code,{children:"localeEl"}),", ",(0,s.jsx)(n.code,{children:"'el'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Spanish: ",(0,s.jsx)(n.code,{children:"localeEs"}),", ",(0,s.jsx)(n.code,{children:"'es'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Finnish: ",(0,s.jsx)(n.code,{children:"localeFi"}),", ",(0,s.jsx)(n.code,{children:"'fi'"})]}),"\n",(0,s.jsxs)(n.li,{children:["French: ",(0,s.jsx)(n.code,{children:"localeFr"}),", ",(0,s.jsx)(n.code,{children:"'fr'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Hebrew: ",(0,s.jsx)(n.code,{children:"localeHe"}),", ",(0,s.jsx)(n.code,{children:"'he'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Hindi: ",(0,s.jsx)(n.code,{children:"localeHi"}),", ",(0,s.jsx)(n.code,{children:"'hi'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Hungarian: ",(0,s.jsx)(n.code,{children:"localeHu"}),", ",(0,s.jsx)(n.code,{children:"'hu'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Italian: ",(0,s.jsx)(n.code,{children:"localeIt"}),", ",(0,s.jsx)(n.code,{children:"'it'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Japanese: ",(0,s.jsx)(n.code,{children:"localeJa"}),", ",(0,s.jsx)(n.code,{children:"'ja'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Korean: ",(0,s.jsx)(n.code,{children:"localeKo"}),", ",(0,s.jsx)(n.code,{children:"'ko'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Lithuanian: ",(0,s.jsx)(n.code,{children:"localeLt"}),", ",(0,s.jsx)(n.code,{children:"'lt'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Norwegian: ",(0,s.jsx)(n.code,{children:"localeNo"}),", ",(0,s.jsx)(n.code,{children:"'no'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Polish: ",(0,s.jsx)(n.code,{children:"localePl"}),", ",(0,s.jsx)(n.code,{children:"'pl'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Portuguese (Brazilian): ",(0,s.jsx)(n.code,{children:"localePtBR"}),", ",(0,s.jsx)(n.code,{children:"'pt-BR'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Portuguese (European): ",(0,s.jsx)(n.code,{children:"localePtPT"}),", ",(0,s.jsx)(n.code,{children:"'pt-PT'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Romanian: ",(0,s.jsx)(n.code,{children:"localeRo"}),", ",(0,s.jsx)(n.code,{children:"'ro'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Russian: ",(0,s.jsx)(n.code,{children:"localeRu"}),", ",(0,s.jsx)(n.code,{children:"'ru'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Russian (UA): ",(0,s.jsx)(n.code,{children:"localeRuUA"}),", ",(0,s.jsx)(n.code,{children:"'ru-UA'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Slovak: ",(0,s.jsx)(n.code,{children:"localeSk"}),", ",(0,s.jsx)(n.code,{children:"'sk'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Serbian: ",(0,s.jsx)(n.code,{children:"localeSr"}),", ",(0,s.jsx)(n.code,{children:"'sr'"})]}

1),"\n",(0,s.jsxs)(n.li,{children:["Swedish: ",(0,s.jsx)(n.code,{children:"localeSv"}),", ",(0,s.jsx)(n.code,{children:"'sv'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Thai: ",(0,s.jsx)(n.code,{children:"localeTh"}),", ",(0,s.jsx)(n.code,{children:"'th'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Turkish: ",(0,s.jsx)(n.code,{children:"localeTr"}),", ",(0,s.jsx)(n.code,{children:"'tr'"})]}),"\n",(0,s.jsxs)(n.li,{children:["Ukrainian: ",(0,s.jsx)(n.code,{children:"localeUa"}),", ",(0,s.jsx)(n.code,{children:"'ua'"})]}),"\n"]}),"\n",(0,s.jsxs)(n.p,{children:[(0,s.jsx)(n.strong,{children:"Default value"}),": ",(0,s.jsx)(n.code,{children:"undefined"})]}),"\n",(0,s.jsx)(n.h3,{id:"localization-rtl",children:"rtl"}),"\n",(0,s.jsx)(n.p,{children:"boolean"}),"\n",(0,s.jsx)(n.p,{children:"Enables right-to-left display."}),"\n",(0,s.jsxs)(n.p,{children:[(0,s.jsx)(n.strong,{children:"Default value"}),": ",(0,s.jsx)(n.code,{children:"false"})]})]})}function a(e={}){const{wrapper:n}={...(0,c.R)(),...e.components};return n?(0,s.jsx)(n,{...e,children:(0,s.jsx)(h,{...e})}):h(e)}const x={sidebar_position:8,sidebar_label:"Switch",displayed_sidebar:"jquerySidebar",description:"Mobiscroll Switch for jQuery \u2014 a styled boolean toggle with configurable labels, disabled state, and onChange events."},j="Switch",p={},u=[{value:"Usage",id:"usage",level:2},{value:"Auto vs. manual initialization",id:"auto-vs-manual-initialization",level:2},{value:"Options",id:"options",level:2},{value:"Events",id:"events",level:2},{value:"Localization",id:"localization",level:2}];function m(e){const n={a:"a",code:"code",h1:"h1",h2:"h2",header:"header",p:"p",pre:"pre",...(0,c.R)(),...e.components};return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(n.header,{children:(0,s.jsx)(n.h1,{id:"switch",children:"Switch"})}),"\n",(0,s.jsx)(n.p,{children:"The Switch component is a two value control. It is like a physical toggle switch, it has an on and an off state that is represented as a boolean value."}),"\n",(0,s.jsx)(n.h2,{id:"usage",children:"Usage"}),"\n",(0,s.jsxs)(n.p,{children:["Use the ",(0,s.jsx)(n.a,{href:"#opt-label",children:(0,s.jsx)(n.code,{children:"label"})})," option to provide a label to the switch.\nThe switch can be positioned before or after the label using the ",(0,s.jsx)(n.a,{href:"#opt-position",children:(0,s.jsx)(n.code,{children:"position"})})," option."]}),"\n",(0,s.jsxs)(n.p,{children:["All the options can be passed to the switch via ",(0,s.jsx)(n.code,{children:"data-"})," attributes with two exceptions. The exceptions are the ",(0,s.jsx)(n.code,{children:"checked"})," and the ",(0,s.jsx)(n.code,{children:"disabled"})," attributes, that don't need the data- prefix, since the native input supports them."]}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-html",children:'<label>\n    <input type="checkbox" mbsc-switch data-label="The label of the switch" />\n</label>\n\n<label>\n    <input type="checkbox" mbsc-switch data-label="Switch at the start" data-position="start" />\n</label>\n\n<label>\n    <input type="checkbox" mbsc-switch data-label="Switch at the end" data-position="end" />\n</label>\n'})}),"\n",(0,s.jsxs)(n.p,{children:["For being more informative a ",(0,s.jsx)(n.a,{href:"#opt-description",children:"description"})," and a ",(0,s.jsx)(n.a,{href:"#opt-color",children:"color"})," can also be passed to the switch."]}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-html",children:'\x3c!-- Label and description for more info --\x3e\n<label>\n    <input type="checkbox" mbsc-switch data-label="Front door" data-description="Controls the lock of the front door." />\n</label>\n\n\x3c!-- Different color switches --\x3e\n<label>\n    <input type="checkbox" mbsc-switch data-color="danger" data-label="Sync on mobile data" />\n</label>\n<label>\n    <input type="checkbox" mbsc-switch data-color="info" label="Email notification" />\n</label>\n'})}),"\n",(0,s.jsx)(n.h2,{id:"auto-vs-manual-initialization",children:"Auto vs. manual initialization"}),"\n",(0,s.jsxs)(n.p,{children:["If the component is added later to the DOM, e.g. with an AJAX page load, a custom function named ",(0,s.jsx)(n.code,{children:"enhance"})," needs to be called in order to initialize the dynamically added component. When the enhance function is called on a DOM element, all form elements will be initialized inside this element."]}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-js",children:"$.get('/myform', function (responseHtml) {\n    var $page = $('#page');\n    $page.html(responseHtml);\n    // highlight-next-line\n    mobiscroll.enhance($page[0]);\n});\n"})}),"\n",(0,s.jsxs)("div",{className:"option-list",children:[(0,s.jsx)(n.h2,{id:"options",children:"Options"}),(0,s.jsx)(n.p,{children:"Explore the following API options that help you easily configure the Switch component."}),(0,s.jsx)(t,{}),(0,s.jsx)(n.h2,{id:"events",children:"Events"}),(0,s.jsx)(n.p,{children:"The Switch component ships with different event hooks for deep customization. Events are triggered through the lifecycle of the component where you can tie in custom functionality and code."}),(0,s.jsx)(r,{}),(0,s.jsx)(n.h2,{id:"localization",children:"Localization"}),(0,s.jsx)(n.p,{children:"The Switch component is fully localized. This covers date and time format, button copy, rtl and more."}),(0,s.jsx)(a,{})]})]})}function f(e={}){const{wrapper:n}={...(0,c.R)(),...e.components};return n?(0,s.jsx)(n,{...e,children:(0,s.jsx)(m,{...e})}):m(e)}},28453(e,n,i){i.d(n,{R:()=>o,x:()=>t});var l=i(96540);const s={},c=l.createContext(s);function o(e){const n=l.useContext(c);return l.useMemo(function(){return"function"==typeof e?e(n):{...n,...e}},[n,e])}function t(e){let n;return n=e.disableParentContext?"function"==typeof e.components?e.components(s):e.components||s:o(e.components),l.createElement(c.Provider,{value:n},e.children)}}}]);