create divider

This commit is contained in:
OfficialDakari 2025-04-03 18:19:40 +05:00
parent 2ecb81105d
commit 84f4c3bf46
44 changed files with 8021 additions and 7941 deletions

View File

@ -1 +1 @@
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./react-you-ui22.js"),s=require("./react-you-ui24.js"),i=require("./react-you-ui10.js"),c=require("./react-you-ui14.js"),p=require("./react-you-ui23.js"),u=require("./react-you-ui11.js"),a=require("./react-you-ui16.js"),m=require("./react-you-ui12.js"),h=require("./react-you-ui17.js"),l=require("./react-you-ui26.js"),q=require("./react-you-ui3.js"),_=require("./react-you-ui21.js"),e=require("./react-you-ui25.js"),t=require("./react-you-ui19.js"),n=require("./react-you-ui20.js"),B=require("./react-you-ui18.js"),T=require("./react-you-ui15.js"),d=require("./react-you-ui4.js"),C=require("./react-you-ui8.js"),F=require("./react-you-ui9.js"),b=require("./react-you-ui5.js"),o=require("./react-you-ui6.js"),g=require("./react-you-ui13.js");exports.TextField=r.TextField;exports.Button=s.Button;exports.Checkbox=i.Checkbox;exports.Radio=c.Radio;exports.Select=p.Select;exports.Switch=u.Switch;exports.Slider=a.Slider;exports.Dialog=m.Dialog;exports.List=h.List;exports.Box=l.Box;exports.Typography=q.Typography;exports.IconButton=_.IconButton;exports.AssistChip=e.AssistChip;exports.ChipSet=e.ChipSet;exports.FilterChip=e.FilterChip;exports.InputChip=e.InputChip;exports.BrandedFAB=t.BrandedFAB;exports.FAB=t.FAB;exports.Tab=n.Tab;exports.Tabs=n.Tabs;exports.CircularProgress=B.CircularProgress;exports.Menu=T.Menu;exports.Paper=d.Paper;exports.FormLabel=C.FormLabel;exports.AppBar=F.AppBar;exports.Link=b.Link;exports.ThemeProvider=o.ThemeProvider;exports.usePalette=o.usePalette;exports.useTheme=o.useTheme;exports.createTheme=g.createTheme; "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./react-you-ui23.js"),s=require("./react-you-ui25.js"),i=require("./react-you-ui11.js"),c=require("./react-you-ui15.js"),p=require("./react-you-ui24.js"),u=require("./react-you-ui12.js"),a=require("./react-you-ui17.js"),m=require("./react-you-ui13.js"),h=require("./react-you-ui18.js"),l=require("./react-you-ui27.js"),q=require("./react-you-ui3.js"),_=require("./react-you-ui22.js"),e=require("./react-you-ui26.js"),t=require("./react-you-ui20.js"),n=require("./react-you-ui21.js"),B=require("./react-you-ui19.js"),T=require("./react-you-ui16.js"),d=require("./react-you-ui4.js"),C=require("./react-you-ui8.js"),F=require("./react-you-ui10.js"),b=require("./react-you-ui5.js"),o=require("./react-you-ui6.js"),g=require("./react-you-ui14.js");exports.TextField=r.TextField;exports.Button=s.Button;exports.Checkbox=i.Checkbox;exports.Radio=c.Radio;exports.Select=p.Select;exports.Switch=u.Switch;exports.Slider=a.Slider;exports.Dialog=m.Dialog;exports.List=h.List;exports.Box=l.Box;exports.Typography=q.Typography;exports.IconButton=_.IconButton;exports.AssistChip=e.AssistChip;exports.ChipSet=e.ChipSet;exports.FilterChip=e.FilterChip;exports.InputChip=e.InputChip;exports.BrandedFAB=t.BrandedFAB;exports.FAB=t.FAB;exports.Tab=n.Tab;exports.Tabs=n.Tabs;exports.CircularProgress=B.CircularProgress;exports.Menu=T.Menu;exports.Paper=d.Paper;exports.FormLabel=C.FormLabel;exports.AppBar=F.AppBar;exports.Link=b.Link;exports.ThemeProvider=o.ThemeProvider;exports.usePalette=o.usePalette;exports.useTheme=o.useTheme;exports.createTheme=g.createTheme;

36
dist/react-you-ui.mjs vendored
View File

