@sandlada/mdc/build/components/focus-ring/focus-ring.js

@sandlada/mdc is an open source component library that follows the Material Design 3 design specifications.

import{_ as t}from"../../tslib.es6-CmLYFWVC.js";import{i as e}from"../../lit-element-Ho-VPzO1.js";import{t as o}from"../../custom-element-Dz3n6kSt.js";import{n as s}from"../../property-Ck1wIidx.js";import{AttachableController as i}from"../../utils/controller/attachable-controller.js";import{styles as r}from"./focus-ring.style.js";import"../../easing-5hHInU7b.js";import"../../component-definitions/focus-ring.definition.js";import"../../color-CigMJnjV.js";import"../../duration-CDKuKTyT.js";import"../../shape-CrZ0CLVJ.js";import"../../utils/tokens/create-logic-shape-tokens.js";import"../../utils/tokens/create-wrapped-tokens.js";import"../../utils/tokens/string-tokens.js";let n=class extends e{constructor(){super(...arguments),this.inward=!1,this.shapeInherit=!0,this.attachableController=new i(this,this.onControlChange.bind(this)),this.focusRingEvents=["focusin","focusout","pointerdown"]}static{this.styles=r}get htmlFor(){return this.attachableController.htmlFor}set htmlFor(t){this.attachableController.htmlFor=t}get control(){return this.attachableController.control}set control(t){this.attachableController.control=t}attach(t){this.attachableController.attach(t)}detach(){this.attachableController.detach()}get visible(){return this.hasAttribute("visible")}set visible(t){this.toggleAttribute("visible",t)}onControlChange(t,e){for(const o of this.focusRingEvents)t?.removeEventListener(o,this.handleEvent.bind(this)),e?.addEventListener(o,this.handleEvent.bind(this))}handleEvent(t){switch(t.type){case"focusin":this.visible=this.control?.matches(":focus-visible")??!1;break;case"focusout":case"pointerdown":this.visible=!1}}};t([s({type:Boolean})],n.prototype,"inward",void 0),t([s({type:Boolean,reflect:!0,attribute:"shape-inherit"})],n.prototype,"shapeInherit",void 0),n=t([o("mdc-focus-ring")],n);export{n as FocusRing};