whoami7 - Manager
:
/
home
/
dataiclx
/
vielorbe.com
/
wp-content
/
plugins
/
surecart
/
dist
/
components
/
esm
/
Upload File:
files >> //home/dataiclx/vielorbe.com/wp-content/plugins/surecart/dist/components/esm/sc-switch.entry.js.map
{"file":"sc-switch.entry.js","mappings":"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","names":[],"sources":["src/components/ui/switch/sc-switch.scss?tag=sc-switch&encapsulation=shadow","src/components/ui/switch/sc-switch.tsx"],"sourcesContent":["/**\n * @prop --width: The width of the switch.\n * @prop --height: The height of the switch.\n * @prop --thumb-size: The size of the thumb.\n */\n:host {\n --height: var(--sc-toggle-size);\n --thumb-size: calc(var(--sc-toggle-size) - 2px);\n --width: calc(var(--height) * 2);\n\n display: block;\n}\n\n.switch {\n display: inline-flex;\n align-items: flex-start;\n gap: 0.7em;\n font-family: var(--sc-input-font-family);\n font-size: var(--sc-input-font-size-medium);\n font-weight: var(--sc-input-font-weight);\n color: var(--sc-input-color);\n vertical-align: middle;\n cursor: pointer;\n\n &--reversed {\n flex-direction: row-reverse;\n }\n}\n\n.switch--editing {\n cursor: initial;\n}\n\n.switch__control {\n flex: 0 0 auto;\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: var(--width);\n height: var(--height);\n background-color: var(--sc-switch-control-background-color, var(--sc-color-gray-300));\n border: solid var(--sc-input-border-width) var(--sc-switch-border-color, var(--sc-color-gray-300));\n border-radius: var(--height);\n transition: var(--sc-input-transition, var(--sc-transition-medium)) border-color, var(--sc-input-transition, var(--sc-transition-medium)) background-color;\n\n .switch__thumb {\n width: var(--thumb-size);\n height: var(--thumb-size);\n background-color: var(--sc-switch-thumb-background-color, var(--sc-color-white));\n border-radius: 50%;\n border: solid var(--sc-input-border-width) var(--sc-input-border-color);\n transform: translateX(calc(var(--width) / -2 + var(--thumb-size) / 2 - (var(--thumb-size) - var(--height)) / 2));\n transition: var(--sc-input-transition, var(--sc-transition-medium)) transform ease, var(--sc-input-transition, var(--sc-transition-medium)) background-color,\n var(--sc-input-transition, var(--sc-transition-medium)) border-color, var(--sc-input-transition, var(--sc-transition-medium)) box-shadow;\n }\n\n input[type='checkbox'] {\n position: absolute;\n opacity: 0;\n padding: 0;\n margin: 0;\n pointer-events: none;\n }\n\n &:has(:focus-visible) {\n outline: 2px solid var(--sc-focus-ring-color-primary);\n outline-offset: 2px;\n }\n}\n\n// Hover\n.switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover {\n background-color: var(--sc-switch-control-hover-background-color, var(--sc-color-gray-200));\n border-color: var(--sc-switch-control-hover-border-color, var(--sc-color-gray-200));\n\n .switch__thumb {\n background-color: var(--sc-switch-background-thumb-hover-color, var(--sc-color-white));\n border-color: var(--sc-switch-thumb-border-color, var(--sc-input-border-color));\n }\n}\n\n// Focus\n.switch.switch--focused:not(.switch--checked):not(.switch--disabled) .switch__control {\n background-color: var(--sc-switch-control-hover-background-color, var(--sc-color-gray-200));\n border-color: var(--sc-switch-control-hover-border-color, var(--sc-color-gray-200));\n\n .switch__thumb {\n background-color: var(--sc-color-white);\n border-color: var(--sc-color-gray-300);\n box-shadow: 0 0 0 1px var(--sc-color-gray-300);\n }\n}\n\n// Checked\n.switch--checked .switch__control {\n background-color: var(--sc-switch-checked-control-background-color, var(--sc-color-primary-500));\n border-color: var(--sc-switch-checked-control-border-color, var(--sc-color-primary-500));\n\n .switch__thumb {\n background-color: var(--sc-color-white);\n border-color: var(--sc-color-primary-500);\n transform: translateX(calc(var(--width) / 2 - var(--thumb-size) / 2 + (var(--thumb-size) - var(--height)) / 2));\n }\n}\n\n// Checked + hover\n.switch.switch--checked:not(.switch--disabled) .switch__control:hover {\n opacity: 0.8;\n\n .switch__thumb {\n background-color: var(--sc-color-white);\n border-color: var(--sc-color-primary-500);\n }\n}\n\n// Checked + focus\n.switch.switch--checked:not(.switch--disabled).switch--focused .switch__control {\n .switch__thumb {\n background-color: var(--sc-color-white);\n border-color: var(--sc-color-primary-500);\n box-shadow: 0 0 0 1px var(--sc-focus-ring-color-primary);\n }\n}\n\n// Disabled\n.switch--disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.switch__label {\n user-select: none;\n line-height: var(--height);\n}\n\n.switch--is-required .switch__title:after {\n content: ' *';\n color: var(--sc-color-danger-500);\n}\n\n.switch__title {\n color: var(--sc-swith-label-color, var(--sc-input-label-color));\n font-weight: var(--sc-input-label-font-weight);\n font-size: var(--sc-input-label-font-size-medium);\n}\n\n.switch__description {\n display: none;\n color: var(--sc-switch-description-color, var(--sc-color-gray-500));\n line-height: var(--sc-line-height-dense);\n margin: 0.5em 0 0;\n font-size: var(--sc-font-size-small);\n}\n.switch--has-description {\n .switch__description {\n display: block;\n }\n}\n\nslot[name='description']::slotted(*) {\n margin: 0.75em 0;\n line-height: var(--sc-line-height-dense);\n vertical-align: center;\n}\n","import { Component, Prop, Event, EventEmitter, h, State, Watch, Element, Method } from '@stencil/core';\nimport { FormSubmitController } from '../../../functions/form-data';\n\nlet id = 0;\n\n@Component({\n tag: 'sc-switch',\n styleUrl: 'sc-switch.scss',\n shadow: true,\n})\nexport class ScSwitch {\n @Element() el: HTMLScSwitchElement;\n private formController: any;\n private input: HTMLInputElement;\n private switchId: string = `switch-${++id}`;\n private labelId = `switch-label-${id}`;\n /** Does it have a description? */\n @State() hasDescription: boolean;\n\n @State() private hasFocus: boolean = false;\n\n /** The switch's name attribute. */\n @Prop({ reflect: true }) name: string;\n\n /** The switch's value attribute. */\n @Prop() value: string;\n\n /** Disables the switch. */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /** Makes the switch a required field. */\n @Prop({ reflect: true }) required: boolean = false;\n\n /** Draws the switch in a checked state. */\n @Prop({ reflect: true, mutable: true }) checked: boolean = false;\n\n /** This will be true when the control is in an invalid state. Validity is determined by the `required` prop. */\n @Prop({ reflect: true, mutable: true }) invalid: boolean = false;\n\n @Prop() reversed: boolean;\n\n /** This will be true as a workaround in the block editor to focus on the content. */\n @Prop() edit: boolean = false;\n\n /** Emitted when the control loses focus. */\n @Event() scBlur: EventEmitter<void>;\n\n /** Emitted when the control's checked state changes. */\n @Event() scChange: EventEmitter<void>;\n\n /** Emitted when the control gains focus. */\n @Event() scFocus: EventEmitter<void>;\n\n /** Checks for validity and shows the browser's validation message if the control is invalid. */\n @Method()\n async reportValidity() {\n this.invalid = !this.input.checkValidity();\n return this.input.reportValidity();\n }\n\n handleClick() {\n this.checked = !this.checked;\n this.scChange.emit();\n }\n\n handleBlur() {\n this.hasFocus = false;\n this.scBlur.emit();\n }\n\n handleFocus() {\n this.hasFocus = true;\n this.scFocus.emit();\n }\n\n handleKeyDown(event: KeyboardEvent) {\n if (this.edit) return true;\n\n if (event.key === 'ArrowLeft') {\n event.preventDefault();\n this.checked = false;\n this.scChange.emit();\n }\n\n if (event.key === 'ArrowRight') {\n event.preventDefault();\n this.checked = true;\n this.scChange.emit();\n }\n\n if (event.key === ' ' || event.key === 'Enter') {\n event.preventDefault();\n this.handleClick();\n }\n }\n\n handleMouseDown(event: MouseEvent) {\n if (this.edit) return true;\n\n // Prevent clicks on the label from briefly blurring the input\n event.preventDefault();\n this.input.focus();\n }\n\n @Watch('checked')\n handleCheckedChange() {\n if (this.input) {\n this.input.checked = this.checked;\n this.invalid = !this.input.checkValidity();\n }\n }\n\n componentDidLoad() {\n this.formController = new FormSubmitController(this.el, {\n value: (control: HTMLScChoiceElement) => (control.checked ? control.value : undefined),\n }).addFormData();\n this.hasDescription = !!this.el.querySelector('[slot=\"description\"]');\n }\n\n disconnectedCallback() {\n this.formController?.removeFormData();\n }\n\n render() {\n const Tag = this.edit ? 'div' : 'label';\n return (\n <Tag\n part=\"base\"\n htmlFor={this.switchId}\n class={{\n 'switch': true,\n 'switch--is-required': this.required,\n 'switch--checked': this.checked,\n 'switch--disabled': this.disabled,\n 'switch--focused': this.hasFocus,\n 'switch--reversed': this.reversed,\n 'switch--editing': this.edit,\n 'switch--has-description': this.hasDescription,\n }}\n onMouseDown={e => this.handleMouseDown(e)}\n >\n <span part=\"control\" class=\"switch__control\">\n <span part=\"thumb\" class=\"switch__thumb\"></span>\n <input\n ref={el => (this.input = el as HTMLInputElement)}\n id={this.switchId}\n type=\"checkbox\"\n role=\"switch\"\n name={this.name}\n value={this.value || 'on'}\n checked={this.checked}\n disabled={this.disabled}\n required={this.required}\n aria-checked={this.checked ? 'true' : 'false'}\n aria-labelledby={this.labelId}\n onClick={() => this.handleClick()}\n onBlur={() => this.handleBlur()}\n onFocus={() => this.handleFocus()}\n onKeyDown={e => this.handleKeyDown(e)}\n />\n </span>\n <span class=\"switch__label\">\n <span part=\"title\" id={this.labelId} class=\"switch__title\">\n <slot></slot>\n </span>\n <span class=\"switch__description\" part=\"description\">\n <slot name=\"description\"></slot>\n </span>\n </span>\n </Tag>\n );\n }\n}\n"],"version":3}
Copyright ©2021 || Defacer Indonesia