@ -1,26 +1,26 @@
import { TextField as e } from "./react-you-ui22.mjs"; import { TextField as e } from "./react-you-ui23.mjs";
import { Button as p } from "./react-you-ui24.mjs"; import { Button as p } from "./react-you-ui25.mjs";
import { Checkbox as x } from "./react-you-ui10.mjs"; import { Checkbox as x } from "./react-you-ui11.mjs";
import { Radio as i } from "./react-you-ui14.mjs"; import { Radio as i } from "./react-you-ui15.mjs";
import { Select as h } from "./react-you-ui23.mjs"; import { Select as h } from "./react-you-ui24.mjs";
import { Switch as l } from "./react-you-ui11.mjs"; import { Switch as l } from "./react-you-ui12.mjs";
import { Slider as u } from "./react-you-ui16.mjs"; import { Slider as u } from "./react-you-ui17.mjs";
import { Dialog as T } from "./react-you-ui12.mjs"; import { Dialog as T } from "./react-you-ui13.mjs";
import { List as d } from "./react-you-ui17.mjs"; import { List as d } from "./react-you-ui18.mjs";
import { Box as F } from "./react-you-ui26.mjs"; import { Box as F } from "./react-you-ui27.mjs";
import { Typography as A } from "./react-you-ui3.mjs"; import { Typography as A } from "./react-you-ui3.mjs";
import { IconButton as S } from "./react-you-ui21.mjs"; import { IconButton as S } from "./react-you-ui22.mjs";
import { AssistChip as L, ChipSet as k, FilterChip as y, InputChip as I } from "./react-you-ui25.mjs"; import { AssistChip as L, ChipSet as k, FilterChip as y, InputChip as I } from "./react-you-ui26.mjs";
import { BrandedFAB as w, FAB as D } from "./react-you-ui19.mjs"; import { BrandedFAB as w, FAB as D } from "./react-you-ui20.mjs";
import { Tab as R, Tabs as j } from "./react-you-ui20.mjs"; import { Tab as R, Tabs as j } from "./react-you-ui21.mjs";
import { CircularProgress as z } from "./react-you-ui18.mjs"; import { CircularProgress as z } from "./react-you-ui19.mjs";
import { Menu as G } from "./react-you-ui15.mjs"; import { Menu as G } from "./react-you-ui16.mjs";
import { Paper as J } from "./react-you-ui4.mjs"; import { Paper as J } from "./react-you-ui4.mjs";
import { FormLabel as N } from "./react-you-ui8.mjs"; import { FormLabel as N } from "./react-you-ui8.mjs";
import { AppBar as Q } from "./react-you-ui9.mjs"; import { AppBar as Q } from "./react-you-ui10.mjs";
import { Link as V } from "./react-you-ui5.mjs"; import { Link as V } from "./react-you-ui5.mjs";
import { ThemeProvider as X, usePalette as Y, useTheme as Z } from "./react-you-ui6.mjs"; import { ThemeProvider as X, usePalette as Y, useTheme as Z } from "./react-you-ui6.mjs";
import { createTheme as $ } from "./react-you-ui13.mjs"; import { createTheme as $ } from "./react-you-ui14.mjs";
export { export {
Q as AppBar, Q as AppBar,
L as AssistChip, L as AssistChip,

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

103
dist/react-you-ui12.js vendored

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

131
dist/react-you-ui13.js vendored
View File

@ -1,76 +1,63 @@
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("./string_utils-Bad7L8P5.js");/** "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const v=require("react/jsx-runtime"),F=require("react"),T=require("./create-component-D9KTUrcf.js"),t=require("./class-map-DV5418hw.js");require("./divider-B6Y1F7cS.js");const s=require("./animation-A38fZ1oY.js"),k=require("./delegate-4958lG3m.js"),D=require("./redispatch-event-C93E51ce.js");/**
* @license * @license
* Copyright 2021 Google LLC * Copyright 2023 Google LLC
* * SPDX-License-Identifier: Apache-2.0
* Licensed under the Apache License, Version 2.0 (the "License"); */const I={dialog:[[[{transform:"translateY(-50px)"},{transform:"translateY(0)"}],{duration:500,easing:s.EASING.EMPHASIZED}]],scrim:[[[{opacity:0},{opacity:.32}],{duration:500,easing:"linear"}]],container:[[[{opacity:0},{opacity:1}],{duration:50,easing:"linear",pseudoElement:"::before"}],[[{height:"35%"},{height:"100%"}],{duration:500,easing:s.EASING.EMPHASIZED,pseudoElement:"::before"}]],headline:[[[{opacity:0},{opacity:0,offset:.2},{opacity:1}],{duration:250,easing:"linear",fill:"forwards"}]],content:[[[{opacity:0},{opacity:0,offset:.2},{opacity:1}],{duration:250,easing:"linear",fill:"forwards"}]],actions:[[[{opacity:0},{opacity:0,offset:.5},{opacity:1}],{duration:300,easing:"linear",fill:"forwards"}]]},O={dialog:[[[{transform:"translateY(0)"},{transform:"translateY(-50px)"}],{duration:150,easing:s.EASING.EMPHASIZED_ACCELERATE}]],scrim:[[[{opacity:.32},{opacity:0}],{duration:150,easing:"linear"}]],container:[[[{height:"100%"},{height:"35%"}],{duration:150,easing:s.EASING.EMPHASIZED_ACCELERATE,pseudoElement:"::before"}],[[{opacity:"1"},{opacity:"0"}],{delay:100,duration:50,easing:"linear",pseudoElement:"::before"}]],headline:[[[{opacity:1},{opacity:0}],{duration:100,easing:"linear",fill:"forwards"}]],content:[[[{opacity:1},{opacity:0}],{duration:100,easing:"linear",fill:"forwards"}]],actions:[[[{opacity:1},{opacity:0}],{duration:100,easing:"linear",fill:"forwards"}]]};/**
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/class p{static harmonize(r,t){const e=i.Hct.fromInt(r),n=i.Hct.fromInt(t),a=i.differenceDegrees(e.hue,n.hue),o=Math.min(a*.5,15),c=i.sanitizeDegreesDouble(e.hue+o*i.rotationDirection(e.hue,n.hue));return i.Hct.from(c,e.chroma,e.tone).toInt()}static hctHue(r,t,e){const n=p.cam16Ucs(r,t,e),a=i.Cam16.fromInt(n),o=i.Cam16.fromInt(r);return i.Hct.from(a.hue,o.chroma,i.lstarFromArgb(r)).toInt()}static cam16Ucs(r,t,e){const n=i.Cam16.fromInt(r),a=i.Cam16.fromInt(t),o=n.jstar,c=n.astar,f=n.bstar,C=a.jstar,d=a.astar,y=a.bstar,l=o+(C-o)*e,g=c+(d-c)*e,H=f+(y-f)*e;return i.Cam16.fromUcs(l,g,H).toInt()}}/**
* @license * @license
* Copyright 2021 Google LLC * Copyright 2023 Google LLC
* * SPDX-License-Identifier: Apache-2.0
* Licensed under the Apache License, Version 2.0 (the "License"); */const $=k.mixinDelegatesAria(t.r);let n=class extends ${get open(){return this.isOpen}set open(e){e!==this.isOpen&&(this.isOpen=e,e?(this.setAttribute("open",""),this.show()):(this.removeAttribute("open"),this.close()))}constructor(){super(),this.quick=!1,this.returnValue="",this.noFocusTrap=!1,this.getOpenAnimation=()=>I,this.getCloseAnimation=()=>O,this.isOpen=!1,this.isOpening=!1,this.isConnectedPromise=this.getIsConnectedPromise(),this.isAtScrollTop=!1,this.isAtScrollBottom=!1,this.nextClickIsFromContent=!1,this.hasHeadline=!1,this.hasActions=!1,this.hasIcon=!1,this.escapePressedWithoutCancel=!1,this.treewalker=document.createTreeWalker(this,NodeFilter.SHOW_ELEMENT),this.addEventListener("submit",this.handleSubmit)}async show(){var o;this.isOpening=!0,await this.isConnectedPromise,await this.updateComplete;const e=this.dialog;if(e.open||!this.isOpening){this.isOpening=!1;return}if(!this.dispatchEvent(new Event("open",{cancelable:!0}))){this.open=!1,this.isOpening=!1;return}e.showModal(),this.open=!0,this.scroller&&(this.scroller.scrollTop=0),(o=this.querySelector("[autofocus]"))==null||o.focus(),await this.animateDialog(this.getOpenAnimation()),this.dispatchEvent(new Event("opened")),this.isOpening=!1}async close(e=this.returnValue){if(this.isOpening=!1,!this.isConnected){this.open=!1;return}await this.updateComplete;const i=this.dialog;if(!i.open||this.isOpening){this.open=!1;return}const o=this.returnValue;if(this.returnValue=e,!this.dispatchEvent(new Event("close",{cancelable:!0}))){this.returnValue=o;return}await this.animateDialog(this.getCloseAnimation()),i.close(e),this.open=!1,this.dispatchEvent(new Event("closed"))}connectedCallback(){super.connectedCallback(),this.isConnectedPromiseResolve()}disconnectedCallback(){super.disconnectedCallback(),this.isConnectedPromise=this.getIsConnectedPromise()}render(){const e=this.open&&!(this.isAtScrollTop&&this.isAtScrollBottom),i={"has-headline":this.hasHeadline,"has-actions":this.hasActions,"has-icon":this.hasIcon,scrollable:e,"show-top-divider":e&&!this.isAtScrollTop,"show-bottom-divider":e&&!this.isAtScrollBottom},o=this.open&&!this.noFocusTrap,r=t.x`
* you may not use this file except in compliance with the License. <div
* You may obtain a copy of the License at class="focus-trap"
* tabindex="0"
* http://www.apache.org/licenses/LICENSE-2.0 aria-hidden="true"
* @focus=${this.handleFocusTrapFocus}></div>
* Unless required by applicable law or agreed to in writing, software `,{ariaLabel:l}=this;return t.x`
* distributed under the License is distributed on an "AS IS" BASIS, <div class="scrim"></div>
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. <dialog
* See the License for the specific language governing permissions and class=${t.e$1(i)}
* limitations under the License. aria-label=${l||t.E}
*/class u{static fromInt(r){const t=i.Hct.fromInt(r);return u.fromHct(t)}static fromHct(r){return new u(r.hue,r.chroma,r)}static fromHueAndChroma(r,t){const e=new S(r,t).create();return new u(r,t,e)}constructor(r,t,e){this.hue=r,this.chroma=t,this.keyColor=e,this.cache=new Map}tone(r){let t=this.cache.get(r);return t===void 0&&(t=i.Hct.from(this.hue,this.chroma,r).toInt(),this.cache.set(r,t)),t}getHct(r){return i.Hct.fromInt(this.tone(r))}}class S{constructor(r,t){this.hue=r,this.requestedChroma=t,this.chromaCache=new Map,this.maxChromaValue=200}create(){let n=0,a=100;for(;n<a;){const o=Math.floor((n+a)/2),c=this.maxChroma(o)<this.maxChroma(o+1);if(this.maxChroma(o)>=this.requestedChroma-.01)if(Math.abs(n-50)<Math.abs(a-50))a=o;else{if(n===o)return i.Hct.from(this.hue,this.requestedChroma,n);n=o}else c?n=o+1:a=o}return i.Hct.from(this.hue,this.requestedChroma,n)}maxChroma(r){if(this.chromaCache.has(r))return this.chromaCache.get(r);const t=i.Hct.from(this.hue,this.maxChromaValue,r).chroma;return this.chromaCache.set(r,t),t}}/** aria-labelledby=${this.hasHeadline?"headline":t.E}
role=${this.type==="alert"?"alertdialog":t.E}
@cancel=${this.handleCancel}
@click=${this.handleDialogClick}
@close=${this.handleClose}
@keydown=${this.handleKeydown}
.returnValue=${this.returnValue||t.E}>
${o?r:t.E}
<div class="container" @click=${this.handleContentClick}>
<div class="headline">
<div class="icon" aria-hidden="true">
<slot name="icon" @slotchange=${this.handleIconChange}></slot>
</div>
<h2 id="headline" aria-hidden=${!this.hasHeadline||t.E}>
<slot
name="headline"
@slotchange=${this.handleHeadlineChange}></slot>
</h2>
<md-divider></md-divider>
</div>
<div class="scroller">
<div class="content">
<div class="top anchor"></div>
<slot name="content"></slot>
<div class="bottom anchor"></div>
</div>
</div>
<div class="actions">
<md-divider></md-divider>
<slot name="actions" @slotchange=${this.handleActionsChange}></slot>
</div>
</div>
${o?r:t.E}
</dialog>
`}firstUpdated(){this.intersectionObserver=new IntersectionObserver(e=>{for(const i of e)this.handleAnchorIntersection(i)},{root:this.scroller}),this.intersectionObserver.observe(this.topAnchor),this.intersectionObserver.observe(this.bottomAnchor)}handleDialogClick(){if(this.nextClickIsFromContent){this.nextClickIsFromContent=!1;return}this.dispatchEvent(new Event("cancel",{cancelable:!0}))&&this.close()}handleContentClick(){this.nextClickIsFromContent=!0}handleSubmit(e){const i=e.target,{submitter:o}=e;i.method!=="dialog"||!o||this.close(o.getAttribute("value")??this.returnValue)}handleCancel(e){if(e.target!==this.dialog)return;this.escapePressedWithoutCancel=!1;const i=!D.redispatchEvent(this,e);e.preventDefault(),!i&&this.close()}handleClose(){var e;this.escapePressedWithoutCancel&&(this.escapePressedWithoutCancel=!1,(e=this.dialog)==null||e.dispatchEvent(new Event("cancel",{cancelable:!0})))}handleKeydown(e){e.key==="Escape"&&(this.escapePressedWithoutCancel=!0,setTimeout(()=>{this.escapePressedWithoutCancel=!1}))}async animateDialog(e){var A;if((A=this.cancelAnimations)==null||A.abort(),this.cancelAnimations=new AbortController,this.quick)return;const{dialog:i,scrim:o,container:r,headline:l,content:d,actions:c}=this;if(!i||!o||!r||!l||!d||!c)return;const{container:h,dialog:u,scrim:m,headline:p,content:y,actions:b}=e,x=[[i,u??[]],[o,m??[]],[r,h??[]],[l,p??[]],[d,y??[]],[c,b??[]]],g=[];for(const[C,E]of x)for(const _ of E){const w=C.animate(..._);this.cancelAnimations.signal.addEventListener("abort",()=>{w.cancel()}),g.push(w)}await Promise.all(g.map(C=>C.finished.catch(()=>{})))}handleHeadlineChange(e){const i=e.target;this.hasHeadline=i.assignedElements().length>0}handleActionsChange(e){const i=e.target;this.hasActions=i.assignedElements().length>0}handleIconChange(e){const i=e.target;this.hasIcon=i.assignedElements().length>0}handleAnchorIntersection(e){const{target:i,isIntersecting:o}=e;i===this.topAnchor&&(this.isAtScrollTop=o),i===this.bottomAnchor&&(this.isAtScrollBottom=o)}getIsConnectedPromise(){return new Promise(e=>{this.isConnectedPromiseResolve=e})}handleFocusTrapFocus(e){var p;const[i,o]=this.getFirstAndLastFocusableChildren();if(!i||!o){(p=this.dialog)==null||p.focus();return}const r=e.target===this.firstFocusTrap,l=!r,d=e.relatedTarget===i,c=e.relatedTarget===o,h=!d&&!c;if(l&&c||r&&h){i.focus();return}if(r&&d||l&&h){o.focus();return}}getFirstAndLastFocusableChildren(){if(!this.treewalker)return[null,null];let e=null,i=null;for(this.treewalker.currentNode=this.treewalker.root;this.treewalker.nextNode();){const o=this.treewalker.currentNode;S(o)&&(e||(e=o),i=o)}return[e,i]}};t.__decorate([t.n({type:Boolean})],n.prototype,"open",null);t.__decorate([t.n({type:Boolean})],n.prototype,"quick",void 0);t.__decorate([t.n({attribute:!1})],n.prototype,"returnValue",void 0);t.__decorate([t.n()],n.prototype,"type",void 0);t.__decorate([t.n({type:Boolean,attribute:"no-focus-trap"})],n.prototype,"noFocusTrap",void 0);t.__decorate([s.e$1("dialog")],n.prototype,"dialog",void 0);t.__decorate([s.e$1(".scrim")],n.prototype,"scrim",void 0);t.__decorate([s.e$1(".container")],n.prototype,"container",void 0);t.__decorate([s.e$1(".headline")],n.prototype,"headline",void 0);t.__decorate([s.e$1(".content")],n.prototype,"content",void 0);t.__decorate([s.e$1(".actions")],n.prototype,"actions",void 0);t.__decorate([s.r()],n.prototype,"isAtScrollTop",void 0);t.__decorate([s.r()],n.prototype,"isAtScrollBottom",void 0);t.__decorate([s.e$1(".scroller")],n.prototype,"scroller",void 0);t.__decorate([s.e$1(".top.anchor")],n.prototype,"topAnchor",void 0);t.__decorate([s.e$1(".bottom.anchor")],n.prototype,"bottomAnchor",void 0);t.__decorate([s.e$1(".focus-trap")],n.prototype,"firstFocusTrap",void 0);t.__decorate([s.r()],n.prototype,"hasHeadline",void 0);t.__decorate([s.r()],n.prototype,"hasActions",void 0);t.__decorate([s.r()],n.prototype,"hasIcon",void 0);function S(a){var l;const e=":is(button,input,select,textarea,object,:is(a,area)[href],[tabindex],[contenteditable=true])",i=":not(:disabled,[disabled])";return a.matches(e+i+':not([tabindex^="-"])')?!0:!a.localName.includes("-")||!a.matches(i)?!1:((l=a.shadowRoot)==null?void 0:l.delegatesFocus)??!1}/**
* @license * @license
* Copyright 2021 Google LLC * Copyright 2024 Google LLC
* * SPDX-License-Identifier: Apache-2.0
* Licensed under the Apache License, Version 2.0 (the "License"); */const P=t.i$1`:host{border-start-start-radius:var(--md-dialog-container-shape-start-start, var(--md-dialog-container-shape, var(--md-sys-shape-corner-extra-large, 28px)));border-start-end-radius:var(--md-dialog-container-shape-start-end, var(--md-dialog-container-shape, var(--md-sys-shape-corner-extra-large, 28px)));border-end-end-radius:var(--md-dialog-container-shape-end-end, var(--md-dialog-container-shape, var(--md-sys-shape-corner-extra-large, 28px)));border-end-start-radius:var(--md-dialog-container-shape-end-start, var(--md-dialog-container-shape, var(--md-sys-shape-corner-extra-large, 28px)));display:contents;margin:auto;max-height:min(560px,100% - 48px);max-width:min(560px,100% - 48px);min-height:140px;min-width:280px;position:fixed;height:fit-content;width:fit-content}dialog{background:rgba(0,0,0,0);border:none;border-radius:inherit;flex-direction:column;height:inherit;margin:inherit;max-height:inherit;max-width:inherit;min-height:inherit;min-width:inherit;outline:none;overflow:visible;padding:0;width:inherit}dialog[open]{display:flex}::backdrop{background:none}.scrim{background:var(--md-sys-color-scrim, #000);display:none;inset:0;opacity:32%;pointer-events:none;position:fixed;z-index:1}:host([open]) .scrim{display:flex}h2{all:unset;align-self:stretch}.headline{align-items:center;color:var(--md-dialog-headline-color, var(--md-sys-color-on-surface, #1d1b20));display:flex;flex-direction:column;font-family:var(--md-dialog-headline-font, var(--md-sys-typescale-headline-small-font, var(--md-ref-typeface-brand, Roboto)));font-size:var(--md-dialog-headline-size, var(--md-sys-typescale-headline-small-size, 1.5rem));line-height:var(--md-dialog-headline-line-height, var(--md-sys-typescale-headline-small-line-height, 2rem));font-weight:var(--md-dialog-headline-weight, var(--md-sys-typescale-headline-small-weight, var(--md-ref-typeface-weight-regular, 400)));position:relative}slot[name=headline]::slotted(*){align-items:center;align-self:stretch;box-sizing:border-box;display:flex;gap:8px;padding:24px 24px 0}.icon{display:flex}slot[name=icon]::slotted(*){color:var(--md-dialog-icon-color, var(--md-sys-color-secondary, #625b71));fill:currentColor;font-size:var(--md-dialog-icon-size, 24px);margin-top:24px;height:var(--md-dialog-icon-size, 24px);width:var(--md-dialog-icon-size, 24px)}.has-icon slot[name=headline]::slotted(*){justify-content:center;padding-top:16px}.scrollable slot[name=headline]::slotted(*){padding-bottom:16px}.scrollable.has-headline slot[name=content]::slotted(*){padding-top:8px}.container{border-radius:inherit;display:flex;flex-direction:column;flex-grow:1;overflow:hidden;position:relative;transform-origin:top}.container::before{background:var(--md-dialog-container-color, var(--md-sys-color-surface-container-high, #ece6f0));border-radius:inherit;content:"";inset:0;position:absolute}.scroller{display:flex;flex:1;flex-direction:column;overflow:hidden;z-index:1}.scrollable .scroller{overflow-y:scroll}.content{color:var(--md-dialog-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));font-family:var(--md-dialog-supporting-text-font, var(--md-sys-typescale-body-medium-font, var(--md-ref-typeface-plain, Roboto)));font-size:var(--md-dialog-supporting-text-size, var(--md-sys-typescale-body-medium-size, 0.875rem));line-height:var(--md-dialog-supporting-text-line-height, var(--md-sys-typescale-body-medium-line-height, 1.25rem));flex:1;font-weight:var(--md-dialog-supporting-text-weight, var(--md-sys-typescale-body-medium-weight, var(--md-ref-typeface-weight-regular, 400)));height:min-content;position:relative}slot[name=content]::slotted(*){box-sizing:border-box;padding:24px}.anchor{position:absolute}.top.anchor{top:0}.bottom.anchor{bottom:0}.actions{position:relative}slot[name=actions]::slotted(*){box-sizing:border-box;display:flex;gap:8px;justify-content:flex-end;padding:16px 24px 24px}.has-actions slot[name=content]::slotted(*){padding-bottom:8px}md-divider{display:none;position:absolute}.has-headline.show-top-divider .headline md-divider,.has-actions.show-bottom-divider .actions md-divider{display:flex}.headline md-divider{bottom:0}.actions md-divider{top:0}@media(forced-colors: active){dialog{outline:2px solid WindowText}}
* you may not use this file except in compliance with the License. `;/**
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/class s{static of(r){return new s(r,!1)}static contentOf(r){return new s(r,!0)}static fromColors(r){return s.createPaletteFromColors(!1,r)}static contentFromColors(r){return s.createPaletteFromColors(!0,r)}static createPaletteFromColors(r,t){const e=new s(t.primary,r);if(t.secondary){const n=new s(t.secondary,r);e.a2=n.a1}if(t.tertiary){const n=new s(t.tertiary,r);e.a3=n.a1}if(t.error){const n=new s(t.error,r);e.error=n.a1}if(t.neutral){const n=new s(t.neutral,r);e.n1=n.n1}if(t.neutralVariant){const n=new s(t.neutralVariant,r);e.n2=n.n2}return e}constructor(r,t){const e=i.Hct.fromInt(r),n=e.hue,a=e.chroma;t?(this.a1=u.fromHueAndChroma(n,a),this.a2=u.fromHueAndChroma(n,a/3),this.a3=u.fromHueAndChroma(n+60,a/2),this.n1=u.fromHueAndChroma(n,Math.min(a/12,4)),this.n2=u.fromHueAndChroma(n,Math.min(a/6,8))):(this.a1=u.fromHueAndChroma(n,Math.max(48,a)),this.a2=u.fromHueAndChroma(n,16),this.a3=u.fromHueAndChroma(n+60,24),this.n1=u.fromHueAndChroma(n,4),this.n2=u.fromHueAndChroma(n,8)),this.error=u.fromHueAndChroma(25,84)}}/**
* @license * @license
* Copyright 2021 Google LLC * Copyright 2023 Google LLC
* * SPDX-License-Identifier: Apache-2.0
* Licensed under the Apache License, Version 2.0 (the "License"); */let f=class extends n{};f.styles=[P];f=t.__decorate([t.t$1("md-dialog")],f);const N=T.o({react:F,tagName:"md-dialog",elementClass:f,events:{onClose:"close",onShow:"show",onOpen:"open",onOpened:"opened",onClosed:"closed",onCancel:"cancel"}}),L=a=>{const{children:e,quick:i,returnValue:o,noFocusTrap:r,open:l,fullScreen:d,style:c,className:h,id:u,onClose:m,onShow:p,onOpen:y,onOpened:b,onClosed:x,onCancel:g}=a;return v.jsx(N,{quick:i,returnValue:o,noFocusTrap:r,open:l,style:{...c,...d?{width:"100vw",height:"100vh",maxWidth:"100vw",maxHeight:"100vh"}:{}},className:h,id:u,onClose:m,onShow:p,onOpen:y,onOpened:b,onClosed:x,onCancel:g,children:e})},z=a=>v.jsx("div",{slot:"headline",...a,children:a.children}),H=a=>v.jsx("div",{slot:"content",...a,children:a.children}),q=a=>v.jsx("div",{slot:"actions",...a,children:a.children});exports.Dialog=L;exports.DialogActions=q;exports.DialogContent=H;exports.DialogTitle=z;
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/class m{get primary(){return this.props.primary}get onPrimary(){return this.props.onPrimary}get primaryContainer(){return this.props.primaryContainer}get onPrimaryContainer(){return this.props.onPrimaryContainer}get secondary(){return this.props.secondary}get onSecondary(){return this.props.onSecondary}get secondaryContainer(){return this.props.secondaryContainer}get onSecondaryContainer(){return this.props.onSecondaryContainer}get tertiary(){return this.props.tertiary}get onTertiary(){return this.props.onTertiary}get tertiaryContainer(){return this.props.tertiaryContainer}get onTertiaryContainer(){return this.props.onTertiaryContainer}get error(){return this.props.error}get onError(){return this.props.onError}get errorContainer(){return this.props.errorContainer}get onErrorContainer(){return this.props.onErrorContainer}get background(){return this.props.background}get onBackground(){return this.props.onBackground}get surface(){return this.props.surface}get onSurface(){return this.props.onSurface}get surfaceVariant(){return this.props.surfaceVariant}get onSurfaceVariant(){return this.props.onSurfaceVariant}get outline(){return this.props.outline}get outlineVariant(){return this.props.outlineVariant}get shadow(){return this.props.shadow}get scrim(){return this.props.scrim}get inverseSurface(){return this.props.inverseSurface}get inverseOnSurface(){return this.props.inverseOnSurface}get inversePrimary(){return this.props.inversePrimary}static light(r){return m.lightFromCorePalette(s.of(r))}static dark(r){return m.darkFromCorePalette(s.of(r))}static lightContent(r){return m.lightFromCorePalette(s.contentOf(r))}static darkContent(r){return m.darkFromCorePalette(s.contentOf(r))}static lightFromCorePalette(r){return new m({primary:r.a1.tone(40),onPrimary:r.a1.tone(100),primaryContainer:r.a1.tone(90),onPrimaryContainer:r.a1.tone(10),secondary:r.a2.tone(40),onSecondary:r.a2.tone(100),secondaryContainer:r.a2.tone(90),onSecondaryContainer:r.a2.tone(10),tertiary:r.a3.tone(40),onTertiary:r.a3.tone(100),tertiaryContainer:r.a3.tone(90),onTertiaryContainer:r.a3.tone(10),error:r.error.tone(40),onError:r.error.tone(100),errorContainer:r.error.tone(90),onErrorContainer:r.error.tone(10),background:r.n1.tone(99),onBackground:r.n1.tone(10),surface:r.n1.tone(99),onSurface:r.n1.tone(10),surfaceVariant:r.n2.tone(90),onSurfaceVariant:r.n2.tone(30),outline:r.n2.tone(50),outlineVariant:r.n2.tone(80),shadow:r.n1.tone(0),scrim:r.n1.tone(0),inverseSurface:r.n1.tone(20),inverseOnSurface:r.n1.tone(95),inversePrimary:r.a1.tone(80)})}static darkFromCorePalette(r){return new m({primary:r.a1.tone(80),onPrimary:r.a1.tone(20),primaryContainer:r.a1.tone(30),onPrimaryContainer:r.a1.tone(90),secondary:r.a2.tone(80),onSecondary:r.a2.tone(20),secondaryContainer:r.a2.tone(30),onSecondaryContainer:r.a2.tone(90),tertiary:r.a3.tone(80),onTertiary:r.a3.tone(20),tertiaryContainer:r.a3.tone(30),onTertiaryContainer:r.a3.tone(90),error:r.error.tone(80),onError:r.error.tone(20),errorContainer:r.error.tone(30),onErrorContainer:r.error.tone(80),background:r.n1.tone(10),onBackground:r.n1.tone(90),surface:r.n1.tone(10),onSurface:r.n1.tone(90),surfaceVariant:r.n2.tone(30),onSurfaceVariant:r.n2.tone(80),outline:r.n2.tone(60),outlineVariant:r.n2.tone(30),shadow:r.n1.tone(0),scrim:r.n1.tone(0),inverseSurface:r.n1.tone(90),inverseOnSurface:r.n1.tone(20),inversePrimary:r.a1.tone(40)})}constructor(r){this.props=r}toJSON(){return{...this.props}}}/**
* @license
* Copyright 2021 Google LLC
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/function w(h,r=[]){const t=s.of(h);return{source:h,schemes:{light:m.light(h),dark:m.dark(h)},palettes:{primary:t.a1,secondary:t.a2,tertiary:t.a3,neutral:t.n1,neutralVariant:t.n2,error:t.error},customColors:r.map(e=>b(h,e))}}function b(h,r){let t=r.value;const e=t,n=h;r.blend&&(t=p.harmonize(e,n));const o=s.of(t).a1;return{color:r,value:t,light:{color:o.tone(40),onColor:o.tone(100),colorContainer:o.tone(90),onColorContainer:o.tone(10)},dark:{color:o.tone(80),onColor:o.tone(20),colorContainer:o.tone(30),onColorContainer:o.tone(90)}}}function k(h){const r=i.argbFromHex(h);return w(r)}exports.createTheme=k;

View File

@ -1,504 +1,495 @@
import { H as u, d as w, s as k, r as v, C as f, l as V, a as b } from "./string_utils-B4bsIQ5w.mjs"; import { jsx as C } from "react/jsx-runtime";
import S from "react";
import { o as P } from "./create-component-CVXl33PD.mjs";
import { _ as o, n as u, r as $, x as O, c as L, E as h, a as N, b as z } from "./class-map-CwiboTfb.mjs";
import "./divider-Diu_1O5h.mjs";
import { E as b, r as g, a as l } from "./animation-DjClVFum.mjs";
import { m as H } from "./delegate-BXi1gVeU.mjs";
import { r as _ } from "./redispatch-event-taWUbWUt.mjs";
/** /**
* @license * @license
* Copyright 2021 Google LLC * Copyright 2023 Google LLC
* * SPDX-License-Identifier: Apache-2.0
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/ */
class C { const M = {
/** dialog: [
* Blend the design color's HCT hue towards the key color's HCT [
* hue, in a way that leaves the original color recognizable and // Dialog slide down
* recognizably shifted towards the key color. [{ transform: "translateY(-50px)" }, { transform: "translateY(0)" }],
* { duration: 500, easing: b.EMPHASIZED }
* @param designColor ARGB representation of an arbitrary color. ]
* @param sourceColor ARGB representation of the main theme color. ],
* @return The design color with a hue shifted towards the scrim: [
* system's color, a slightly warmer/cooler variant of the design [
* color's hue. // Scrim fade in
*/ [{ opacity: 0 }, { opacity: 0.32 }],
static harmonize(r, t) { { duration: 500, easing: "linear" }
const e = u.fromInt(r), n = u.fromInt(t), a = w(e.hue, n.hue), o = Math.min(a * 0.5, 15), c = k(e.hue + o * v(e.hue, n.hue)); ]
return u.from(c, e.chroma, e.tone).toInt(); ],
} container: [
/** [
* Blends hue from one color into another. The chroma and tone of // Container fade in
* the original color are maintained. [{ opacity: 0 }, { opacity: 1 }],
* { duration: 50, easing: "linear", pseudoElement: "::before" }
* @param from ARGB representation of color ],
* @param to ARGB representation of color [
* @param amount how much blending to perform; 0.0 >= and <= 1.0 // Container grow
* @return from, with a hue blended towards to. Chroma and tone // Note: current spec says to grow from 0dp->100% and shrink from
* are constant. // 100%->35%. We change this to 35%->100% to simplify the animation that
*/ // is supposed to clip content as it grows. From 0dp it's possible to see
static hctHue(r, t, e) { // text/actions appear before the container has fully grown.
const n = C.cam16Ucs(r, t, e), a = f.fromInt(n), o = f.fromInt(r); [{ height: "35%" }, { height: "100%" }],
return u.from(a.hue, o.chroma, V(r)).toInt(); { duration: 500, easing: b.EMPHASIZED, pseudoElement: "::before" }
} ]
/** ],
* Blend in CAM16-UCS space. headline: [
* [
* @param from ARGB representation of color // Headline fade in
* @param to ARGB representation of color [{ opacity: 0 }, { opacity: 0, offset: 0.2 }, { opacity: 1 }],
* @param amount how much blending to perform; 0.0 >= and <= 1.0 { duration: 250, easing: "linear", fill: "forwards" }
* @return from, blended towards to. Hue, chroma, and tone will ]
* change. ],
*/ content: [
static cam16Ucs(r, t, e) { [
const n = f.fromInt(r), a = f.fromInt(t), o = n.jstar, c = n.astar, p = n.bstar, d = a.jstar, y = a.astar, l = a.bstar, g = o + (d - o) * e, S = c + (y - c) * e, H = p + (l - p) * e; // Content fade in
return f.fromUcs(g, S, H).toInt(); [{ opacity: 0 }, { opacity: 0, offset: 0.2 }, { opacity: 1 }],
} { duration: 250, easing: "linear", fill: "forwards" }
} ]
/** ],
* @license actions: [
* Copyright 2021 Google LLC [
* // Actions fade in
* Licensed under the Apache License, Version 2.0 (the "License"); [{ opacity: 0 }, { opacity: 0, offset: 0.5 }, { opacity: 1 }],
* you may not use this file except in compliance with the License. { duration: 300, easing: "linear", fill: "forwards" }
* You may obtain a copy of the License at ]
* ]
* http://www.apache.org/licenses/LICENSE-2.0 }, V = {
* dialog: [
* Unless required by applicable law or agreed to in writing, software [
* distributed under the License is distributed on an "AS IS" BASIS, // Dialog slide up
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. [{ transform: "translateY(0)" }, { transform: "translateY(-50px)" }],
* See the License for the specific language governing permissions and { duration: 150, easing: b.EMPHASIZED_ACCELERATE }
* limitations under the License. ]
*/ ],
class i { scrim: [
/** [
* @param argb ARGB representation of a color // Scrim fade out
* @return Tones matching that color's hue and chroma. [{ opacity: 0.32 }, { opacity: 0 }],
*/ { duration: 150, easing: "linear" }
static fromInt(r) { ]
const t = u.fromInt(r); ],
return i.fromHct(t); container: [
} [
/** // Container shrink
* @param hct Hct [{ height: "100%" }, { height: "35%" }],
* @return Tones matching that color's hue and chroma. {
*/ duration: 150,
static fromHct(r) { easing: b.EMPHASIZED_ACCELERATE,
return new i(r.hue, r.chroma, r); pseudoElement: "::before"
} }
/** ],
* @param hue HCT hue [
* @param chroma HCT chroma // Container fade out
* @return Tones matching hue and chroma. [{ opacity: "1" }, { opacity: "0" }],
*/ { delay: 100, duration: 50, easing: "linear", pseudoElement: "::before" }
static fromHueAndChroma(r, t) { ]
const e = new A(r, t).create(); ],
return new i(r, t, e); headline: [
} [
constructor(r, t, e) { // Headline fade out
this.hue = r, this.chroma = t, this.keyColor = e, this.cache = /* @__PURE__ */ new Map(); [{ opacity: 1 }, { opacity: 0 }],
} { duration: 100, easing: "linear", fill: "forwards" }
/** ]
* @param tone HCT tone, measured from 0 to 100. ],
* @return ARGB representation of a color with that tone. content: [
*/ [
tone(r) { // Content fade out
let t = this.cache.get(r); [{ opacity: 1 }, { opacity: 0 }],
return t === void 0 && (t = u.from(this.hue, this.chroma, r).toInt(), this.cache.set(r, t)), t; { duration: 100, easing: "linear", fill: "forwards" }
} ]
/** ],
* @param tone HCT tone. actions: [
* @return HCT representation of a color with that tone. [
*/ // Actions fade out
getHct(r) { [{ opacity: 1 }, { opacity: 0 }],
return u.fromInt(this.tone(r)); { duration: 100, easing: "linear", fill: "forwards" }
} ]
} ]
class A { };
constructor(r, t) { /**
this.hue = r, this.requestedChroma = t, this.chromaCache = /* @__PURE__ */ new Map(), this.maxChromaValue = 200; * @license
} * Copyright 2023 Google LLC
/** * SPDX-License-Identifier: Apache-2.0
* Creates a key color from a [hue] and a [chroma]. */
* The key color is the first tone, starting from T50, matching the given hue const W = H($);
* and chroma. let s = class extends W {
* // We do not use `delegatesFocus: true` due to a Chromium bug with
* @return Key color [Hct] // selecting text.
*/ // See https://bugs.chromium.org/p/chromium/issues/detail?id=950357
create() { /**
let n = 0, a = 100; * Opens the dialog when set to `true` and closes it when set to `false`.
for (; n < a; ) { */
const o = Math.floor((n + a) / 2), c = this.maxChroma(o) < this.maxChroma(o + 1); get open() {
if (this.maxChroma(o) >= this.requestedChroma - 0.01) return this.isOpen;
if (Math.abs(n - 50) < Math.abs(a - 50)) }
a = o; set open(e) {
else { e !== this.isOpen && (this.isOpen = e, e ? (this.setAttribute("open", ""), this.show()) : (this.removeAttribute("open"), this.close()));
if (n === o) }
return u.from(this.hue, this.requestedChroma, n); constructor() {
n = o; super(), this.quick = !1, this.returnValue = "", this.noFocusTrap = !1, this.getOpenAnimation = () => M, this.getCloseAnimation = () => V, this.isOpen = !1, this.isOpening = !1, this.isConnectedPromise = this.getIsConnectedPromise(), this.isAtScrollTop = !1, this.isAtScrollBottom = !1, this.nextClickIsFromContent = !1, this.hasHeadline = !1, this.hasActions = !1, this.hasIcon = !1, this.escapePressedWithoutCancel = !1, this.treewalker = document.createTreeWalker(this, NodeFilter.SHOW_ELEMENT), this.addEventListener("submit", this.handleSubmit);
} }
else /**
c ? n = o + 1 : a = o; * Opens the dialog and fires a cancelable `open` event. After a dialog's
} * animation, an `opened` event is fired.
return u.from(this.hue, this.requestedChroma, n); *
} * Add an `autofocus` attribute to a child of the dialog that should
// Find the maximum chroma for a given tone * receive focus after opening.
maxChroma(r) { *
if (this.chromaCache.has(r)) * @return A Promise that resolves after the animation is finished and the
return this.chromaCache.get(r); * `opened` event was fired.
const t = u.from(this.hue, this.maxChromaValue, r).chroma; */
return this.chromaCache.set(r, t), t; async show() {
} var i;
} this.isOpening = !0, await this.isConnectedPromise, await this.updateComplete;
/** const e = this.dialog;
* @license if (e.open || !this.isOpening) {
* Copyright 2021 Google LLC this.isOpening = !1;
* return;
* Licensed under the Apache License, Version 2.0 (the "License"); }
* you may not use this file except in compliance with the License. if (!this.dispatchEvent(new Event("open", { cancelable: !0 }))) {
* You may obtain a copy of the License at this.open = !1, this.isOpening = !1;
* return;
* http://www.apache.org/licenses/LICENSE-2.0 }
* e.showModal(), this.open = !0, this.scroller && (this.scroller.scrollTop = 0), (i = this.querySelector("[autofocus]")) == null || i.focus(), await this.animateDialog(this.getOpenAnimation()), this.dispatchEvent(new Event("opened")), this.isOpening = !1;
* Unless required by applicable law or agreed to in writing, software }
* distributed under the License is distributed on an "AS IS" BASIS, /**
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * Closes the dialog and fires a cancelable `close` event. After a dialog's
* See the License for the specific language governing permissions and * animation, a `closed` event is fired.
* limitations under the License. *
*/ * @param returnValue A return value usually indicating which button was used
class s { * to close a dialog. If a dialog is canceled by clicking the scrim or
/** * pressing Escape, it will not change the return value after closing.
* @param argb ARGB representation of a color * @return A Promise that resolves after the animation is finished and the
*/ * `closed` event was fired.
static of(r) { */
return new s(r, !1); async close(e = this.returnValue) {
} if (this.isOpening = !1, !this.isConnected) {
/** this.open = !1;
* @param argb ARGB representation of a color return;
*/ }
static contentOf(r) { await this.updateComplete;
return new s(r, !0); const t = this.dialog;
} if (!t.open || this.isOpening) {
/** this.open = !1;
* Create a [CorePalette] from a set of colors return;
*/ }
static fromColors(r) { const i = this.returnValue;
return s.createPaletteFromColors(!1, r); if (this.returnValue = e, !this.dispatchEvent(new Event("close", { cancelable: !0 }))) {
} this.returnValue = i;
/** return;
* Create a content [CorePalette] from a set of colors }
*/ await this.animateDialog(this.getCloseAnimation()), t.close(e), this.open = !1, this.dispatchEvent(new Event("closed"));
static contentFromColors(r) { }
return s.createPaletteFromColors(!0, r); connectedCallback() {
} super.connectedCallback(), this.isConnectedPromiseResolve();
static createPaletteFromColors(r, t) { }
const e = new s(t.primary, r); disconnectedCallback() {
if (t.secondary) { super.disconnectedCallback(), this.isConnectedPromise = this.getIsConnectedPromise();
const n = new s(t.secondary, r); }
e.a2 = n.a1; render() {
} const e = this.open && !(this.isAtScrollTop && this.isAtScrollBottom), t = {
if (t.tertiary) { "has-headline": this.hasHeadline,
const n = new s(t.tertiary, r); "has-actions": this.hasActions,
e.a3 = n.a1; "has-icon": this.hasIcon,
} scrollable: e,
if (t.error) { "show-top-divider": e && !this.isAtScrollTop,
const n = new s(t.error, r); "show-bottom-divider": e && !this.isAtScrollBottom
e.error = n.a1; }, i = this.open && !this.noFocusTrap, a = O`
} <div
if (t.neutral) { class="focus-trap"
const n = new s(t.neutral, r); tabindex="0"
e.n1 = n.n1; aria-hidden="true"
} @focus=${this.handleFocusTrapFocus}></div>
if (t.neutralVariant) { `, { ariaLabel: r } = this;
const n = new s(t.neutralVariant, r); return O`
e.n2 = n.n2; <div class="scrim"></div>
} <dialog
return e; class=${L(t)}
} aria-label=${r || h}
constructor(r, t) { aria-labelledby=${this.hasHeadline ? "headline" : h}
const e = u.fromInt(r), n = e.hue, a = e.chroma; role=${this.type === "alert" ? "alertdialog" : h}
t ? (this.a1 = i.fromHueAndChroma(n, a), this.a2 = i.fromHueAndChroma(n, a / 3), this.a3 = i.fromHueAndChroma(n + 60, a / 2), this.n1 = i.fromHueAndChroma(n, Math.min(a / 12, 4)), this.n2 = i.fromHueAndChroma(n, Math.min(a / 6, 8))) : (this.a1 = i.fromHueAndChroma(n, Math.max(48, a)), this.a2 = i.fromHueAndChroma(n, 16), this.a3 = i.fromHueAndChroma(n + 60, 24), this.n1 = i.fromHueAndChroma(n, 4), this.n2 = i.fromHueAndChroma(n, 8)), this.error = i.fromHueAndChroma(25, 84); @cancel=${this.handleCancel}
} @click=${this.handleDialogClick}
} @close=${this.handleClose}
/** @keydown=${this.handleKeydown}
* @license .returnValue=${this.returnValue || h}>
* Copyright 2021 Google LLC ${i ? a : h}
* <div class="container" @click=${this.handleContentClick}>
* Licensed under the Apache License, Version 2.0 (the "License"); <div class="headline">
* you may not use this file except in compliance with the License. <div class="icon" aria-hidden="true">
* You may obtain a copy of the License at <slot name="icon" @slotchange=${this.handleIconChange}></slot>
* </div>
* http://www.apache.org/licenses/LICENSE-2.0 <h2 id="headline" aria-hidden=${!this.hasHeadline || h}>
* <slot
* Unless required by applicable law or agreed to in writing, software name="headline"
* distributed under the License is distributed on an "AS IS" BASIS, @slotchange=${this.handleHeadlineChange}></slot>
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. </h2>
* See the License for the specific language governing permissions and <md-divider></md-divider>
* limitations under the License. </div>
*/ <div class="scroller">
class m { <div class="content">
get primary() { <div class="top anchor"></div>
return this.props.primary; <slot name="content"></slot>
} <div class="bottom anchor"></div>
get onPrimary() { </div>
return this.props.onPrimary; </div>
} <div class="actions">
get primaryContainer() { <md-divider></md-divider>
return this.props.primaryContainer; <slot name="actions" @slotchange=${this.handleActionsChange}></slot>
} </div>
get onPrimaryContainer() { </div>
return this.props.onPrimaryContainer; ${i ? a : h}
} </dialog>
get secondary() { `;
return this.props.secondary; }
} firstUpdated() {
get onSecondary() { this.intersectionObserver = new IntersectionObserver((e) => {
return this.props.onSecondary; for (const t of e)
} this.handleAnchorIntersection(t);
get secondaryContainer() { }, { root: this.scroller }), this.intersectionObserver.observe(this.topAnchor), this.intersectionObserver.observe(this.bottomAnchor);
return this.props.secondaryContainer; }
} handleDialogClick() {
get onSecondaryContainer() { if (this.nextClickIsFromContent) {
return this.props.onSecondaryContainer; this.nextClickIsFromContent = !1;
} return;
get tertiary() { }
return this.props.tertiary; this.dispatchEvent(new Event("cancel", { cancelable: !0 })) && this.close();
} }
get onTertiary() { handleContentClick() {
return this.props.onTertiary; this.nextClickIsFromContent = !0;
} }
get tertiaryContainer() { handleSubmit(e) {
return this.props.tertiaryContainer; const t = e.target, { submitter: i } = e;
} t.method !== "dialog" || !i || this.close(i.getAttribute("value") ?? this.returnValue);
get onTertiaryContainer() { }
return this.props.onTertiaryContainer; handleCancel(e) {
} if (e.target !== this.dialog)
get error() { return;
return this.props.error; this.escapePressedWithoutCancel = !1;
} const t = !_(this, e);
get onError() { e.preventDefault(), !t && this.close();
return this.props.onError; }
} handleClose() {
get errorContainer() { var e;
return this.props.errorContainer; this.escapePressedWithoutCancel && (this.escapePressedWithoutCancel = !1, (e = this.dialog) == null || e.dispatchEvent(new Event("cancel", { cancelable: !0 })));
} }
get onErrorContainer() { handleKeydown(e) {
return this.props.onErrorContainer; e.key === "Escape" && (this.escapePressedWithoutCancel = !0, setTimeout(() => {
} this.escapePressedWithoutCancel = !1;
get background() { }));
return this.props.background; }
} async animateDialog(e) {
get onBackground() { var k;
return this.props.onBackground; if ((k = this.cancelAnimations) == null || k.abort(), this.cancelAnimations = new AbortController(), this.quick)
} return;
get surface() { const { dialog: t, scrim: i, container: a, headline: r, content: d, actions: c } = this;
return this.props.surface; if (!t || !i || !a || !r || !d || !c)
} return;
get onSurface() { const { container: p, dialog: f, scrim: v, headline: m, content: w, actions: A } = e, E = [
return this.props.onSurface; [t, f ?? []],
} [i, v ?? []],
get surfaceVariant() { [a, p ?? []],
return this.props.surfaceVariant; [r, m ?? []],
} [d, w ?? []],
get onSurfaceVariant() { [c, A ?? []]
return this.props.onSurfaceVariant; ], y = [];
} for (const [F, I] of E)
get outline() { for (const D of I) {
return this.props.outline; const T = F.animate(...D);
} this.cancelAnimations.signal.addEventListener("abort", () => {
get outlineVariant() { T.cancel();
return this.props.outlineVariant; }), y.push(T);
} }
get shadow() { await Promise.all(y.map((F) => F.finished.catch(() => {
return this.props.shadow; })));
} }
get scrim() { handleHeadlineChange(e) {
return this.props.scrim; const t = e.target;
} this.hasHeadline = t.assignedElements().length > 0;
get inverseSurface() { }
return this.props.inverseSurface; handleActionsChange(e) {
} const t = e.target;
get inverseOnSurface() { this.hasActions = t.assignedElements().length > 0;
return this.props.inverseOnSurface; }
} handleIconChange(e) {
get inversePrimary() { const t = e.target;
return this.props.inversePrimary; this.hasIcon = t.assignedElements().length > 0;
} }
/** handleAnchorIntersection(e) {
* @param argb ARGB representation of a color. const { target: t, isIntersecting: i } = e;
* @return Light Material color scheme, based on the color's hue. t === this.topAnchor && (this.isAtScrollTop = i), t === this.bottomAnchor && (this.isAtScrollBottom = i);
*/ }
static light(r) { getIsConnectedPromise() {
return m.lightFromCorePalette(s.of(r)); return new Promise((e) => {
} this.isConnectedPromiseResolve = e;
/** });
* @param argb ARGB representation of a color. }
* @return Dark Material color scheme, based on the color's hue. handleFocusTrapFocus(e) {
*/ var m;
static dark(r) { const [t, i] = this.getFirstAndLastFocusableChildren();
return m.darkFromCorePalette(s.of(r)); if (!t || !i) {
} (m = this.dialog) == null || m.focus();
/** return;
* @param argb ARGB representation of a color. }
* @return Light Material content color scheme, based on the color's hue. const a = e.target === this.firstFocusTrap, r = !a, d = e.relatedTarget === t, c = e.relatedTarget === i, p = !d && !c;
*/ if (r && c || a && p) {
static lightContent(r) { t.focus();
return m.lightFromCorePalette(s.contentOf(r)); return;
} }
/** if (a && d || r && p) {
* @param argb ARGB representation of a color. i.focus();
* @return Dark Material content color scheme, based on the color's hue. return;
*/ }
static darkContent(r) { }
return m.darkFromCorePalette(s.contentOf(r)); getFirstAndLastFocusableChildren() {
} if (!this.treewalker)
/** return [null, null];
* Light scheme from core palette let e = null, t = null;
*/ for (this.treewalker.currentNode = this.treewalker.root; this.treewalker.nextNode(); ) {
static lightFromCorePalette(r) { const i = this.treewalker.currentNode;
return new m({ B(i) && (e || (e = i), t = i);
primary: r.a1.tone(40), }
onPrimary: r.a1.tone(100), return [e, t];
primaryContainer: r.a1.tone(90), }
onPrimaryContainer: r.a1.tone(10), };
secondary: r.a2.tone(40), o([
onSecondary: r.a2.tone(100), u({ type: Boolean })
secondaryContainer: r.a2.tone(90), ], s.prototype, "open", null);
onSecondaryContainer: r.a2.tone(10), o([
tertiary: r.a3.tone(40), u({ type: Boolean })
onTertiary: r.a3.tone(100), ], s.prototype, "quick", void 0);
tertiaryContainer: r.a3.tone(90), o([
onTertiaryContainer: r.a3.tone(10), u({ attribute: !1 })
error: r.error.tone(40), ], s.prototype, "returnValue", void 0);
onError: r.error.tone(100), o([
errorContainer: r.error.tone(90), u()
onErrorContainer: r.error.tone(10), ], s.prototype, "type", void 0);
background: r.n1.tone(99), o([
onBackground: r.n1.tone(10), u({ type: Boolean, attribute: "no-focus-trap" })
surface: r.n1.tone(99), ], s.prototype, "noFocusTrap", void 0);
onSurface: r.n1.tone(10), o([
surfaceVariant: r.n2.tone(90), l("dialog")
onSurfaceVariant: r.n2.tone(30), ], s.prototype, "dialog", void 0);
outline: r.n2.tone(50), o([
outlineVariant: r.n2.tone(80), l(".scrim")
shadow: r.n1.tone(0), ], s.prototype, "scrim", void 0);
scrim: r.n1.tone(0), o([
inverseSurface: r.n1.tone(20), l(".container")
inverseOnSurface: r.n1.tone(95), ], s.prototype, "container", void 0);
inversePrimary: r.a1.tone(80) o([
}); l(".headline")
} ], s.prototype, "headline", void 0);
/** o([
* Dark scheme from core palette l(".content")
*/ ], s.prototype, "content", void 0);
static darkFromCorePalette(r) { o([
return new m({ l(".actions")
primary: r.a1.tone(80), ], s.prototype, "actions", void 0);
onPrimary: r.a1.tone(20), o([
primaryContainer: r.a1.tone(30), g()
onPrimaryContainer: r.a1.tone(90), ], s.prototype, "isAtScrollTop", void 0);
secondary: r.a2.tone(80), o([
onSecondary: r.a2.tone(20), g()
secondaryContainer: r.a2.tone(30), ], s.prototype, "isAtScrollBottom", void 0);
onSecondaryContainer: r.a2.tone(90), o([
tertiary: r.a3.tone(80), l(".scroller")
onTertiary: r.a3.tone(20), ], s.prototype, "scroller", void 0);
tertiaryContainer: r.a3.tone(30), o([
onTertiaryContainer: r.a3.tone(90), l(".top.anchor")
error: r.error.tone(80), ], s.prototype, "topAnchor", void 0);
onError: r.error.tone(20), o([
errorContainer: r.error.tone(30), l(".bottom.anchor")
onErrorContainer: r.error.tone(80), ], s.prototype, "bottomAnchor", void 0);
background: r.n1.tone(10), o([
onBackground: r.n1.tone(90), l(".focus-trap")
surface: r.n1.tone(10), ], s.prototype, "firstFocusTrap", void 0);
onSurface: r.n1.tone(90), o([
surfaceVariant: r.n2.tone(30), g()
onSurfaceVariant: r.n2.tone(80), ], s.prototype, "hasHeadline", void 0);
outline: r.n2.tone(60), o([
outlineVariant: r.n2.tone(30), g()
shadow: r.n1.tone(0), ], s.prototype, "hasActions", void 0);
scrim: r.n1.tone(0), o([
inverseSurface: r.n1.tone(90), g()
inverseOnSurface: r.n1.tone(20), ], s.prototype, "hasIcon", void 0);
inversePrimary: r.a1.tone(40) function B(n) {
}); var r;
} const e = ":is(button,input,select,textarea,object,:is(a,area)[href],[tabindex],[contenteditable=true])", t = ":not(:disabled,[disabled])";
constructor(r) { return n.matches(e + t + ':not([tabindex^="-"])') ? !0 : !n.localName.includes("-") || !n.matches(t) ? !1 : ((r = n.shadowRoot) == null ? void 0 : r.delegatesFocus) ?? !1;
this.props = r; }
} /**
toJSON() { * @license
return { * Copyright 2024 Google LLC
...this.props * SPDX-License-Identifier: Apache-2.0
}; */
} const R = N`:host{border-start-start-radius:var(--md-dialog-container-shape-start-start, var(--md-dialog-container-shape, var(--md-sys-shape-corner-extra-large, 28px)));border-start-end-radius:var(--md-dialog-container-shape-start-end, var(--md-dialog-container-shape, var(--md-sys-shape-corner-extra-large, 28px)));border-end-end-radius:var(--md-dialog-container-shape-end-end, var(--md-dialog-container-shape, var(--md-sys-shape-corner-extra-large, 28px)));border-end-start-radius:var(--md-dialog-container-shape-end-start, var(--md-dialog-container-shape, var(--md-sys-shape-corner-extra-large, 28px)));display:contents;margin:auto;max-height:min(560px,100% - 48px);max-width:min(560px,100% - 48px);min-height:140px;min-width:280px;position:fixed;height:fit-content;width:fit-content}dialog{background:rgba(0,0,0,0);border:none;border-radius:inherit;flex-direction:column;height:inherit;margin:inherit;max-height:inherit;max-width:inherit;min-height:inherit;min-width:inherit;outline:none;overflow:visible;padding:0;width:inherit}dialog[open]{display:flex}::backdrop{background:none}.scrim{background:var(--md-sys-color-scrim, #000);display:none;inset:0;opacity:32%;pointer-events:none;position:fixed;z-index:1}:host([open]) .scrim{display:flex}h2{all:unset;align-self:stretch}.headline{align-items:center;color:var(--md-dialog-headline-color, var(--md-sys-color-on-surface, #1d1b20));display:flex;flex-direction:column;font-family:var(--md-dialog-headline-font, var(--md-sys-typescale-headline-small-font, var(--md-ref-typeface-brand, Roboto)));font-size:var(--md-dialog-headline-size, var(--md-sys-typescale-headline-small-size, 1.5rem));line-height:var(--md-dialog-headline-line-height, var(--md-sys-typescale-headline-small-line-height, 2rem));font-weight:var(--md-dialog-headline-weight, var(--md-sys-typescale-headline-small-weight, var(--md-ref-typeface-weight-regular, 400)));position:relative}slot[name=headline]::slotted(*){align-items:center;align-self:stretch;box-sizing:border-box;display:flex;gap:8px;padding:24px 24px 0}.icon{display:flex}slot[name=icon]::slotted(*){color:var(--md-dialog-icon-color, var(--md-sys-color-secondary, #625b71));fill:currentColor;font-size:var(--md-dialog-icon-size, 24px);margin-top:24px;height:var(--md-dialog-icon-size, 24px);width:var(--md-dialog-icon-size, 24px)}.has-icon slot[name=headline]::slotted(*){justify-content:center;padding-top:16px}.scrollable slot[name=headline]::slotted(*){padding-bottom:16px}.scrollable.has-headline slot[name=content]::slotted(*){padding-top:8px}.container{border-radius:inherit;display:flex;flex-direction:column;flex-grow:1;overflow:hidden;position:relative;transform-origin:top}.container::before{background:var(--md-dialog-container-color, var(--md-sys-color-surface-container-high, #ece6f0));border-radius:inherit;content:"";inset:0;position:absolute}.scroller{display:flex;flex:1;flex-direction:column;overflow:hidden;z-index:1}.scrollable .scroller{overflow-y:scroll}.content{color:var(--md-dialog-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));font-family:var(--md-dialog-supporting-text-font, var(--md-sys-typescale-body-medium-font, var(--md-ref-typeface-plain, Roboto)));font-size:var(--md-dialog-supporting-text-size, var(--md-sys-typescale-body-medium-size, 0.875rem));line-height:var(--md-dialog-supporting-text-line-height, var(--md-sys-typescale-body-medium-line-height, 1.25rem));flex:1;font-weight:var(--md-dialog-supporting-text-weight, var(--md-sys-typescale-body-medium-weight, var(--md-ref-typeface-weight-regular, 400)));height:min-content;position:relative}slot[name=content]::slotted(*){box-sizing:border-box;padding:24px}.anchor{position:absolute}.top.anchor{top:0}.bottom.anchor{bottom:0}.actions{position:relative}slot[name=actions]::slotted(*){box-sizing:border-box;display:flex;gap:8px;justify-content:flex-end;padding:16px 24px 24px}.has-actions slot[name=content]::slotted(*){padding-bottom:8px}md-divider{display:none;position:absolute}.has-headline.show-top-divider .headline md-divider,.has-actions.show-bottom-divider .actions md-divider{display:flex}.headline md-divider{bottom:0}.actions md-divider{top:0}@media(forced-colors: active){dialog{outline:2px solid WindowText}}
} `;
/** /**
* @license * @license
* Copyright 2021 Google LLC * Copyright 2023 Google LLC
* * SPDX-License-Identifier: Apache-2.0
* Licensed under the Apache License, Version 2.0 (the "License"); */
* you may not use this file except in compliance with the License. let x = class extends s {
* You may obtain a copy of the License at };
* x.styles = [R];
* http://www.apache.org/licenses/LICENSE-2.0 x = o([
* z("md-dialog")
* Unless required by applicable law or agreed to in writing, software ], x);
* distributed under the License is distributed on an "AS IS" BASIS, const q = P({
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. react: S,
* See the License for the specific language governing permissions and tagName: "md-dialog",
* limitations under the License. elementClass: x,
*/ events: {
function I(h, r = []) { onClose: "close",
const t = s.of(h); onShow: "show",
return { onOpen: "open",
source: h, onOpened: "opened",
schemes: { onClosed: "closed",
light: m.light(h), onCancel: "cancel"
dark: m.dark(h) }
}, }), te = (n) => {
palettes: { const { children: e, quick: t, returnValue: i, noFocusTrap: a, open: r, fullScreen: d, style: c, className: p, id: f, onClose: v, onShow: m, onOpen: w, onOpened: A, onClosed: E, onCancel: y } = n;
primary: t.a1, return /* @__PURE__ */ C(
secondary: t.a2, q,
tertiary: t.a3, {
neutral: t.n1, quick: t,
neutralVariant: t.n2, returnValue: i,
error: t.error noFocusTrap: a,
}, open: r,
customColors: r.map((e) => F(h, e)) style: {
}; ...c,
} ...d ? {
function F(h, r) { width: "100vw",
let t = r.value; height: "100vh",
const e = t, n = h; maxWidth: "100vw",
r.blend && (t = C.harmonize(e, n)); maxHeight: "100vh"
const o = s.of(t).a1; } : {}
return { },
color: r, className: p,
value: t, id: f,
light: { onClose: v,
color: o.tone(40), onShow: m,
onColor: o.tone(100), onOpen: w,
colorContainer: o.tone(90), onOpened: A,
onColorContainer: o.tone(10) onClosed: E,
}, onCancel: y,
dark: { children: e
color: o.tone(80), }
onColor: o.tone(20), );
colorContainer: o.tone(30), }, ie = (n) => /* @__PURE__ */ C("div", { slot: "headline", ...n, children: n.children }), oe = (n) => /* @__PURE__ */ C("div", { slot: "content", ...n, children: n.children }), se = (n) => /* @__PURE__ */ C("div", { slot: "actions", ...n, children: n.children });
onColorContainer: o.tone(90) export {
} te as Dialog,
}; se as DialogActions,
} oe as DialogContent,
function P(h) { ie as DialogTitle
const r = b(h);
return I(r);
}
export {
P as createTheme
}; };

111
dist/react-you-ui14.js vendored
View File

@ -1,45 +1,76 @@
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const w=require("react/jsx-runtime"),C=require("react"),E=require("./create-component-D9KTUrcf.js"),o=require("./class-map-DV5418hw.js");require("./ripple-DoKzzEey.js");const I=require("./animation-A38fZ1oY.js"),q=require("./form-label-activation-CYEOF_US.js"),f=require("./validator-DUxooTr6.js"),b=require("./element-internals-OOm6rgx-.js"),R=require("./focusable-D3uHX6nn.js"),k=require("./form-associated-CxXMoMPu.js");/** "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("./string_utils-Bad7L8P5.js");/**
* @license * @license
* Copyright 2023 Google LLC * Copyright 2021 Google LLC
* SPDX-License-Identifier: Apache-2.0 *
*/class S extends f.Validator{computeValidity(e){this.radioElement||(this.radioElement=document.createElement("input"),this.radioElement.type="radio",this.radioElement.name="group");let i=!1,t=!1;for(const{checked:r,required:a}of e)a&&(i=!0),r&&(t=!0);return this.radioElement.checked=t,this.radioElement.required=i,{validity:{valueMissing:i&&!t},validationMessage:this.radioElement.validationMessage}}equals(e,i){if(e.length!==i.length)return!1;for(let t=0;t<e.length;t++){const r=e[t],a=i[t];if(r.checked!==a.checked||r.required!==a.required)return!1}return!0}copy(e){return e.map(({checked:i,required:t})=>({checked:i,required:t}))}}/** * Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/class p{static harmonize(r,t){const e=i.Hct.fromInt(r),n=i.Hct.fromInt(t),a=i.differenceDegrees(e.hue,n.hue),o=Math.min(a*.5,15),c=i.sanitizeDegreesDouble(e.hue+o*i.rotationDirection(e.hue,n.hue));return i.Hct.from(c,e.chroma,e.tone).toInt()}static hctHue(r,t,e){const n=p.cam16Ucs(r,t,e),a=i.Cam16.fromInt(n),o=i.Cam16.fromInt(r);return i.Hct.from(a.hue,o.chroma,i.lstarFromArgb(r)).toInt()}static cam16Ucs(r,t,e){const n=i.Cam16.fromInt(r),a=i.Cam16.fromInt(t),o=n.jstar,c=n.astar,f=n.bstar,C=a.jstar,d=a.astar,y=a.bstar,l=o+(C-o)*e,g=c+(d-c)*e,H=f+(y-f)*e;return i.Cam16.fromUcs(l,g,H).toInt()}}/**
* @license * @license
* Copyright 2022 Google LLC * Copyright 2021 Google LLC
* SPDX-License-Identifier: Apache-2.0 *
*/class A{get controls(){const e=this.host.getAttribute("name");return!e||!this.root||!this.host.isConnected?[this.host]:Array.from(this.root.querySelectorAll(`[name="${e}"]`))}constructor(e){this.host=e,this.focused=!1,this.root=null,this.handleFocusIn=()=>{this.focused=!0,this.updateTabIndices()},this.handleFocusOut=()=>{this.focused=!1,this.updateTabIndices()},this.handleKeyDown=i=>{const t=i.key==="ArrowDown",r=i.key==="ArrowUp",a=i.key==="ArrowLeft",m=i.key==="ArrowRight";if(!a&&!m&&!t&&!r)return;const c=this.controls;if(!c.length)return;i.preventDefault();const p=getComputedStyle(this.host).direction==="rtl"?a||t:m||t,h=c.indexOf(this.host);let s=p?h+1:h-1;for(;s!==h;){s>=c.length?s=0:s<0&&(s=c.length-1);const n=c[s];if(n.hasAttribute("disabled")){p?s++:s--;continue}for(const d of c)d!==n&&(d.checked=!1,d.tabIndex=-1,d.blur());n.checked=!0,n.tabIndex=0,n.focus(),n.dispatchEvent(new Event("change",{bubbles:!0}));break}}}hostConnected(){this.root=this.host.getRootNode(),this.host.addEventListener("keydown",this.handleKeyDown),this.host.addEventListener("focusin",this.handleFocusIn),this.host.addEventListener("focusout",this.handleFocusOut),this.host.checked&&this.uncheckSiblings(),this.updateTabIndices()}hostDisconnected(){this.host.removeEventListener("keydown",this.handleKeyDown),this.host.removeEventListener("focusin",this.handleFocusIn),this.host.removeEventListener("focusout",this.handleFocusOut),this.updateTabIndices(),this.root=null}handleCheckedChange(){this.host.checked&&(this.uncheckSiblings(),this.updateTabIndices())}uncheckSiblings(){for(const e of this.controls)e!==this.host&&(e.checked=!1)}updateTabIndices(){const e=this.controls,i=e.find(t=>t.checked);if(i||this.focused){const t=i||this.host;t.tabIndex=0;for(const r of e)r!==t&&(r.tabIndex=-1);return}for(const t of e)t.tabIndex=0}}/** * Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/class u{static fromInt(r){const t=i.Hct.fromInt(r);return u.fromHct(t)}static fromHct(r){return new u(r.hue,r.chroma,r)}static fromHueAndChroma(r,t){const e=new S(r,t).create();return new u(r,t,e)}constructor(r,t,e){this.hue=r,this.chroma=t,this.keyColor=e,this.cache=new Map}tone(r){let t=this.cache.get(r);return t===void 0&&(t=i.Hct.from(this.hue,this.chroma,r).toInt(),this.cache.set(r,t)),t}getHct(r){return i.Hct.fromInt(this.tone(r))}}class S{constructor(r,t){this.hue=r,this.requestedChroma=t,this.chromaCache=new Map,this.maxChromaValue=200}create(){let n=0,a=100;for(;n<a;){const o=Math.floor((n+a)/2),c=this.maxChroma(o)<this.maxChroma(o+1);if(this.maxChroma(o)>=this.requestedChroma-.01)if(Math.abs(n-50)<Math.abs(a-50))a=o;else{if(n===o)return i.Hct.from(this.hue,this.requestedChroma,n);n=o}else c?n=o+1:a=o}return i.Hct.from(this.hue,this.requestedChroma,n)}maxChroma(r){if(this.chromaCache.has(r))return this.chromaCache.get(r);const t=i.Hct.from(this.hue,this.maxChromaValue,r).chroma;return this.chromaCache.set(r,t),t}}/**
* @license * @license
* Copyright 2018 Google LLC * Copyright 2021 Google LLC
* SPDX-License-Identifier: Apache-2.0 *
*/var x;const y=Symbol("checked");let $=0;const L=f.mixinConstraintValidation(k.mixinFormAssociated(b.mixinElementInternals(R.mixinFocusable(o.r))));let u=class extends L{get checked(){return this[y]}set checked(e){const i=this.checked;i!==e&&(this[y]=e,this.requestUpdate("checked",i),this.selectionController.handleCheckedChange())}constructor(){super(),this.maskId=`cutout${++$}`,this[x]=!1,this.required=!1,this.value="on",this.selectionController=new A(this),this.addController(this.selectionController),this[b.internals].role="radio",this.addEventListener("click",this.handleClick.bind(this)),this.addEventListener("keydown",this.handleKeydown.bind(this))}render(){const e={checked:this.checked};return o.x` * Licensed under the Apache License, Version 2.0 (the "License");
<div class="container ${o.e$1(e)}" aria-hidden="true"> * you may not use this file except in compliance with the License.
<md-ripple * You may obtain a copy of the License at
part="ripple" *
.control=${this} * http://www.apache.org/licenses/LICENSE-2.0
?disabled=${this.disabled}></md-ripple> *
<md-focus-ring part="focus-ring" .control=${this}></md-focus-ring> * Unless required by applicable law or agreed to in writing, software
<svg class="icon" viewBox="0 0 20 20"> * distributed under the License is distributed on an "AS IS" BASIS,
<mask id="${this.maskId}"> * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
<rect width="100%" height="100%" fill="white" /> * See the License for the specific language governing permissions and
<circle cx="10" cy="10" r="8" fill="black" /> * limitations under the License.
</mask> */class s{static of(r){return new s(r,!1)}static contentOf(r){return new s(r,!0)}static fromColors(r){return s.createPaletteFromColors(!1,r)}static contentFromColors(r){return s.createPaletteFromColors(!0,r)}static createPaletteFromColors(r,t){const e=new s(t.primary,r);if(t.secondary){const n=new s(t.secondary,r);e.a2=n.a1}if(t.tertiary){const n=new s(t.tertiary,r);e.a3=n.a1}if(t.error){const n=new s(t.error,r);e.error=n.a1}if(t.neutral){const n=new s(t.neutral,r);e.n1=n.n1}if(t.neutralVariant){const n=new s(t.neutralVariant,r);e.n2=n.n2}return e}constructor(r,t){const e=i.Hct.fromInt(r),n=e.hue,a=e.chroma;t?(this.a1=u.fromHueAndChroma(n,a),this.a2=u.fromHueAndChroma(n,a/3),this.a3=u.fromHueAndChroma(n+60,a/2),this.n1=u.fromHueAndChroma(n,Math.min(a/12,4)),this.n2=u.fromHueAndChroma(n,Math.min(a/6,8))):(this.a1=u.fromHueAndChroma(n,Math.max(48,a)),this.a2=u.fromHueAndChroma(n,16),this.a3=u.fromHueAndChroma(n+60,24),this.n1=u.fromHueAndChroma(n,4),this.n2=u.fromHueAndChroma(n,8)),this.error=u.fromHueAndChroma(25,84)}}/**
<circle
class="outer circle"
cx="10"
cy="10"
r="10"
mask="url(#${this.maskId})" />
<circle class="inner circle" cx="10" cy="10" r="5" />
</svg>
<div class="touch-target"></div>
</div>
`}updated(){this[b.internals].ariaChecked=String(this.checked)}async handleClick(e){this.disabled||(await 0,!e.defaultPrevented&&(q.isActivationClick(e)&&this.focus(),this.checked=!0,this.dispatchEvent(new Event("change",{bubbles:!0})),this.dispatchEvent(new InputEvent("input",{bubbles:!0,composed:!0}))))}async handleKeydown(e){await 0,!(e.key!==" "||e.defaultPrevented)&&this.click()}[(x=y,k.getFormValue)](){return this.checked?this.value:null}[k.getFormState](){return String(this.checked)}formResetCallback(){this.checked=this.hasAttribute("checked")}formStateRestoreCallback(e){this.checked=e==="true"}[f.createValidator](){return new S(()=>this.selectionController?this.selectionController.controls:[this])}[f.getValidityAnchor](){return this.container}};o.__decorate([o.n({type:Boolean})],u.prototype,"checked",null);o.__decorate([o.n({type:Boolean})],u.prototype,"required",void 0);o.__decorate([o.n()],u.prototype,"value",void 0);o.__decorate([I.e$1(".container")],u.prototype,"container",void 0);/**
* @license * @license
* Copyright 2024 Google LLC * Copyright 2021 Google LLC
* SPDX-License-Identifier: Apache-2.0 *
*/const _=o.i$1`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20px);outline:none;position:relative;vertical-align:top;width:var(--md-radio-icon-size, 20px);-webkit-tap-highlight-color:rgba(0,0,0,0);cursor:pointer;--md-ripple-hover-color: var(--md-radio-hover-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--md-ripple-hover-opacity: var(--md-radio-hover-state-layer-opacity, 0.08);--md-ripple-pressed-color: var(--md-radio-pressed-state-layer-color, var(--md-sys-color-primary, #6750a4));--md-ripple-pressed-opacity: var(--md-radio-pressed-state-layer-opacity, 0.12)}:host([disabled]){cursor:default}:host([touch-target=wrapper]){margin:max(0px,(48px - var(--md-radio-icon-size, 20px))/2)}.container{display:flex;height:100%;place-content:center;place-items:center;width:100%}md-focus-ring{height:44px;inset:unset;width:44px}.checked{--md-ripple-hover-color: var(--md-radio-selected-hover-state-layer-color, var(--md-sys-color-primary, #6750a4));--md-ripple-hover-opacity: var(--md-radio-selected-hover-state-layer-opacity, 0.08);--md-ripple-pressed-color: var(--md-radio-selected-pressed-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--md-ripple-pressed-opacity: var(--md-radio-selected-pressed-state-layer-opacity, 0.12)}.touch-target{height:48px;position:absolute;width:48px}:host([touch-target=none]) .touch-target{display:none}md-ripple{border-radius:50%;height:var(--md-radio-state-layer-size, 40px);inset:unset;width:var(--md-radio-state-layer-size, 40px)}.icon{fill:var(--md-radio-icon-color, var(--md-sys-color-on-surface-variant, #49454f));inset:0;position:absolute}.outer.circle{transition:fill 50ms linear}.inner.circle{opacity:0;transform-origin:center;transition:opacity 50ms linear}.checked .icon{fill:var(--md-radio-selected-icon-color, var(--md-sys-color-primary, #6750a4))}.checked .inner.circle{animation:inner-circle-grow 300ms cubic-bezier(0.05, 0.7, 0.1, 1);opacity:1}@keyframes inner-circle-grow{from{transform:scale(0)}to{transform:scale(1)}}:host([disabled]) .circle{animation-duration:0s;transition-duration:0s}:host(:hover) .icon{fill:var(--md-radio-hover-icon-color, var(--md-sys-color-on-surface, #1d1b20))}:host(:focus-within) .icon{fill:var(--md-radio-focus-icon-color, var(--md-sys-color-on-surface, #1d1b20))}:host(:active) .icon{fill:var(--md-radio-pressed-icon-color, var(--md-sys-color-on-surface, #1d1b20))}:host([disabled]) .icon{fill:var(--md-radio-disabled-unselected-icon-color, var(--md-sys-color-on-surface, #1d1b20));opacity:var(--md-radio-disabled-unselected-icon-opacity, 0.38)}:host(:hover) .checked .icon{fill:var(--md-radio-selected-hover-icon-color, var(--md-sys-color-primary, #6750a4))}:host(:focus-within) .checked .icon{fill:var(--md-radio-selected-focus-icon-color, var(--md-sys-color-primary, #6750a4))}:host(:active) .checked .icon{fill:var(--md-radio-selected-pressed-icon-color, var(--md-sys-color-primary, #6750a4))}:host([disabled]) .checked .icon{fill:var(--md-radio-disabled-selected-icon-color, var(--md-sys-color-on-surface, #1d1b20));opacity:var(--md-radio-disabled-selected-icon-opacity, 0.38)}}@layer hcm{@media(forced-colors: active){.icon{fill:CanvasText}:host([disabled]) .icon{fill:GrayText;opacity:1}}} * Licensed under the Apache License, Version 2.0 (the "License");
`;/** * you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/class m{get primary(){return this.props.primary}get onPrimary(){return this.props.onPrimary}get primaryContainer(){return this.props.primaryContainer}get onPrimaryContainer(){return this.props.onPrimaryContainer}get secondary(){return this.props.secondary}get onSecondary(){return this.props.onSecondary}get secondaryContainer(){return this.props.secondaryContainer}get onSecondaryContainer(){return this.props.onSecondaryContainer}get tertiary(){return this.props.tertiary}get onTertiary(){return this.props.onTertiary}get tertiaryContainer(){return this.props.tertiaryContainer}get onTertiaryContainer(){return this.props.onTertiaryContainer}get error(){return this.props.error}get onError(){return this.props.onError}get errorContainer(){return this.props.errorContainer}get onErrorContainer(){return this.props.onErrorContainer}get background(){return this.props.background}get onBackground(){return this.props.onBackground}get surface(){return this.props.surface}get onSurface(){return this.props.onSurface}get surfaceVariant(){return this.props.surfaceVariant}get onSurfaceVariant(){return this.props.onSurfaceVariant}get outline(){return this.props.outline}get outlineVariant(){return this.props.outlineVariant}get shadow(){return this.props.shadow}get scrim(){return this.props.scrim}get inverseSurface(){return this.props.inverseSurface}get inverseOnSurface(){return this.props.inverseOnSurface}get inversePrimary(){return this.props.inversePrimary}static light(r){return m.lightFromCorePalette(s.of(r))}static dark(r){return m.darkFromCorePalette(s.of(r))}static lightContent(r){return m.lightFromCorePalette(s.contentOf(r))}static darkContent(r){return m.darkFromCorePalette(s.contentOf(r))}static lightFromCorePalette(r){return new m({primary:r.a1.tone(40),onPrimary:r.a1.tone(100),primaryContainer:r.a1.tone(90),onPrimaryContainer:r.a1.tone(10),secondary:r.a2.tone(40),onSecondary:r.a2.tone(100),secondaryContainer:r.a2.tone(90),onSecondaryContainer:r.a2.tone(10),tertiary:r.a3.tone(40),onTertiary:r.a3.tone(100),tertiaryContainer:r.a3.tone(90),onTertiaryContainer:r.a3.tone(10),error:r.error.tone(40),onError:r.error.tone(100),errorContainer:r.error.tone(90),onErrorContainer:r.error.tone(10),background:r.n1.tone(99),onBackground:r.n1.tone(10),surface:r.n1.tone(99),onSurface:r.n1.tone(10),surfaceVariant:r.n2.tone(90),onSurfaceVariant:r.n2.tone(30),outline:r.n2.tone(50),outlineVariant:r.n2.tone(80),shadow:r.n1.tone(0),scrim:r.n1.tone(0),inverseSurface:r.n1.tone(20),inverseOnSurface:r.n1.tone(95),inversePrimary:r.a1.tone(80)})}static darkFromCorePalette(r){return new m({primary:r.a1.tone(80),onPrimary:r.a1.tone(20),primaryContainer:r.a1.tone(30),onPrimaryContainer:r.a1.tone(90),secondary:r.a2.tone(80),onSecondary:r.a2.tone(20),secondaryContainer:r.a2.tone(30),onSecondaryContainer:r.a2.tone(90),tertiary:r.a3.tone(80),onTertiary:r.a3.tone(20),tertiaryContainer:r.a3.tone(30),onTertiaryContainer:r.a3.tone(90),error:r.error.tone(80),onError:r.error.tone(20),errorContainer:r.error.tone(30),onErrorContainer:r.error.tone(80),background:r.n1.tone(10),onBackground:r.n1.tone(90),surface:r.n1.tone(10),onSurface:r.n1.tone(90),surfaceVariant:r.n2.tone(30),onSurfaceVariant:r.n2.tone(80),outline:r.n2.tone(60),outlineVariant:r.n2.tone(30),shadow:r.n1.tone(0),scrim:r.n1.tone(0),inverseSurface:r.n1.tone(90),inverseOnSurface:r.n1.tone(20),inversePrimary:r.a1.tone(40)})}constructor(r){this.props=r}toJSON(){return{...this.props}}}/**
* @license * @license
* Copyright 2022 Google LLC * Copyright 2021 Google LLC
* SPDX-License-Identifier: Apache-2.0 *
*/let v=class extends u{};v.styles=[_];v=o.__decorate([o.t$1("md-radio")],v);const F=E.o({react:C,tagName:"md-radio",elementClass:v}),T=l=>{const{checked:e,value:i,required:t,disabled:r,name:a,ariaLabel:m,className:c,style:g,id:p,iconColor:h,selectedIconColor:s,iconSize:n,...d}=l;return w.jsx(F,{checked:e,value:i,required:t,disabled:r||!1,name:a,className:c,style:{...g,"--md-radio-icon-color":h||"var(--md-sys-on-surface-variant)","--md-radio-selected-icon-color":s||"var(--md-sys-color-primary)","--md-radio-icon-size":n||"20px"},id:p,"aria-label":m,...d})};exports.Radio=T; * Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/function w(h,r=[]){const t=s.of(h);return{source:h,schemes:{light:m.light(h),dark:m.dark(h)},palettes:{primary:t.a1,secondary:t.a2,tertiary:t.a3,neutral:t.n1,neutralVariant:t.n2,error:t.error},customColors:r.map(e=>b(h,e))}}function b(h,r){let t=r.value;const e=t,n=h;r.blend&&(t=p.harmonize(e,n));const o=s.of(t).a1;return{color:r,value:t,light:{color:o.tone(40),onColor:o.tone(100),colorContainer:o.tone(90),onColorContainer:o.tone(10)},dark:{color:o.tone(80),onColor:o.tone(20),colorContainer:o.tone(30),onColorContainer:o.tone(90)}}}function k(h){const r=i.argbFromHex(h);return w(r)}exports.createTheme=k;

View File

@ -1,274 +1,504 @@
import { jsx as x } from "react/jsx-runtime"; import { H as u, d as w, s as k, r as v, C as f, l as V, a as b } from "./string_utils-B4bsIQ5w.mjs";
import w from "react";
import { o as C } from "./create-component-CVXl33PD.mjs";
import { _ as h, n as y, r as E, x as I, c as R, a as S, b as A } from "./class-map-CwiboTfb.mjs";
import "./ripple-pQcEjR05.mjs";
import { a as q } from "./animation-DjClVFum.mjs";
import { i as L } from "./form-label-activation-ed0HgVsy.mjs";
import { V as $, m as F, c as z, g as D } from "./validator-DZt1_yHv.mjs";
import { m as T, i as k } from "./element-internals-3IY9gE4L.mjs";
import { m as V } from "./focusable-CDJoU7XD.mjs";
import { m as K, g as M, a as _ } from "./form-associated-CyYeHPMb.mjs";
/** /**
* @license * @license
* Copyright 2023 Google LLC * Copyright 2021 Google LLC
* SPDX-License-Identifier: Apache-2.0 *
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/ */
class B extends $ { class C {
computeValidity(e) { /**
this.radioElement || (this.radioElement = document.createElement("input"), this.radioElement.type = "radio", this.radioElement.name = "group"); * Blend the design color's HCT hue towards the key color's HCT
let i = !1, t = !1; * hue, in a way that leaves the original color recognizable and
for (const { checked: o, required: r } of e) * recognizably shifted towards the key color.
r && (i = !0), o && (t = !0); *
return this.radioElement.checked = t, this.radioElement.required = i, { * @param designColor ARGB representation of an arbitrary color.
validity: { * @param sourceColor ARGB representation of the main theme color.
valueMissing: i && !t * @return The design color with a hue shifted towards the
}, * system's color, a slightly warmer/cooler variant of the design
validationMessage: this.radioElement.validationMessage * color's hue.
}; */
static harmonize(r, t) {
const e = u.fromInt(r), n = u.fromInt(t), a = w(e.hue, n.hue), o = Math.min(a * 0.5, 15), c = k(e.hue + o * v(e.hue, n.hue));
return u.from(c, e.chroma, e.tone).toInt();
} }
equals(e, i) { /**
if (e.length !== i.length) * Blends hue from one color into another. The chroma and tone of
return !1; * the original color are maintained.
for (let t = 0; t < e.length; t++) { *
const o = e[t], r = i[t]; * @param from ARGB representation of color
if (o.checked !== r.checked || o.required !== r.required) * @param to ARGB representation of color
return !1; * @param amount how much blending to perform; 0.0 >= and <= 1.0
} * @return from, with a hue blended towards to. Chroma and tone
return !0; * are constant.
*/
static hctHue(r, t, e) {
const n = C.cam16Ucs(r, t, e), a = f.fromInt(n), o = f.fromInt(r);
return u.from(a.hue, o.chroma, V(r)).toInt();
} }
copy(e) { /**
return e.map(({ checked: i, required: t }) => ({ * Blend in CAM16-UCS space.
checked: i, *
required: t * @param from ARGB representation of color
})); * @param to ARGB representation of color
* @param amount how much blending to perform; 0.0 >= and <= 1.0
* @return from, blended towards to. Hue, chroma, and tone will
* change.
*/
static cam16Ucs(r, t, e) {
const n = f.fromInt(r), a = f.fromInt(t), o = n.jstar, c = n.astar, p = n.bstar, d = a.jstar, y = a.astar, l = a.bstar, g = o + (d - o) * e, S = c + (y - c) * e, H = p + (l - p) * e;
return f.fromUcs(g, S, H).toInt();
} }
} }
/** /**
* @license * @license
* Copyright 2022 Google LLC * Copyright 2021 Google LLC
* SPDX-License-Identifier: Apache-2.0 *
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/ */
class O { class i {
/** /**
* All single selection elements in the host element's root with the same * @param argb ARGB representation of a color
* `name` attribute, including the host element. * @return Tones matching that color's hue and chroma.
*/ */
get controls() { static fromInt(r) {
const e = this.host.getAttribute("name"); const t = u.fromInt(r);
return !e || !this.root || !this.host.isConnected ? [this.host] : Array.from(this.root.querySelectorAll(`[name="${e}"]`)); return i.fromHct(t);
} }
constructor(e) { /**
this.host = e, this.focused = !1, this.root = null, this.handleFocusIn = () => { * @param hct Hct
this.focused = !0, this.updateTabIndices(); * @return Tones matching that color's hue and chroma.
}, this.handleFocusOut = () => { */
this.focused = !1, this.updateTabIndices(); static fromHct(r) {
}, this.handleKeyDown = (i) => { return new i(r.hue, r.chroma, r);
const t = i.key === "ArrowDown", o = i.key === "ArrowUp", r = i.key === "ArrowLeft", u = i.key === "ArrowRight"; }
if (!r && !u && !t && !o) /**
return; * @param hue HCT hue
const a = this.controls; * @param chroma HCT chroma
if (!a.length) * @return Tones matching hue and chroma.
return; */
i.preventDefault(); static fromHueAndChroma(r, t) {
const p = getComputedStyle(this.host).direction === "rtl" ? r || t : u || t, l = a.indexOf(this.host); const e = new A(r, t).create();
let s = p ? l + 1 : l - 1; return new i(r, t, e);
for (; s !== l; ) { }
s >= a.length ? s = 0 : s < 0 && (s = a.length - 1); constructor(r, t, e) {
const c = a[s]; this.hue = r, this.chroma = t, this.keyColor = e, this.cache = /* @__PURE__ */ new Map();
if (c.hasAttribute("disabled")) { }
p ? s++ : s--; /**
continue; * @param tone HCT tone, measured from 0 to 100.
* @return ARGB representation of a color with that tone.
*/
tone(r) {
let t = this.cache.get(r);
return t === void 0 && (t = u.from(this.hue, this.chroma, r).toInt(), this.cache.set(r, t)), t;
}
/**
* @param tone HCT tone.
* @return HCT representation of a color with that tone.
*/
getHct(r) {
return u.fromInt(this.tone(r));
}
}
class A {
constructor(r, t) {
this.hue = r, this.requestedChroma = t, this.chromaCache = /* @__PURE__ */ new Map(), this.maxChromaValue = 200;
}
/**
* Creates a key color from a [hue] and a [chroma].
* The key color is the first tone, starting from T50, matching the given hue
* and chroma.
*
* @return Key color [Hct]
*/
create() {
let n = 0, a = 100;
for (; n < a; ) {
const o = Math.floor((n + a) / 2), c = this.maxChroma(o) < this.maxChroma(o + 1);
if (this.maxChroma(o) >= this.requestedChroma - 0.01)
if (Math.abs(n - 50) < Math.abs(a - 50))
a = o;
else {
if (n === o)
return u.from(this.hue, this.requestedChroma, n);
n = o;
} }
for (const n of a) else
n !== c && (n.checked = !1, n.tabIndex = -1, n.blur()); c ? n = o + 1 : a = o;
c.checked = !0, c.tabIndex = 0, c.focus(), c.dispatchEvent(new Event("change", { bubbles: !0 }));
break;
}
};
}
hostConnected() {
this.root = this.host.getRootNode(), this.host.addEventListener("keydown", this.handleKeyDown), this.host.addEventListener("focusin", this.handleFocusIn), this.host.addEventListener("focusout", this.handleFocusOut), this.host.checked && this.uncheckSiblings(), this.updateTabIndices();
}
hostDisconnected() {
this.host.removeEventListener("keydown", this.handleKeyDown), this.host.removeEventListener("focusin", this.handleFocusIn), this.host.removeEventListener("focusout", this.handleFocusOut), this.updateTabIndices(), this.root = null;
}
/**
* Should be called whenever the host's `checked` property changes
* synchronously.
*/
handleCheckedChange() {
this.host.checked && (this.uncheckSiblings(), this.updateTabIndices());
}
uncheckSiblings() {
for (const e of this.controls)
e !== this.host && (e.checked = !1);
}
/**
* Updates the `tabindex` of the host and its siblings.
*/
updateTabIndices() {
const e = this.controls, i = e.find((t) => t.checked);
if (i || this.focused) {
const t = i || this.host;
t.tabIndex = 0;
for (const o of e)
o !== t && (o.tabIndex = -1);
return;
} }
for (const t of e) return u.from(this.hue, this.requestedChroma, n);
t.tabIndex = 0; }
// Find the maximum chroma for a given tone
maxChroma(r) {
if (this.chromaCache.has(r))
return this.chromaCache.get(r);
const t = u.from(this.hue, this.maxChromaValue, r).chroma;
return this.chromaCache.set(r, t), t;
} }
} }
/** /**
* @license * @license
* Copyright 2018 Google LLC * Copyright 2021 Google LLC
* SPDX-License-Identifier: Apache-2.0 *
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/ */
var g; class s {
const v = Symbol("checked");
let N = 0;
const U = F(K(T(V(E))));
let m = class extends U {
/** /**
* Whether or not the radio is selected. * @param argb ARGB representation of a color
*/ */
get checked() { static of(r) {
return this[v]; return new s(r, !1);
} }
set checked(e) { /**
const i = this.checked; * @param argb ARGB representation of a color
i !== e && (this[v] = e, this.requestUpdate("checked", i), this.selectionController.handleCheckedChange()); */
static contentOf(r) {
return new s(r, !0);
} }
constructor() { /**
super(), this.maskId = `cutout${++N}`, this[g] = !1, this.required = !1, this.value = "on", this.selectionController = new O(this), this.addController(this.selectionController), this[k].role = "radio", this.addEventListener("click", this.handleClick.bind(this)), this.addEventListener("keydown", this.handleKeydown.bind(this)); * Create a [CorePalette] from a set of colors
*/
static fromColors(r) {
return s.createPaletteFromColors(!1, r);
} }
render() { /**
const e = { checked: this.checked }; * Create a content [CorePalette] from a set of colors
return I` */
<div class="container ${R(e)}" aria-hidden="true"> static contentFromColors(r) {
<md-ripple return s.createPaletteFromColors(!0, r);
part="ripple"
.control=${this}
?disabled=${this.disabled}></md-ripple>
<md-focus-ring part="focus-ring" .control=${this}></md-focus-ring>
<svg class="icon" viewBox="0 0 20 20">
<mask id="${this.maskId}">
<rect width="100%" height="100%" fill="white" />
<circle cx="10" cy="10" r="8" fill="black" />
</mask>
<circle
class="outer circle"
cx="10"
cy="10"
r="10"
mask="url(#${this.maskId})" />
<circle class="inner circle" cx="10" cy="10" r="5" />
</svg>
<div class="touch-target"></div>
</div>
`;
} }
updated() { static createPaletteFromColors(r, t) {
this[k].ariaChecked = String(this.checked); const e = new s(t.primary, r);
} if (t.secondary) {
async handleClick(e) { const n = new s(t.secondary, r);
this.disabled || (await 0, !e.defaultPrevented && (L(e) && this.focus(), this.checked = !0, this.dispatchEvent(new Event("change", { bubbles: !0 })), this.dispatchEvent(new InputEvent("input", { bubbles: !0, composed: !0 })))); e.a2 = n.a1;
}
async handleKeydown(e) {
await 0, !(e.key !== " " || e.defaultPrevented) && this.click();
}
[(g = v, M)]() {
return this.checked ? this.value : null;
}
[_]() {
return String(this.checked);
}
formResetCallback() {
this.checked = this.hasAttribute("checked");
}
formStateRestoreCallback(e) {
this.checked = e === "true";
}
[z]() {
return new B(() => this.selectionController ? this.selectionController.controls : [this]);
}
[D]() {
return this.container;
}
};
h([
y({ type: Boolean })
], m.prototype, "checked", null);
h([
y({ type: Boolean })
], m.prototype, "required", void 0);
h([
y()
], m.prototype, "value", void 0);
h([
q(".container")
], m.prototype, "container", void 0);
/**
* @license
* Copyright 2024 Google LLC
* SPDX-License-Identifier: Apache-2.0
*/
const P = S`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20px);outline:none;position:relative;vertical-align:top;width:var(--md-radio-icon-size, 20px);-webkit-tap-highlight-color:rgba(0,0,0,0);cursor:pointer;--md-ripple-hover-color: var(--md-radio-hover-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--md-ripple-hover-opacity: var(--md-radio-hover-state-layer-opacity, 0.08);--md-ripple-pressed-color: var(--md-radio-pressed-state-layer-color, var(--md-sys-color-primary, #6750a4));--md-ripple-pressed-opacity: var(--md-radio-pressed-state-layer-opacity, 0.12)}:host([disabled]){cursor:default}:host([touch-target=wrapper]){margin:max(0px,(48px - var(--md-radio-icon-size, 20px))/2)}.container{display:flex;height:100%;place-content:center;place-items:center;width:100%}md-focus-ring{height:44px;inset:unset;width:44px}.checked{--md-ripple-hover-color: var(--md-radio-selected-hover-state-layer-color, var(--md-sys-color-primary, #6750a4));--md-ripple-hover-opacity: var(--md-radio-selected-hover-state-layer-opacity, 0.08);--md-ripple-pressed-color: var(--md-radio-selected-pressed-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--md-ripple-pressed-opacity: var(--md-radio-selected-pressed-state-layer-opacity, 0.12)}.touch-target{height:48px;position:absolute;width:48px}:host([touch-target=none]) .touch-target{display:none}md-ripple{border-radius:50%;height:var(--md-radio-state-layer-size, 40px);inset:unset;width:var(--md-radio-state-layer-size, 40px)}.icon{fill:var(--md-radio-icon-color, var(--md-sys-color-on-surface-variant, #49454f));inset:0;position:absolute}.outer.circle{transition:fill 50ms linear}.inner.circle{opacity:0;transform-origin:center;transition:opacity 50ms linear}.checked .icon{fill:var(--md-radio-selected-icon-color, var(--md-sys-color-primary, #6750a4))}.checked .inner.circle{animation:inner-circle-grow 300ms cubic-bezier(0.05, 0.7, 0.1, 1);opacity:1}@keyframes inner-circle-grow{from{transform:scale(0)}to{transform:scale(1)}}:host([disabled]) .circle{animation-duration:0s;transition-duration:0s}:host(:hover) .icon{fill:var(--md-radio-hover-icon-color, var(--md-sys-color-on-surface, #1d1b20))}:host(:focus-within) .icon{fill:var(--md-radio-focus-icon-color, var(--md-sys-color-on-surface, #1d1b20))}:host(:active) .icon{fill:var(--md-radio-pressed-icon-color, var(--md-sys-color-on-surface, #1d1b20))}:host([disabled]) .icon{fill:var(--md-radio-disabled-unselected-icon-color, var(--md-sys-color-on-surface, #1d1b20));opacity:var(--md-radio-disabled-unselected-icon-opacity, 0.38)}:host(:hover) .checked .icon{fill:var(--md-radio-selected-hover-icon-color, var(--md-sys-color-primary, #6750a4))}:host(:focus-within) .checked .icon{fill:var(--md-radio-selected-focus-icon-color, var(--md-sys-color-primary, #6750a4))}:host(:active) .checked .icon{fill:var(--md-radio-selected-pressed-icon-color, var(--md-sys-color-primary, #6750a4))}:host([disabled]) .checked .icon{fill:var(--md-radio-disabled-selected-icon-color, var(--md-sys-color-on-surface, #1d1b20));opacity:var(--md-radio-disabled-selected-icon-opacity, 0.38)}}@layer hcm{@media(forced-colors: active){.icon{fill:CanvasText}:host([disabled]) .icon{fill:GrayText;opacity:1}}}
`;
/**
* @license
* Copyright 2022 Google LLC
* SPDX-License-Identifier: Apache-2.0
*/
let f = class extends m {
};
f.styles = [P];
f = h([
A("md-radio")
], f);
const j = C({
react: w,
tagName: "md-radio",
elementClass: f
}), re = (d) => {
const {
checked: e,
value: i,
required: t,
disabled: o,
name: r,
ariaLabel: u,
className: a,
style: b,
id: p,
iconColor: l,
selectedIconColor: s,
iconSize: c,
...n
} = d;
return /* @__PURE__ */ x(
j,
{
checked: e,
value: i,
required: t,
disabled: o || !1,
name: r,
className: a,
style: {
...b,
"--md-radio-icon-color": l || "var(--md-sys-on-surface-variant)",
"--md-radio-selected-icon-color": s || "var(--md-sys-color-primary)",
"--md-radio-icon-size": c || "20px"
},
id: p,
"aria-label": u,
...n
} }
); if (t.tertiary) {
}; const n = new s(t.tertiary, r);
e.a3 = n.a1;
}
if (t.error) {
const n = new s(t.error, r);
e.error = n.a1;
}
if (t.neutral) {
const n = new s(t.neutral, r);
e.n1 = n.n1;
}
if (t.neutralVariant) {
const n = new s(t.neutralVariant, r);
e.n2 = n.n2;
}
return e;
}
constructor(r, t) {
const e = u.fromInt(r), n = e.hue, a = e.chroma;
t ? (this.a1 = i.fromHueAndChroma(n, a), this.a2 = i.fromHueAndChroma(n, a / 3), this.a3 = i.fromHueAndChroma(n + 60, a / 2), this.n1 = i.fromHueAndChroma(n, Math.min(a / 12, 4)), this.n2 = i.fromHueAndChroma(n, Math.min(a / 6, 8))) : (this.a1 = i.fromHueAndChroma(n, Math.max(48, a)), this.a2 = i.fromHueAndChroma(n, 16), this.a3 = i.fromHueAndChroma(n + 60, 24), this.n1 = i.fromHueAndChroma(n, 4), this.n2 = i.fromHueAndChroma(n, 8)), this.error = i.fromHueAndChroma(25, 84);
}
}
/**
* @license
* Copyright 2021 Google LLC
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
class m {
get primary() {
return this.props.primary;
}
get onPrimary() {
return this.props.onPrimary;
}
get primaryContainer() {
return this.props.primaryContainer;
}
get onPrimaryContainer() {
return this.props.onPrimaryContainer;
}
get secondary() {
return this.props.secondary;
}
get onSecondary() {
return this.props.onSecondary;
}
get secondaryContainer() {
return this.props.secondaryContainer;
}
get onSecondaryContainer() {
return this.props.onSecondaryContainer;
}
get tertiary() {
return this.props.tertiary;
}
get onTertiary() {
return this.props.onTertiary;
}
get tertiaryContainer() {
return this.props.tertiaryContainer;
}
get onTertiaryContainer() {
return this.props.onTertiaryContainer;
}
get error() {
return this.props.error;
}
get onError() {
return this.props.onError;
}
get errorContainer() {
return this.props.errorContainer;
}
get onErrorContainer() {
return this.props.onErrorContainer;
}
get background() {
return this.props.background;
}
get onBackground() {
return this.props.onBackground;
}
get surface() {
return this.props.surface;
}
get onSurface() {
return this.props.onSurface;
}
get surfaceVariant() {
return this.props.surfaceVariant;
}
get onSurfaceVariant() {
return this.props.onSurfaceVariant;
}
get outline() {
return this.props.outline;
}
get outlineVariant() {
return this.props.outlineVariant;
}
get shadow() {
return this.props.shadow;
}
get scrim() {
return this.props.scrim;
}
get inverseSurface() {
return this.props.inverseSurface;
}
get inverseOnSurface() {
return this.props.inverseOnSurface;
}
get inversePrimary() {
return this.props.inversePrimary;
}
/**
* @param argb ARGB representation of a color.
* @return Light Material color scheme, based on the color's hue.
*/
static light(r) {
return m.lightFromCorePalette(s.of(r));
}
/**
* @param argb ARGB representation of a color.
* @return Dark Material color scheme, based on the color's hue.
*/
static dark(r) {
return m.darkFromCorePalette(s.of(r));
}
/**
* @param argb ARGB representation of a color.
* @return Light Material content color scheme, based on the color's hue.
*/
static lightContent(r) {
return m.lightFromCorePalette(s.contentOf(r));
}
/**
* @param argb ARGB representation of a color.
* @return Dark Material content color scheme, based on the color's hue.
*/
static darkContent(r) {
return m.darkFromCorePalette(s.contentOf(r));
}
/**
* Light scheme from core palette
*/
static lightFromCorePalette(r) {
return new m({
primary: r.a1.tone(40),
onPrimary: r.a1.tone(100),
primaryContainer: r.a1.tone(90),
onPrimaryContainer: r.a1.tone(10),
secondary: r.a2.tone(40),
onSecondary: r.a2.tone(100),
secondaryContainer: r.a2.tone(90),
onSecondaryContainer: r.a2.tone(10),
tertiary: r.a3.tone(40),
onTertiary: r.a3.tone(100),
tertiaryContainer: r.a3.tone(90),
onTertiaryContainer: r.a3.tone(10),
error: r.error.tone(40),
onError: r.error.tone(100),
errorContainer: r.error.tone(90),
onErrorContainer: r.error.tone(10),
background: r.n1.tone(99),
onBackground: r.n1.tone(10),
surface: r.n1.tone(99),
onSurface: r.n1.tone(10),
surfaceVariant: r.n2.tone(90),
onSurfaceVariant: r.n2.tone(30),
outline: r.n2.tone(50),
outlineVariant: r.n2.tone(80),
shadow: r.n1.tone(0),
scrim: r.n1.tone(0),
inverseSurface: r.n1.tone(20),
inverseOnSurface: r.n1.tone(95),
inversePrimary: r.a1.tone(80)
});
}
/**
* Dark scheme from core palette
*/
static darkFromCorePalette(r) {
return new m({
primary: r.a1.tone(80),
onPrimary: r.a1.tone(20),
primaryContainer: r.a1.tone(30),
onPrimaryContainer: r.a1.tone(90),
secondary: r.a2.tone(80),
onSecondary: r.a2.tone(20),
secondaryContainer: r.a2.tone(30),
onSecondaryContainer: r.a2.tone(90),
tertiary: r.a3.tone(80),
onTertiary: r.a3.tone(20),
tertiaryContainer: r.a3.tone(30),
onTertiaryContainer: r.a3.tone(90),
error: r.error.tone(80),
onError: r.error.tone(20),
errorContainer: r.error.tone(30),
onErrorContainer: r.error.tone(80),
background: r.n1.tone(10),
onBackground: r.n1.tone(90),
surface: r.n1.tone(10),
onSurface: r.n1.tone(90),
surfaceVariant: r.n2.tone(30),
onSurfaceVariant: r.n2.tone(80),
outline: r.n2.tone(60),
outlineVariant: r.n2.tone(30),
shadow: r.n1.tone(0),
scrim: r.n1.tone(0),
inverseSurface: r.n1.tone(90),
inverseOnSurface: r.n1.tone(20),
inversePrimary: r.a1.tone(40)
});
}
constructor(r) {
this.props = r;
}
toJSON() {
return {
...this.props
};
}
}
/**
* @license
* Copyright 2021 Google LLC
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
function I(h, r = []) {
const t = s.of(h);
return {
source: h,
schemes: {
light: m.light(h),
dark: m.dark(h)
},
palettes: {
primary: t.a1,
secondary: t.a2,
tertiary: t.a3,
neutral: t.n1,
neutralVariant: t.n2,
error: t.error
},
customColors: r.map((e) => F(h, e))
};
}
function F(h, r) {
let t = r.value;
const e = t, n = h;
r.blend && (t = C.harmonize(e, n));
const o = s.of(t).a1;
return {
color: r,
value: t,
light: {
color: o.tone(40),
onColor: o.tone(100),
colorContainer: o.tone(90),
onColorContainer: o.tone(10)
},
dark: {
color: o.tone(80),
onColor: o.tone(20),
colorContainer: o.tone(30),
onColorContainer: o.tone(90)
}
};
}
function P(h) {
const r = b(h);
return I(r);
}
export { export {
re as Radio P as createTheme
}; };

101
dist/react-you-ui15.js vendored
View File

@ -1,74 +1,45 @@
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const v=require("react/jsx-runtime"),b=require("react"),f=require("./create-component-D9KTUrcf.js"),o=require("./menuItemController-XIsQ9HIe.js"),t=require("./class-map-DV5418hw.js");require("./ripple-DoKzzEey.js");const l=require("./item-DvSwYnPq.js"),g=require("./animation-A38fZ1oY.js"),p=require("./query-assigned-elements-BYttmtWz.js"),E=require("./query-assigned-nodes-Dl8k4w_-.js"),c=require("./static-B9XIUGOk.js"),C=require("./delegate-4958lG3m.js");/** "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const w=require("react/jsx-runtime"),C=require("react"),E=require("./create-component-D9KTUrcf.js"),o=require("./class-map-DV5418hw.js");require("./ripple-DoKzzEey.js");const I=require("./animation-A38fZ1oY.js"),q=require("./form-label-activation-CYEOF_US.js"),f=require("./validator-DUxooTr6.js"),b=require("./element-internals-OOm6rgx-.js"),R=require("./focusable-D3uHX6nn.js"),k=require("./form-associated-CxXMoMPu.js");/**
* @license
* Copyright 2022 Google LLC
* SPDX-License-Identifier: Apache-2.0
*/const T=C.mixinDelegatesAria(t.r);class n extends T{constructor(){super(...arguments),this.disabled=!1,this.type="menuitem",this.href="",this.target="",this.keepOpen=!1,this.selected=!1,this.menuItemController=new o.MenuItemController(this,{getHeadlineElements:()=>this.headlineElements,getSupportingTextElements:()=>this.supportingTextElements,getDefaultElements:()=>this.defaultElements,getInteractiveElement:()=>this.listItemRoot})}get typeaheadText(){return this.menuItemController.typeaheadText}set typeaheadText(e){this.menuItemController.setTypeaheadText(e)}render(){return this.renderListItem(t.x`
<md-item>
<div slot="container">
${this.renderRipple()} ${this.renderFocusRing()}
</div>
<slot name="start" slot="start"></slot>
<slot name="end" slot="end"></slot>
${this.renderBody()}
</md-item>
`)}renderListItem(e){const i=this.type==="link";let s;switch(this.menuItemController.tagName){case"a":s=c.i`a`;break;case"button":s=c.i`button`;break;default:case"li":s=c.i`li`;break}const r=i&&this.target?this.target:t.E;return c.u`
<${s}
id="item"
tabindex=${this.disabled&&!i?-1:0}
role=${this.menuItemController.role}
aria-label=${this.ariaLabel||t.E}
aria-selected=${this.ariaSelected||t.E}
aria-checked=${this.ariaChecked||t.E}
aria-expanded=${this.ariaExpanded||t.E}
aria-haspopup=${this.ariaHasPopup||t.E}
class="list-item ${t.e$1(this.getRenderClasses())}"
href=${this.href||t.E}
target=${r}
@click=${this.menuItemController.onClick}
@keydown=${this.menuItemController.onKeydown}
>${e}</${s}>
`}renderRipple(){return t.x` <md-ripple
part="ripple"
for="item"
?disabled=${this.disabled}></md-ripple>`}renderFocusRing(){return t.x` <md-focus-ring
part="focus-ring"
for="item"
inward></md-focus-ring>`}getRenderClasses(){return{disabled:this.disabled,selected:this.selected}}renderBody(){return t.x`
<slot></slot>
<slot name="overline" slot="overline"></slot>
<slot name="headline" slot="headline"></slot>
<slot name="supporting-text" slot="supporting-text"></slot>
<slot
name="trailing-supporting-text"
slot="trailing-supporting-text"></slot>
`}focus(){var e;(e=this.listItemRoot)==null||e.focus()}}n.shadowRootOptions={...t.r.shadowRootOptions,delegatesFocus:!0};t.__decorate([t.n({type:Boolean,reflect:!0})],n.prototype,"disabled",void 0);t.__decorate([t.n()],n.prototype,"type",void 0);t.__decorate([t.n()],n.prototype,"href",void 0);t.__decorate([t.n()],n.prototype,"target",void 0);t.__decorate([t.n({type:Boolean,attribute:"keep-open"})],n.prototype,"keepOpen",void 0);t.__decorate([t.n({type:Boolean})],n.prototype,"selected",void 0);t.__decorate([g.e$1(".list-item")],n.prototype,"listItemRoot",void 0);t.__decorate([p.o({slot:"headline"})],n.prototype,"headlineElements",void 0);t.__decorate([p.o({slot:"supporting-text"})],n.prototype,"supportingTextElements",void 0);t.__decorate([E.n({slot:""})],n.prototype,"defaultElements",void 0);t.__decorate([t.n({attribute:"typeahead-text"})],n.prototype,"typeaheadText",null);/**
* @license
* Copyright 2022 Google LLC
* SPDX-License-Identifier: Apache-2.0
*/let h=class extends n{};h.styles=[o.styles];h=t.__decorate([t.t$1("md-menu-item")],h);/**
* @license * @license
* Copyright 2023 Google LLC * Copyright 2023 Google LLC
* SPDX-License-Identifier: Apache-2.0 * SPDX-License-Identifier: Apache-2.0
*/let u=class extends t.r{get item(){return this.items[0]??null}get menu(){return this.menus[0]??null}constructor(){super(),this.anchorCorner=o.Corner.START_END,this.menuCorner=o.Corner.START_START,this.hoverOpenDelay=400,this.hoverCloseDelay=400,this.isSubMenu=!0,this.previousOpenTimeout=0,this.previousCloseTimeout=0,this.onMouseenter=()=>{var e;clearTimeout(this.previousOpenTimeout),clearTimeout(this.previousCloseTimeout),!((e=this.menu)!=null&&e.open)&&(this.hoverOpenDelay?this.previousOpenTimeout=setTimeout(()=>{this.show()},this.hoverOpenDelay):this.show())},this.onMouseleave=()=>{clearTimeout(this.previousCloseTimeout),clearTimeout(this.previousOpenTimeout),this.hoverCloseDelay?this.previousCloseTimeout=setTimeout(()=>{this.close()},this.hoverCloseDelay):this.close()},this.addEventListener("mouseenter",this.onMouseenter),this.addEventListener("mouseleave",this.onMouseleave)}render(){return t.x` */class S extends f.Validator{computeValidity(e){this.radioElement||(this.radioElement=document.createElement("input"),this.radioElement.type="radio",this.radioElement.name="group");let i=!1,t=!1;for(const{checked:r,required:a}of e)a&&(i=!0),r&&(t=!0);return this.radioElement.checked=t,this.radioElement.required=i,{validity:{valueMissing:i&&!t},validationMessage:this.radioElement.validationMessage}}equals(e,i){if(e.length!==i.length)return!1;for(let t=0;t<e.length;t++){const r=e[t],a=i[t];if(r.checked!==a.checked||r.required!==a.required)return!1}return!0}copy(e){return e.map(({checked:i,required:t})=>({checked:i,required:t}))}}/**
<slot * @license
name="item" * Copyright 2022 Google LLC
@click=${this.onClick} * SPDX-License-Identifier: Apache-2.0
@keydown=${this.onKeydown} */class A{get controls(){const e=this.host.getAttribute("name");return!e||!this.root||!this.host.isConnected?[this.host]:Array.from(this.root.querySelectorAll(`[name="${e}"]`))}constructor(e){this.host=e,this.focused=!1,this.root=null,this.handleFocusIn=()=>{this.focused=!0,this.updateTabIndices()},this.handleFocusOut=()=>{this.focused=!1,this.updateTabIndices()},this.handleKeyDown=i=>{const t=i.key==="ArrowDown",r=i.key==="ArrowUp",a=i.key==="ArrowLeft",m=i.key==="ArrowRight";if(!a&&!m&&!t&&!r)return;const c=this.controls;if(!c.length)return;i.preventDefault();const p=getComputedStyle(this.host).direction==="rtl"?a||t:m||t,h=c.indexOf(this.host);let s=p?h+1:h-1;for(;s!==h;){s>=c.length?s=0:s<0&&(s=c.length-1);const n=c[s];if(n.hasAttribute("disabled")){p?s++:s--;continue}for(const d of c)d!==n&&(d.checked=!1,d.tabIndex=-1,d.blur());n.checked=!0,n.tabIndex=0,n.focus(),n.dispatchEvent(new Event("change",{bubbles:!0}));break}}}hostConnected(){this.root=this.host.getRootNode(),this.host.addEventListener("keydown",this.handleKeyDown),this.host.addEventListener("focusin",this.handleFocusIn),this.host.addEventListener("focusout",this.handleFocusOut),this.host.checked&&this.uncheckSiblings(),this.updateTabIndices()}hostDisconnected(){this.host.removeEventListener("keydown",this.handleKeyDown),this.host.removeEventListener("focusin",this.handleFocusIn),this.host.removeEventListener("focusout",this.handleFocusOut),this.updateTabIndices(),this.root=null}handleCheckedChange(){this.host.checked&&(this.uncheckSiblings(),this.updateTabIndices())}uncheckSiblings(){for(const e of this.controls)e!==this.host&&(e.checked=!1)}updateTabIndices(){const e=this.controls,i=e.find(t=>t.checked);if(i||this.focused){const t=i||this.host;t.tabIndex=0;for(const r of e)r!==t&&(r.tabIndex=-1);return}for(const t of e)t.tabIndex=0}}/**
@slotchange=${this.onSlotchange}> * @license
</slot> * Copyright 2018 Google LLC
<slot * SPDX-License-Identifier: Apache-2.0
name="menu" */var x;const y=Symbol("checked");let $=0;const L=f.mixinConstraintValidation(k.mixinFormAssociated(b.mixinElementInternals(R.mixinFocusable(o.r))));let u=class extends L{get checked(){return this[y]}set checked(e){const i=this.checked;i!==e&&(this[y]=e,this.requestUpdate("checked",i),this.selectionController.handleCheckedChange())}constructor(){super(),this.maskId=`cutout${++$}`,this[x]=!1,this.required=!1,this.value="on",this.selectionController=new A(this),this.addController(this.selectionController),this[b.internals].role="radio",this.addEventListener("click",this.handleClick.bind(this)),this.addEventListener("keydown",this.handleKeydown.bind(this))}render(){const e={checked:this.checked};return o.x`
@keydown=${this.onSubMenuKeydown} <div class="container ${o.e$1(e)}" aria-hidden="true">
@close-menu=${this.onCloseSubmenu} <md-ripple
@slotchange=${this.onSlotchange}> part="ripple"
</slot> .control=${this}
`}firstUpdated(){this.onSlotchange()}async show(){const e=this.menu;if(!e||e.open)return;e.addEventListener("closed",()=>{this.item.ariaExpanded="false",this.dispatchEvent(o.createActivateTypeaheadEvent()),this.dispatchEvent(l.createDeactivateItemsEvent()),e.ariaHidden="true"},{once:!0}),e.positioning==="document"&&(e.positioning="absolute"),e.quick=!0,e.hasOverflow=!0,e.anchorCorner=this.anchorCorner,e.menuCorner=this.menuCorner,e.anchorElement=this.item,e.defaultFocus="first-item",e.removeAttribute("aria-hidden"),e.skipRestoreFocus=!1;const i=e.open;if(e.show(),this.item.ariaExpanded="true",this.item.ariaHasPopup="menu",e.id&&this.item.setAttribute("aria-controls",e.id),this.dispatchEvent(l.createDeactivateItemsEvent()),this.dispatchEvent(o.createDeactivateTypeaheadEvent()),this.item.selected=!0,!i){let s=d=>{};const r=new Promise(d=>{s=d});e.addEventListener("opened",s,{once:!0}),await r}}async close(){const e=this.menu;if(!e||!e.open)return;this.dispatchEvent(o.createActivateTypeaheadEvent()),e.quick=!0,e.close(),this.dispatchEvent(l.createDeactivateItemsEvent());let i=r=>{};const s=new Promise(r=>{i=r});e.addEventListener("closed",i,{once:!0}),await s}onSlotchange(){var i;if(!this.item)return;this.item.ariaExpanded="false",this.item.ariaHasPopup="menu",(i=this.menu)!=null&&i.id&&this.item.setAttribute("aria-controls",this.menu.id),this.item.keepOpen=!0;const e=this.menu;e&&(e.isSubmenu=!0,e.ariaHidden="true")}onClick(){this.show()}async onKeydown(e){const i=this.isSubmenuOpenKey(e.code);if(e.defaultPrevented)return;const s=i&&(o.NavigableKey.LEFT===e.code||o.NavigableKey.RIGHT===e.code);if((e.code===o.SelectionKey.SPACE||s)&&(e.preventDefault(),s&&e.stopPropagation()),!i)return;const r=this.menu;if(!r)return;const d=r.items,y=l.getFirstActivatableItem(d);if(y){await this.show(),y.tabIndex=0,y.focus();return}}onCloseSubmenu(e){const{itemPath:i,reason:s}=e.detail;if(i.push(this.item),this.dispatchEvent(o.createActivateTypeaheadEvent()),s.kind===o.CloseReason.KEYDOWN&&s.key===o.KeydownCloseKey.ESCAPE){e.stopPropagation(),this.item.dispatchEvent(l.createRequestActivationEvent());return}this.dispatchEvent(l.createDeactivateItemsEvent())}async onSubMenuKeydown(e){var r;if(e.defaultPrevented)return;const{close:i,keyCode:s}=this.isSubmenuCloseKey(e.code);i&&(e.preventDefault(),(s===o.NavigableKey.LEFT||s===o.NavigableKey.RIGHT)&&e.stopPropagation(),await this.close(),l.deactivateActiveItem(this.menu.items),(r=this.item)==null||r.focus(),this.item.tabIndex=0,this.item.focus())}isSubmenuOpenKey(e){const s=getComputedStyle(this).direction==="rtl"?o.NavigableKey.LEFT:o.NavigableKey.RIGHT;switch(e){case s:case o.SelectionKey.SPACE:case o.SelectionKey.ENTER:return!0;default:return!1}}isSubmenuCloseKey(e){const s=getComputedStyle(this).direction==="rtl"?o.NavigableKey.RIGHT:o.NavigableKey.LEFT;switch(e){case s:case o.KeydownCloseKey.ESCAPE:return{close:!0,keyCode:e};default:return{close:!1}}}};t.__decorate([t.n({attribute:"anchor-corner"})],u.prototype,"anchorCorner",void 0);t.__decorate([t.n({attribute:"menu-corner"})],u.prototype,"menuCorner",void 0);t.__decorate([t.n({type:Number,attribute:"hover-open-delay"})],u.prototype,"hoverOpenDelay",void 0);t.__decorate([t.n({type:Number,attribute:"hover-close-delay"})],u.prototype,"hoverCloseDelay",void 0);t.__decorate([t.n({type:Boolean,reflect:!0,attribute:"md-sub-menu"})],u.prototype,"isSubMenu",void 0);t.__decorate([p.o({slot:"item",flatten:!0})],u.prototype,"items",void 0);t.__decorate([p.o({slot:"menu",flatten:!0})],u.prototype,"menus",void 0);/** ?disabled=${this.disabled}></md-ripple>
<md-focus-ring part="focus-ring" .control=${this}></md-focus-ring>
<svg class="icon" viewBox="0 0 20 20">
<mask id="${this.maskId}">
<rect width="100%" height="100%" fill="white" />
<circle cx="10" cy="10" r="8" fill="black" />
</mask>
<circle
class="outer circle"
cx="10"
cy="10"
r="10"
mask="url(#${this.maskId})" />
<circle class="inner circle" cx="10" cy="10" r="5" />
</svg>
<div class="touch-target"></div>
</div>
`}updated(){this[b.internals].ariaChecked=String(this.checked)}async handleClick(e){this.disabled||(await 0,!e.defaultPrevented&&(q.isActivationClick(e)&&this.focus(),this.checked=!0,this.dispatchEvent(new Event("change",{bubbles:!0})),this.dispatchEvent(new InputEvent("input",{bubbles:!0,composed:!0}))))}async handleKeydown(e){await 0,!(e.key!==" "||e.defaultPrevented)&&this.click()}[(x=y,k.getFormValue)](){return this.checked?this.value:null}[k.getFormState](){return String(this.checked)}formResetCallback(){this.checked=this.hasAttribute("checked")}formStateRestoreCallback(e){this.checked=e==="true"}[f.createValidator](){return new S(()=>this.selectionController?this.selectionController.controls:[this])}[f.getValidityAnchor](){return this.container}};o.__decorate([o.n({type:Boolean})],u.prototype,"checked",null);o.__decorate([o.n({type:Boolean})],u.prototype,"required",void 0);o.__decorate([o.n()],u.prototype,"value",void 0);o.__decorate([I.e$1(".container")],u.prototype,"container",void 0);/**
* @license * @license
* Copyright 2024 Google LLC * Copyright 2024 Google LLC
* SPDX-License-Identifier: Apache-2.0 * SPDX-License-Identifier: Apache-2.0
*/const _=t.i$1`:host{position:relative;display:flex;flex-direction:column} */const _=o.i$1`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20px);outline:none;position:relative;vertical-align:top;width:var(--md-radio-icon-size, 20px);-webkit-tap-highlight-color:rgba(0,0,0,0);cursor:pointer;--md-ripple-hover-color: var(--md-radio-hover-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--md-ripple-hover-opacity: var(--md-radio-hover-state-layer-opacity, 0.08);--md-ripple-pressed-color: var(--md-radio-pressed-state-layer-color, var(--md-sys-color-primary, #6750a4));--md-ripple-pressed-opacity: var(--md-radio-pressed-state-layer-opacity, 0.12)}:host([disabled]){cursor:default}:host([touch-target=wrapper]){margin:max(0px,(48px - var(--md-radio-icon-size, 20px))/2)}.container{display:flex;height:100%;place-content:center;place-items:center;width:100%}md-focus-ring{height:44px;inset:unset;width:44px}.checked{--md-ripple-hover-color: var(--md-radio-selected-hover-state-layer-color, var(--md-sys-color-primary, #6750a4));--md-ripple-hover-opacity: var(--md-radio-selected-hover-state-layer-opacity, 0.08);--md-ripple-pressed-color: var(--md-radio-selected-pressed-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--md-ripple-pressed-opacity: var(--md-radio-selected-pressed-state-layer-opacity, 0.12)}.touch-target{height:48px;position:absolute;width:48px}:host([touch-target=none]) .touch-target{display:none}md-ripple{border-radius:50%;height:var(--md-radio-state-layer-size, 40px);inset:unset;width:var(--md-radio-state-layer-size, 40px)}.icon{fill:var(--md-radio-icon-color, var(--md-sys-color-on-surface-variant, #49454f));inset:0;position:absolute}.outer.circle{transition:fill 50ms linear}.inner.circle{opacity:0;transform-origin:center;transition:opacity 50ms linear}.checked .icon{fill:var(--md-radio-selected-icon-color, var(--md-sys-color-primary, #6750a4))}.checked .inner.circle{animation:inner-circle-grow 300ms cubic-bezier(0.05, 0.7, 0.1, 1);opacity:1}@keyframes inner-circle-grow{from{transform:scale(0)}to{transform:scale(1)}}:host([disabled]) .circle{animation-duration:0s;transition-duration:0s}:host(:hover) .icon{fill:var(--md-radio-hover-icon-color, var(--md-sys-color-on-surface, #1d1b20))}:host(:focus-within) .icon{fill:var(--md-radio-focus-icon-color, var(--md-sys-color-on-surface, #1d1b20))}:host(:active) .icon{fill:var(--md-radio-pressed-icon-color, var(--md-sys-color-on-surface, #1d1b20))}:host([disabled]) .icon{fill:var(--md-radio-disabled-unselected-icon-color, var(--md-sys-color-on-surface, #1d1b20));opacity:var(--md-radio-disabled-unselected-icon-opacity, 0.38)}:host(:hover) .checked .icon{fill:var(--md-radio-selected-hover-icon-color, var(--md-sys-color-primary, #6750a4))}:host(:focus-within) .checked .icon{fill:var(--md-radio-selected-focus-icon-color, var(--md-sys-color-primary, #6750a4))}:host(:active) .checked .icon{fill:var(--md-radio-selected-pressed-icon-color, var(--md-sys-color-primary, #6750a4))}:host([disabled]) .checked .icon{fill:var(--md-radio-disabled-selected-icon-color, var(--md-sys-color-on-surface, #1d1b20));opacity:var(--md-radio-disabled-selected-icon-opacity, 0.38)}}@layer hcm{@media(forced-colors: active){.icon{fill:CanvasText}:host([disabled]) .icon{fill:GrayText;opacity:1}}}
`;/** `;/**
* @license * @license
* Copyright 2023 Google LLC * Copyright 2022 Google LLC
* SPDX-License-Identifier: Apache-2.0 * SPDX-License-Identifier: Apache-2.0
*/let m=class extends u{};m.styles=[_];m=t.__decorate([t.t$1("md-sub-menu")],m);const S=f.o({react:b,tagName:"md-menu",elementClass:o.MdMenu}),x=f.o({react:b,tagName:"md-menu-item",elementClass:h,events:{"close-menu":"onCloseMenu"}}),M=f.o({react:b,tagName:"md-sub-menu",elementClass:m}),I=a=>v.jsx(S,{...a}),$=a=>v.jsx(M,{...a}),w=a=>v.jsx(x,{...a});exports.Menu=I;exports.MenuItem=w;exports.SubMenu=$; */let v=class extends u{};v.styles=[_];v=o.__decorate([o.t$1("md-radio")],v);const F=E.o({react:C,tagName:"md-radio",elementClass:v}),T=l=>{const{checked:e,value:i,required:t,disabled:r,name:a,ariaLabel:m,className:c,style:g,id:p,iconColor:h,selectedIconColor:s,iconSize:n,...d}=l;return w.jsx(F,{checked:e,value:i,required:t,disabled:r||!1,name:a,className:c,style:{...g,"--md-radio-icon-color":h||"var(--md-sys-on-surface-variant)","--md-radio-selected-icon-color":s||"var(--md-sys-color-primary)","--md-radio-icon-size":n||"20px"},id:p,"aria-label":m,...d})};exports.Radio=T;

View File

@ -1,411 +1,274 @@
import { jsx as E } from "react/jsx-runtime"; import { jsx as x } from "react/jsx-runtime";
import T from "react"; import w from "react";
import { o as S } from "./create-component-CVXl33PD.mjs"; import { o as C } from "./create-component-CVXl33PD.mjs";
import { M as I, s as R, C as M, c as b, a as k, N as l, S as g, b as O, K as x, d as A } from "./menuItemController-CeB921ip.mjs"; import { _ as h, n as y, r as E, x as I, c as R, a as S, b as A } from "./class-map-CwiboTfb.mjs";
import { r as $, _ as s, n as r, x as d, E as m, c as K, b as w, a as D } from "./class-map-CwiboTfb.mjs";
import "./ripple-pQcEjR05.mjs"; import "./ripple-pQcEjR05.mjs";
import { c as p, g as P, a as L, d as N } from "./item-CpL4zUlE.mjs"; import { a as q } from "./animation-DjClVFum.mjs";
import { a as F } from "./animation-DjClVFum.mjs"; import { i as L } from "./form-label-activation-ed0HgVsy.mjs";
import { o as f } from "./query-assigned-elements-DUhez03i.mjs"; import { V as $, m as F, c as z, g as D } from "./validator-DZt1_yHv.mjs";
import { n as H } from "./query-assigned-nodes-MKI2zKDb.mjs"; import { m as T, i as k } from "./element-internals-3IY9gE4L.mjs";
import { i as C, u as B } from "./static-DdXEOlS4.mjs"; import { m as V } from "./focusable-CDJoU7XD.mjs";
import { m as _ } from "./delegate-BXi1gVeU.mjs"; import { m as K, g as M, a as _ } from "./form-associated-CyYeHPMb.mjs";
/**
* @license
* Copyright 2022 Google LLC
* SPDX-License-Identifier: Apache-2.0
*/
const G = _($);
class i extends G {
constructor() {
super(...arguments), this.disabled = !1, this.type = "menuitem", this.href = "", this.target = "", this.keepOpen = !1, this.selected = !1, this.menuItemController = new I(this, {
getHeadlineElements: () => this.headlineElements,
getSupportingTextElements: () => this.supportingTextElements,
getDefaultElements: () => this.defaultElements,
getInteractiveElement: () => this.listItemRoot
});
}
/**
* The text that is selectable via typeahead. If not set, defaults to the
* innerText of the item slotted into the `"headline"` slot.
*/
get typeaheadText() {
return this.menuItemController.typeaheadText;
}
set typeaheadText(e) {
this.menuItemController.setTypeaheadText(e);
}
render() {
return this.renderListItem(d`
<md-item>
<div slot="container">
${this.renderRipple()} ${this.renderFocusRing()}
</div>
<slot name="start" slot="start"></slot>
<slot name="end" slot="end"></slot>
${this.renderBody()}
</md-item>
`);
}
/**
* Renders the root list item.
*
* @param content the child content of the list item.
*/
renderListItem(e) {
const o = this.type === "link";
let t;
switch (this.menuItemController.tagName) {
case "a":
t = C`a`;
break;
case "button":
t = C`button`;
break;
default:
case "li":
t = C`li`;
break;
}
const n = o && this.target ? this.target : m;
return B`
<${t}
id="item"
tabindex=${this.disabled && !o ? -1 : 0}
role=${this.menuItemController.role}
aria-label=${this.ariaLabel || m}
aria-selected=${this.ariaSelected || m}
aria-checked=${this.ariaChecked || m}
aria-expanded=${this.ariaExpanded || m}
aria-haspopup=${this.ariaHasPopup || m}
class="list-item ${K(this.getRenderClasses())}"
href=${this.href || m}
target=${n}
@click=${this.menuItemController.onClick}
@keydown=${this.menuItemController.onKeydown}
>${e}</${t}>
`;
}
/**
* Handles rendering of the ripple element.
*/
renderRipple() {
return d` <md-ripple
part="ripple"
for="item"
?disabled=${this.disabled}></md-ripple>`;
}
/**
* Handles rendering of the focus ring.
*/
renderFocusRing() {
return d` <md-focus-ring
part="focus-ring"
for="item"
inward></md-focus-ring>`;
}
/**
* Classes applied to the list item root.
*/
getRenderClasses() {
return {
disabled: this.disabled,
selected: this.selected
};
}
/**
* Handles rendering the headline and supporting text.
*/
renderBody() {
return d`
<slot></slot>
<slot name="overline" slot="overline"></slot>
<slot name="headline" slot="headline"></slot>
<slot name="supporting-text" slot="supporting-text"></slot>
<slot
name="trailing-supporting-text"
slot="trailing-supporting-text"></slot>
`;
}
focus() {
var e;
(e = this.listItemRoot) == null || e.focus();
}
}
i.shadowRootOptions = {
...$.shadowRootOptions,
delegatesFocus: !0
};
s([
r({ type: Boolean, reflect: !0 })
], i.prototype, "disabled", void 0);
s([
r()
], i.prototype, "type", void 0);
s([
r()
], i.prototype, "href", void 0);
s([
r()
], i.prototype, "target", void 0);
s([
r({ type: Boolean, attribute: "keep-open" })
], i.prototype, "keepOpen", void 0);
s([
r({ type: Boolean })
], i.prototype, "selected", void 0);
s([
F(".list-item")
], i.prototype, "listItemRoot", void 0);
s([
f({ slot: "headline" })
], i.prototype, "headlineElements", void 0);
s([
f({ slot: "supporting-text" })
], i.prototype, "supportingTextElements", void 0);
s([
H({ slot: "" })
], i.prototype, "defaultElements", void 0);
s([
r({ attribute: "typeahead-text" })
], i.prototype, "typeaheadText", null);
/**
* @license
* Copyright 2022 Google LLC
* SPDX-License-Identifier: Apache-2.0
*/
let c = class extends i {
};
c.styles = [R];
c = s([
w("md-menu-item")
], c);
/** /**
* @license * @license
* Copyright 2023 Google LLC * Copyright 2023 Google LLC
* SPDX-License-Identifier: Apache-2.0 * SPDX-License-Identifier: Apache-2.0
*/ */
let u = class extends $ { class B extends $ {
get item() { computeValidity(e) {
return this.items[0] ?? null; this.radioElement || (this.radioElement = document.createElement("input"), this.radioElement.type = "radio", this.radioElement.name = "group");
} let i = !1, t = !1;
get menu() { for (const { checked: o, required: r } of e)
return this.menus[0] ?? null; r && (i = !0), o && (t = !0);
} return this.radioElement.checked = t, this.radioElement.required = i, {
constructor() { validity: {
super(), this.anchorCorner = M.START_END, this.menuCorner = M.START_START, this.hoverOpenDelay = 400, this.hoverCloseDelay = 400, this.isSubMenu = !0, this.previousOpenTimeout = 0, this.previousCloseTimeout = 0, this.onMouseenter = () => { valueMissing: i && !t
var e; },
clearTimeout(this.previousOpenTimeout), clearTimeout(this.previousCloseTimeout), !((e = this.menu) != null && e.open) && (this.hoverOpenDelay ? this.previousOpenTimeout = setTimeout(() => { validationMessage: this.radioElement.validationMessage
this.show();
}, this.hoverOpenDelay) : this.show());
}, this.onMouseleave = () => {
clearTimeout(this.previousCloseTimeout), clearTimeout(this.previousOpenTimeout), this.hoverCloseDelay ? this.previousCloseTimeout = setTimeout(() => {
this.close();
}, this.hoverCloseDelay) : this.close();
}, this.addEventListener("mouseenter", this.onMouseenter), this.addEventListener("mouseleave", this.onMouseleave);
}
render() {
return d`
<slot
name="item"
@click=${this.onClick}
@keydown=${this.onKeydown}
@slotchange=${this.onSlotchange}>
</slot>
<slot
name="menu"
@keydown=${this.onSubMenuKeydown}
@close-menu=${this.onCloseSubmenu}
@slotchange=${this.onSlotchange}>
</slot>
`;
}
firstUpdated() {
this.onSlotchange();
}
/**
* Shows the submenu.
*/
async show() {
const e = this.menu;
if (!e || e.open)
return;
e.addEventListener("closed", () => {
this.item.ariaExpanded = "false", this.dispatchEvent(b()), this.dispatchEvent(p()), e.ariaHidden = "true";
}, { once: !0 }), e.positioning === "document" && (e.positioning = "absolute"), e.quick = !0, e.hasOverflow = !0, e.anchorCorner = this.anchorCorner, e.menuCorner = this.menuCorner, e.anchorElement = this.item, e.defaultFocus = "first-item", e.removeAttribute("aria-hidden"), e.skipRestoreFocus = !1;
const o = e.open;
if (e.show(), this.item.ariaExpanded = "true", this.item.ariaHasPopup = "menu", e.id && this.item.setAttribute("aria-controls", e.id), this.dispatchEvent(p()), this.dispatchEvent(k()), this.item.selected = !0, !o) {
let t = (h) => {
};
const n = new Promise((h) => {
t = h;
});
e.addEventListener("opened", t, { once: !0 }), await n;
}
}
/**
* Closes the submenu.
*/
async close() {
const e = this.menu;
if (!e || !e.open)
return;
this.dispatchEvent(b()), e.quick = !0, e.close(), this.dispatchEvent(p());
let o = (n) => {
}; };
const t = new Promise((n) => {
o = n;
});
e.addEventListener("closed", o, { once: !0 }), await t;
} }
onSlotchange() { equals(e, i) {
var o; if (e.length !== i.length)
if (!this.item) return !1;
return; for (let t = 0; t < e.length; t++) {
this.item.ariaExpanded = "false", this.item.ariaHasPopup = "menu", (o = this.menu) != null && o.id && this.item.setAttribute("aria-controls", this.menu.id), this.item.keepOpen = !0; const o = e[t], r = i[t];
const e = this.menu; if (o.checked !== r.checked || o.required !== r.required)
e && (e.isSubmenu = !0, e.ariaHidden = "true");
}
onClick() {
this.show();
}
/**
* On item keydown handles opening the submenu.
*/
async onKeydown(e) {
const o = this.isSubmenuOpenKey(e.code);
if (e.defaultPrevented)
return;
const t = o && (l.LEFT === e.code || l.RIGHT === e.code);
if ((e.code === g.SPACE || t) && (e.preventDefault(), t && e.stopPropagation()), !o)
return;
const n = this.menu;
if (!n)
return;
const h = n.items, v = P(h);
if (v) {
await this.show(), v.tabIndex = 0, v.focus();
return;
}
}
onCloseSubmenu(e) {
const { itemPath: o, reason: t } = e.detail;
if (o.push(this.item), this.dispatchEvent(b()), t.kind === O.KEYDOWN && t.key === x.ESCAPE) {
e.stopPropagation(), this.item.dispatchEvent(L());
return;
}
this.dispatchEvent(p());
}
async onSubMenuKeydown(e) {
var n;
if (e.defaultPrevented)
return;
const { close: o, keyCode: t } = this.isSubmenuCloseKey(e.code);
o && (e.preventDefault(), (t === l.LEFT || t === l.RIGHT) && e.stopPropagation(), await this.close(), N(this.menu.items), (n = this.item) == null || n.focus(), this.item.tabIndex = 0, this.item.focus());
}
/**
* Determines whether the given KeyboardEvent code is one that should open
* the submenu. This is RTL-aware. By default, left, right, space, or enter.
*
* @param code The native KeyboardEvent code.
* @return Whether or not the key code should open the submenu.
*/
isSubmenuOpenKey(e) {
const t = getComputedStyle(this).direction === "rtl" ? l.LEFT : l.RIGHT;
switch (e) {
case t:
case g.SPACE:
case g.ENTER:
return !0;
default:
return !1; return !1;
} }
return !0;
}
copy(e) {
return e.map(({ checked: i, required: t }) => ({
checked: i,
required: t
}));
}
}
/**
* @license
* Copyright 2022 Google LLC
* SPDX-License-Identifier: Apache-2.0
*/
class O {
/**
* All single selection elements in the host element's root with the same
* `name` attribute, including the host element.
*/
get controls() {
const e = this.host.getAttribute("name");
return !e || !this.root || !this.host.isConnected ? [this.host] : Array.from(this.root.querySelectorAll(`[name="${e}"]`));
}
constructor(e) {
this.host = e, this.focused = !1, this.root = null, this.handleFocusIn = () => {
this.focused = !0, this.updateTabIndices();
}, this.handleFocusOut = () => {
this.focused = !1, this.updateTabIndices();
}, this.handleKeyDown = (i) => {
const t = i.key === "ArrowDown", o = i.key === "ArrowUp", r = i.key === "ArrowLeft", u = i.key === "ArrowRight";
if (!r && !u && !t && !o)
return;
const a = this.controls;
if (!a.length)
return;
i.preventDefault();
const p = getComputedStyle(this.host).direction === "rtl" ? r || t : u || t, l = a.indexOf(this.host);
let s = p ? l + 1 : l - 1;
for (; s !== l; ) {
s >= a.length ? s = 0 : s < 0 && (s = a.length - 1);
const c = a[s];
if (c.hasAttribute("disabled")) {
p ? s++ : s--;
continue;
}
for (const n of a)
n !== c && (n.checked = !1, n.tabIndex = -1, n.blur());
c.checked = !0, c.tabIndex = 0, c.focus(), c.dispatchEvent(new Event("change", { bubbles: !0 }));
break;
}
};
}
hostConnected() {
this.root = this.host.getRootNode(), this.host.addEventListener("keydown", this.handleKeyDown), this.host.addEventListener("focusin", this.handleFocusIn), this.host.addEventListener("focusout", this.handleFocusOut), this.host.checked && this.uncheckSiblings(), this.updateTabIndices();
}
hostDisconnected() {
this.host.removeEventListener("keydown", this.handleKeyDown), this.host.removeEventListener("focusin", this.handleFocusIn), this.host.removeEventListener("focusout", this.handleFocusOut), this.updateTabIndices(), this.root = null;
} }
/** /**
* Determines whether the given KeyboardEvent code is one that should close * Should be called whenever the host's `checked` property changes
* the submenu. This is RTL-aware. By default right, left, or escape. * synchronously.
*
* @param code The native KeyboardEvent code.
* @return Whether or not the key code should close the submenu.
*/ */
isSubmenuCloseKey(e) { handleCheckedChange() {
const t = getComputedStyle(this).direction === "rtl" ? l.RIGHT : l.LEFT; this.host.checked && (this.uncheckSiblings(), this.updateTabIndices());
switch (e) { }
case t: uncheckSiblings() {
case x.ESCAPE: for (const e of this.controls)
return { close: !0, keyCode: e }; e !== this.host && (e.checked = !1);
default: }
return { close: !1 }; /**
* Updates the `tabindex` of the host and its siblings.
*/
updateTabIndices() {
const e = this.controls, i = e.find((t) => t.checked);
if (i || this.focused) {
const t = i || this.host;
t.tabIndex = 0;
for (const o of e)
o !== t && (o.tabIndex = -1);
return;
} }
for (const t of e)
t.tabIndex = 0;
}
}
/**
* @license
* Copyright 2018 Google LLC
* SPDX-License-Identifier: Apache-2.0
*/
var g;
const v = Symbol("checked");
let N = 0;
const U = F(K(T(V(E))));
let m = class extends U {
/**
* Whether or not the radio is selected.
*/
get checked() {
return this[v];
}
set checked(e) {
const i = this.checked;
i !== e && (this[v] = e, this.requestUpdate("checked", i), this.selectionController.handleCheckedChange());
}
constructor() {
super(), this.maskId = `cutout${++N}`, this[g] = !1, this.required = !1, this.value = "on", this.selectionController = new O(this), this.addController(this.selectionController), this[k].role = "radio", this.addEventListener("click", this.handleClick.bind(this)), this.addEventListener("keydown", this.handleKeydown.bind(this));
}
render() {
const e = { checked: this.checked };
return I`
<div class="container ${R(e)}" aria-hidden="true">
<md-ripple
part="ripple"
.control=${this}
?disabled=${this.disabled}></md-ripple>
<md-focus-ring part="focus-ring" .control=${this}></md-focus-ring>
<svg class="icon" viewBox="0 0 20 20">
<mask id="${this.maskId}">
<rect width="100%" height="100%" fill="white" />
<circle cx="10" cy="10" r="8" fill="black" />
</mask>
<circle
class="outer circle"
cx="10"
cy="10"
r="10"
mask="url(#${this.maskId})" />
<circle class="inner circle" cx="10" cy="10" r="5" />
</svg>
<div class="touch-target"></div>
</div>
`;
}
updated() {
this[k].ariaChecked = String(this.checked);
}
async handleClick(e) {
this.disabled || (await 0, !e.defaultPrevented && (L(e) && this.focus(), this.checked = !0, this.dispatchEvent(new Event("change", { bubbles: !0 })), this.dispatchEvent(new InputEvent("input", { bubbles: !0, composed: !0 }))));
}
async handleKeydown(e) {
await 0, !(e.key !== " " || e.defaultPrevented) && this.click();
}
[(g = v, M)]() {
return this.checked ? this.value : null;
}
[_]() {
return String(this.checked);
}
formResetCallback() {
this.checked = this.hasAttribute("checked");
}
formStateRestoreCallback(e) {
this.checked = e === "true";
}
[z]() {
return new B(() => this.selectionController ? this.selectionController.controls : [this]);
}
[D]() {
return this.container;
} }
}; };
s([ h([
r({ attribute: "anchor-corner" }) y({ type: Boolean })
], u.prototype, "anchorCorner", void 0); ], m.prototype, "checked", null);
s([ h([
r({ attribute: "menu-corner" }) y({ type: Boolean })
], u.prototype, "menuCorner", void 0); ], m.prototype, "required", void 0);
s([ h([
r({ type: Number, attribute: "hover-open-delay" }) y()
], u.prototype, "hoverOpenDelay", void 0); ], m.prototype, "value", void 0);
s([ h([
r({ type: Number, attribute: "hover-close-delay" }) q(".container")
], u.prototype, "hoverCloseDelay", void 0); ], m.prototype, "container", void 0);
s([
r({ type: Boolean, reflect: !0, attribute: "md-sub-menu" })
], u.prototype, "isSubMenu", void 0);
s([
f({ slot: "item", flatten: !0 })
], u.prototype, "items", void 0);
s([
f({ slot: "menu", flatten: !0 })
], u.prototype, "menus", void 0);
/** /**
* @license * @license
* Copyright 2024 Google LLC * Copyright 2024 Google LLC
* SPDX-License-Identifier: Apache-2.0 * SPDX-License-Identifier: Apache-2.0
*/ */
const q = D`:host{position:relative;display:flex;flex-direction:column} const P = S`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20px);outline:none;position:relative;vertical-align:top;width:var(--md-radio-icon-size, 20px);-webkit-tap-highlight-color:rgba(0,0,0,0);cursor:pointer;--md-ripple-hover-color: var(--md-radio-hover-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--md-ripple-hover-opacity: var(--md-radio-hover-state-layer-opacity, 0.08);--md-ripple-pressed-color: var(--md-radio-pressed-state-layer-color, var(--md-sys-color-primary, #6750a4));--md-ripple-pressed-opacity: var(--md-radio-pressed-state-layer-opacity, 0.12)}:host([disabled]){cursor:default}:host([touch-target=wrapper]){margin:max(0px,(48px - var(--md-radio-icon-size, 20px))/2)}.container{display:flex;height:100%;place-content:center;place-items:center;width:100%}md-focus-ring{height:44px;inset:unset;width:44px}.checked{--md-ripple-hover-color: var(--md-radio-selected-hover-state-layer-color, var(--md-sys-color-primary, #6750a4));--md-ripple-hover-opacity: var(--md-radio-selected-hover-state-layer-opacity, 0.08);--md-ripple-pressed-color: var(--md-radio-selected-pressed-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--md-ripple-pressed-opacity: var(--md-radio-selected-pressed-state-layer-opacity, 0.12)}.touch-target{height:48px;position:absolute;width:48px}:host([touch-target=none]) .touch-target{display:none}md-ripple{border-radius:50%;height:var(--md-radio-state-layer-size, 40px);inset:unset;width:var(--md-radio-state-layer-size, 40px)}.icon{fill:var(--md-radio-icon-color, var(--md-sys-color-on-surface-variant, #49454f));inset:0;position:absolute}.outer.circle{transition:fill 50ms linear}.inner.circle{opacity:0;transform-origin:center;transition:opacity 50ms linear}.checked .icon{fill:var(--md-radio-selected-icon-color, var(--md-sys-color-primary, #6750a4))}.checked .inner.circle{animation:inner-circle-grow 300ms cubic-bezier(0.05, 0.7, 0.1, 1);opacity:1}@keyframes inner-circle-grow{from{transform:scale(0)}to{transform:scale(1)}}:host([disabled]) .circle{animation-duration:0s;transition-duration:0s}:host(:hover) .icon{fill:var(--md-radio-hover-icon-color, var(--md-sys-color-on-surface, #1d1b20))}:host(:focus-within) .icon{fill:var(--md-radio-focus-icon-color, var(--md-sys-color-on-surface, #1d1b20))}:host(:active) .icon{fill:var(--md-radio-pressed-icon-color, var(--md-sys-color-on-surface, #1d1b20))}:host([disabled]) .icon{fill:var(--md-radio-disabled-unselected-icon-color, var(--md-sys-color-on-surface, #1d1b20));opacity:var(--md-radio-disabled-unselected-icon-opacity, 0.38)}:host(:hover) .checked .icon{fill:var(--md-radio-selected-hover-icon-color, var(--md-sys-color-primary, #6750a4))}:host(:focus-within) .checked .icon{fill:var(--md-radio-selected-focus-icon-color, var(--md-sys-color-primary, #6750a4))}:host(:active) .checked .icon{fill:var(--md-radio-selected-pressed-icon-color, var(--md-sys-color-primary, #6750a4))}:host([disabled]) .checked .icon{fill:var(--md-radio-disabled-selected-icon-color, var(--md-sys-color-on-surface, #1d1b20));opacity:var(--md-radio-disabled-selected-icon-opacity, 0.38)}}@layer hcm{@media(forced-colors: active){.icon{fill:CanvasText}:host([disabled]) .icon{fill:GrayText;opacity:1}}}
`; `;
/** /**
* @license * @license
* Copyright 2023 Google LLC * Copyright 2022 Google LLC
* SPDX-License-Identifier: Apache-2.0 * SPDX-License-Identifier: Apache-2.0
*/ */
let y = class extends u { let f = class extends m {
};
f.styles = [P];
f = h([
A("md-radio")
], f);
const j = C({
react: w,
tagName: "md-radio",
elementClass: f
}), re = (d) => {
const {
checked: e,
value: i,
required: t,
disabled: o,
name: r,
ariaLabel: u,
className: a,
style: b,
id: p,
iconColor: l,
selectedIconColor: s,
iconSize: c,
...n
} = d;
return /* @__PURE__ */ x(
j,
{
checked: e,
value: i,
required: t,
disabled: o || !1,
name: r,
className: a,
style: {
...b,
"--md-radio-icon-color": l || "var(--md-sys-on-surface-variant)",
"--md-radio-selected-icon-color": s || "var(--md-sys-color-primary)",
"--md-radio-icon-size": c || "20px"
},
id: p,
"aria-label": u,
...n
}
);
}; };
y.styles = [q];
y = s([
w("md-sub-menu")
], y);
const W = S({
react: T,
tagName: "md-menu",
elementClass: A
}), j = S({
react: T,
tagName: "md-menu-item",
elementClass: c,
events: {
"close-menu": "onCloseMenu"
}
}), U = S({
react: T,
tagName: "md-sub-menu",
elementClass: y
}), le = (a) => /* @__PURE__ */ E(
W,
{
...a
}
), ue = (a) => /* @__PURE__ */ E(
U,
{
...a
}
), me = (a) => /* @__PURE__ */ E(j, { ...a });
export { export {
le as Menu, re as Radio
me as MenuItem,
ue as SubMenu
}; };

133
dist/react-you-ui16.js vendored

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

119
dist/react-you-ui17.js vendored

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

105
dist/react-you-ui18.js vendored

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

110
dist/react-you-ui21.js vendored

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

180
dist/react-you-ui22.js vendored

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

267
dist/react-you-ui23.js vendored

File diff suppressed because one or more lines are too long

1203
dist/react-you-ui23.mjs vendored

File diff suppressed because one or more lines are too long

248
dist/react-you-ui24.js vendored

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

216
dist/react-you-ui25.js vendored

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

208
dist/react-you-ui26.js vendored

File diff suppressed because one or more lines are too long

1625
dist/react-you-ui26.mjs vendored

File diff suppressed because one or more lines are too long

18
dist/react-you-ui27.js vendored Normal file

File diff suppressed because one or more lines are too long

1047
dist/react-you-ui27.mjs vendored Normal file

File diff suppressed because it is too large Load Diff

View File

@ -1 +1 @@
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),c=require("./react-you-ui26.js"),n=({children:e,style:o,...r})=>(console.log(r,o),s.jsx(c.Box,{...r,style:{borderRadius:"28px",backgroundColor:"var(--md-sys-color-surface)",color:"var(--md-sys-color-on-surface)",padding:"18px",display:"flex",...o},children:e}));exports.Paper=n; "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),c=require("./react-you-ui27.js"),n=({children:e,style:o,...r})=>(console.log(r,o),s.jsx(c.Box,{...r,style:{borderRadius:"28px",backgroundColor:"var(--md-sys-color-surface)",color:"var(--md-sys-color-on-surface)",padding:"18px",display:"flex",...o},children:e}));exports.Paper=n;

View File

@ -1,5 +1,5 @@
import { jsx as a } from "react/jsx-runtime"; import { jsx as a } from "react/jsx-runtime";
import { Box as c } from "./react-you-ui26.mjs"; import { Box as c } from "./react-you-ui27.mjs";
const l = ({ children: s, style: o, ...r }) => (console.log(r, o), /* @__PURE__ */ a( const l = ({ children: s, style: o, ...r }) => (console.log(r, o), /* @__PURE__ */ a(
c, c,
{ {

View File

@ -1 +1 @@
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),c=require("./react-you-ui26.js"),i=e=>{const{className:t,id:n,children:r,style:s,...o}=e;return a.jsx(c.Box,{className:t,id:n,style:{display:"flex",alignItems:"center",justifyContent:"space-between",padding:"16px 16px",backgroundColor:"transparent",...s},...o,children:r})};exports.AppBar=i; "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),n=({orientation:r="horizontal",className:e="",style:i,color:t="var(--md-sys-color-outline-variant)",...o})=>{const a={backgroundColor:t,...r==="horizontal"?{width:"100%",height:"1px",margin:"8px 0"}:{width:"1px",height:"100%",margin:"0 8px"},...i};return s.jsx("div",{role:"separator","aria-orientation":r,className:`md-divider ${e}`,style:a,...o})};exports.Divider=n;

View File

@ -1,25 +1,29 @@
import { jsx as p } from "react/jsx-runtime"; import { jsx as s } from "react/jsx-runtime";
import { Box as a } from "./react-you-ui26.mjs"; const d = ({ orientation: r = "horizontal", className: i = "", style: o, color: t = "var(--md-sys-color-outline-variant)", ...a }) => {
const c = (e) => { const e = {
const { className: t, id: r, children: n, style: s, ...o } = e; backgroundColor: t,
return /* @__PURE__ */ p( ...r === "horizontal" ? {
a, width: "100%",
height: "1px",
margin: "8px 0"
} : {
width: "1px",
height: "100%",
margin: "0 8px"
},
...o
};
return /* @__PURE__ */ s(
"div",
{ {
className: t, role: "separator",
id: r, "aria-orientation": r,
style: { className: `md-divider ${i}`,
display: "flex", style: e,
alignItems: "center", ...a
justifyContent: "space-between",
padding: "16px 16px",
backgroundColor: "transparent",
...s
},
...o,
children: n
} }
); );
}; };
export { export {
c as AppBar d as Divider
}; };

12
dist/src/components/Divider.d.ts vendored Normal file
View File

@ -0,0 +1,12 @@
import { default as React } from 'react';
import { AriaProps } from '../types/aria';
type DividerProps = AriaProps & {
orientation?: 'horizontal' | 'vertical';
className?: string;
style?: React.CSSProperties;
id?: string;
color?: string;
};
export declare const Divider: ({ orientation, className, style, color, ...props }: DividerProps) => React.JSX.Element;
export {};

View File

@ -0,0 +1,38 @@
import React from 'react';
import { AriaProps } from '../types/aria';
type DividerProps = AriaProps & {
orientation?: 'horizontal' | 'vertical';
className?: string;
style?: React.CSSProperties;
id?: string;
color?: string;
};
export const Divider = ({ orientation = 'horizontal', className = '', style, color = 'var(--md-sys-color-outline-variant)', ...props }: DividerProps) => {
const baseStyles: React.CSSProperties = {
backgroundColor: color,
...(orientation === 'horizontal'
? {
width: '100%',
height: '1px',
margin: '8px 0',
}
: {
width: '1px',
height: '100%',
margin: '0 8px',
}),
...style,
};
return (
<div
role="separator"
aria-orientation={orientation}
className={`md-divider ${className}`}
style={baseStyles}
{...props}
/>
);
};