Link component
This commit is contained in:
OfficialDakari
parent
4f329ae859
commit
331a9f6c3b
|
|
@ -1 +1 @@
|
||||||
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("./react-you-ui21.js"),s=require("./react-you-ui23.js"),i=require("./react-you-ui9.js"),c=require("./react-you-ui13.js"),p=require("./react-you-ui22.js"),u=require("./react-you-ui10.js"),a=require("./react-you-ui15.js"),m=require("./react-you-ui11.js"),h=require("./react-you-ui16.js"),l=require("./react-you-ui25.js"),q=require("./react-you-ui5.js"),_=require("./react-you-ui20.js"),e=require("./react-you-ui24.js"),t=require("./react-you-ui18.js"),r=require("./react-you-ui19.js"),B=require("./react-you-ui17.js"),T=require("./react-you-ui14.js"),d=require("./react-you-ui6.js"),C=require("./react-you-ui7.js"),F=require("./react-you-ui8.js"),o=require("./react-you-ui3.js"),b=require("./react-you-ui12.js");exports.TextField=n.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=r.Tab;exports.Tabs=r.Tabs;exports.CircularProgress=B.CircularProgress;exports.Menu=T.Menu;exports.Paper=d.Paper;exports.FormLabel=C.FormLabel;exports.AppBar=F.AppBar;exports.ThemeProvider=o.ThemeProvider;exports.usePalette=o.usePalette;exports.useTheme=o.useTheme;exports.createTheme=b.createTheme;
|
"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;
|
||||||
|
|
|
||||||
|
|
@ -1,53 +1,55 @@
|
||||||
import { TextField as e } from "./react-you-ui21.mjs";
|
import { TextField as e } from "./react-you-ui22.mjs";
|
||||||
import { Button as p } from "./react-you-ui23.mjs";
|
import { Button as p } from "./react-you-ui24.mjs";
|
||||||
import { Checkbox as x } from "./react-you-ui9.mjs";
|
import { Checkbox as x } from "./react-you-ui10.mjs";
|
||||||
import { Radio as i } from "./react-you-ui13.mjs";
|
import { Radio as i } from "./react-you-ui14.mjs";
|
||||||
import { Select as h } from "./react-you-ui22.mjs";
|
import { Select as h } from "./react-you-ui23.mjs";
|
||||||
import { Switch as l } from "./react-you-ui10.mjs";
|
import { Switch as l } from "./react-you-ui11.mjs";
|
||||||
import { Slider as B } from "./react-you-ui15.mjs";
|
import { Slider as u } from "./react-you-ui16.mjs";
|
||||||
import { Dialog as c } from "./react-you-ui11.mjs";
|
import { Dialog as T } from "./react-you-ui12.mjs";
|
||||||
import { List as n } from "./react-you-ui16.mjs";
|
import { List as d } from "./react-you-ui17.mjs";
|
||||||
import { Box as F } from "./react-you-ui25.mjs";
|
import { Box as F } from "./react-you-ui26.mjs";
|
||||||
import { Typography as A } from "./react-you-ui5.mjs";
|
import { Typography as A } from "./react-you-ui3.mjs";
|
||||||
import { IconButton as S } from "./react-you-ui20.mjs";
|
import { IconButton as S } from "./react-you-ui21.mjs";
|
||||||
import { AssistChip as y, ChipSet as I, FilterChip as L, InputChip as k } from "./react-you-ui24.mjs";
|
import { AssistChip as L, ChipSet as k, FilterChip as y, InputChip as I } from "./react-you-ui25.mjs";
|
||||||
import { BrandedFAB as w, FAB as D } from "./react-you-ui18.mjs";
|
import { BrandedFAB as w, FAB as D } from "./react-you-ui19.mjs";
|
||||||
import { Tab as R, Tabs as j } from "./react-you-ui19.mjs";
|
import { Tab as R, Tabs as j } from "./react-you-ui20.mjs";
|
||||||
import { CircularProgress as z } from "./react-you-ui17.mjs";
|
import { CircularProgress as z } from "./react-you-ui18.mjs";
|
||||||
import { Menu as G } from "./react-you-ui14.mjs";
|
import { Menu as G } from "./react-you-ui15.mjs";
|
||||||
import { Paper as J } from "./react-you-ui6.mjs";
|
import { Paper as J } from "./react-you-ui4.mjs";
|
||||||
import { FormLabel as N } from "./react-you-ui7.mjs";
|
import { FormLabel as N } from "./react-you-ui8.mjs";
|
||||||
import { AppBar as Q } from "./react-you-ui8.mjs";
|
import { AppBar as Q } from "./react-you-ui9.mjs";
|
||||||
import { ThemeProvider as V, usePalette as W, useTheme as X } from "./react-you-ui3.mjs";
|
import { Link as V } from "./react-you-ui5.mjs";
|
||||||
import { createTheme as Z } from "./react-you-ui12.mjs";
|
import { ThemeProvider as X, usePalette as Y, useTheme as Z } from "./react-you-ui6.mjs";
|
||||||
|
import { createTheme as $ } from "./react-you-ui13.mjs";
|
||||||
export {
|
export {
|
||||||
Q as AppBar,
|
Q as AppBar,
|
||||||
y as AssistChip,
|
L as AssistChip,
|
||||||
F as Box,
|
F as Box,
|
||||||
w as BrandedFAB,
|
w as BrandedFAB,
|
||||||
p as Button,
|
p as Button,
|
||||||
x as Checkbox,
|
x as Checkbox,
|
||||||
I as ChipSet,
|
k as ChipSet,
|
||||||
z as CircularProgress,
|
z as CircularProgress,
|
||||||
c as Dialog,
|
T as Dialog,
|
||||||
D as FAB,
|
D as FAB,
|
||||||
L as FilterChip,
|
y as FilterChip,
|
||||||
N as FormLabel,
|
N as FormLabel,
|
||||||
S as IconButton,
|
S as IconButton,
|
||||||
k as InputChip,
|
I as InputChip,
|
||||||
n as List,
|
V as Link,
|
||||||
|
d as List,
|
||||||
G as Menu,
|
G as Menu,
|
||||||
J as Paper,
|
J as Paper,
|
||||||
i as Radio,
|
i as Radio,
|
||||||
h as Select,
|
h as Select,
|
||||||
B as Slider,
|
u as Slider,
|
||||||
l as Switch,
|
l as Switch,
|
||||||
R as Tab,
|
R as Tab,
|
||||||
j as Tabs,
|
j as Tabs,
|
||||||
e as TextField,
|
e as TextField,
|
||||||
V as ThemeProvider,
|
X as ThemeProvider,
|
||||||
A as Typography,
|
A as Typography,
|
||||||
Z as createTheme,
|
$ as createTheme,
|
||||||
W as usePalette,
|
Y as usePalette,
|
||||||
X as useTheme
|
Z as useTheme
|
||||||
};
|
};
|
||||||
|
|
|
||||||
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
|
|
@ -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;
|
|
||||||
|
|
|
||||||
|
|
@ -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
|
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -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;
|
||||||
|
|
|
||||||
|
|
@ -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
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -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;
|
||||||
|
|
|
||||||
|
|
@ -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
|
|
||||||
};
|
};
|
||||||
|
|
|
||||||
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
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
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
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 it is too large
Load Diff
|
|
@ -1,98 +1 @@
|
||||||
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),r=require("./string_utils-Bad7L8P5.js"),l=require("react"),y=require("./react-you-ui4.js");;/* empty css */const n=l.createContext(void 0);function d({children:o,theme:s,scheme:e}){return a.jsxs(n.Provider,{value:s,children:[a.jsx("style",{children:`
|
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const h=require("react/jsx-runtime"),d=require("react");;/* empty css */const p=({children:r,variant:s="span",className:a,color:t="",align:i,style:n,noWrap:l,id:y,size:m="auto",htmlFor:f})=>{const o=d.useMemo(()=>t==="primary"?"var(--md-sys-color-primary)":t==="secondary"?"var(--md-sys-color-secondary)":t==="tertiary"?"var(--md-sys-color-tertiary)":t==="error"?"var(--md-sys-color-error)":t==="on-primary"?"var(--md-sys-color-on-primary)":t==="on-secondary"?"var(--md-sys-color-on-secondary)":t==="on-tertiary"?"var(--md-sys-color-on-tertiary)":t==="on-error"?"var(--md-sys-color-on-error)":t==="on-surface"?"var(--md-sys-color-on-surface)":t==="scrim"?"var(--md-sys-color-scrim)":t==="outline"?"var(--md-sys-color-outline)":t==="outline-variant"?"var(--md-sys-color-outline-variant)":t,[t]),e=d.useMemo(()=>{if(m==="auto")return{h1:"large",h2:"large",h3:"medium",h4:"medium",h5:"small",h6:"small",p:"large",span:"large",label:"large"}[s];if(m==="small")return"small";if(m==="medium")return"medium";if(m==="large")return"large"},[m]);return s==="h1"?h.jsx("h1",{className:a,style:{color:o,fontWeight:`var(--md-sys-typescale-headline-${e}-weight)`,fontSize:`var(--md-sys-typescale-headline-${e}-size)`,lineHeight:`var(--md-sys-typescale-headline-${e}-line-height)`,fontFamily:`var(--md-sys-typescale-headline-${e}-font)`,textAlign:i,whiteSpace:l?"nowrap":"normal",...n},id:y,children:r}):s==="h2"?h.jsx("h2",{className:a,style:{color:o,fontWeight:`var(--md-sys-typescale-headline-${e}-weight)`,fontSize:`var(--md-sys-typescale-headline-${e}-size)`,lineHeight:`var(--md-sys-typescale-headline-${e}-line-height)`,fontFamily:`var(--md-sys-typescale-headline-${e}-font)`,textAlign:i,whiteSpace:l?"nowrap":"normal",...n},id:y,children:r}):s==="h3"?h.jsx("h3",{className:a,style:{color:o,fontWeight:`var(--md-sys-typescale-headline-${e}-weight)`,fontSize:`var(--md-sys-typescale-headline-${e}-size)`,lineHeight:`var(--md-sys-typescale-headline-${e}-line-height)`,fontFamily:`var(--md-sys-typescale-headline-${e}-font)`,textAlign:i,whiteSpace:l?"nowrap":"normal",...n},id:y,children:r}):s==="h4"?h.jsx("h4",{className:a,style:{color:o,fontWeight:`var(--md-sys-typescale-headline-${e}-weight)`,fontSize:`var(--md-sys-typescale-headline-${e}-size)`,lineHeight:`var(--md-sys-typescale-headline-${e}-line-height)`,fontFamily:`var(--md-sys-typescale-headline-${e}-font)`,textAlign:i,whiteSpace:l?"nowrap":"normal",...n},id:y,children:r}):s==="h5"?h.jsx("h5",{className:a,style:{color:o,fontWeight:`var(--md-sys-typescale-headline-${e}-weight)`,fontSize:`var(--md-sys-typescale-headline-${e}-size)`,lineHeight:`var(--md-sys-typescale-headline-${e}-line-height)`,fontFamily:`var(--md-sys-typescale-headline-${e}-font)`,textAlign:i,whiteSpace:l?"nowrap":"normal",...n},id:y,children:r}):s==="h6"?h.jsx("h6",{className:a,style:{color:o,fontWeight:`var(--md-sys-typescale-headline-${e}-weight)`,fontSize:`var(--md-sys-typescale-headline-${e}-size)`,lineHeight:`var(--md-sys-typescale-headline-${e}-line-height)`,fontFamily:`var(--md-sys-typescale-headline-${e}-font)`,textAlign:i,whiteSpace:l?"nowrap":"normal",...n},id:y,children:r}):s==="p"?h.jsx("p",{className:a,style:{color:o,fontWeight:`var(--md-sys-typescale-body-${e}-weight)`,fontSize:`var(--md-sys-typescale-body-${e}-size)`,lineHeight:`var(--md-sys-typescale-body-${e}-line-height)`,fontFamily:`var(--md-sys-typescale-body-${e}-font)`,textAlign:i,whiteSpace:l?"nowrap":"normal",...n},id:y,children:r}):s==="span"?h.jsx("span",{className:a,style:{color:o,fontWeight:`var(--md-sys-typescale-body-${e}-weight)`,fontSize:`var(--md-sys-typescale-body-${e}-size)`,lineHeight:`var(--md-sys-typescale-body-${e}-line-height)`,fontFamily:`var(--md-sys-typescale-body-${e}-font)`,textAlign:i,whiteSpace:l?"nowrap":"normal",...n},id:y,children:r}):s==="label"?h.jsx("label",{htmlFor:f,className:a,style:{color:o,fontWeight:`var(--md-sys-typescale-label-${e}-weight)`,fontSize:`var(--md-sys-typescale-label-${e}-size)`,lineHeight:`var(--md-sys-typescale-label-${e}-line-height)`,fontFamily:`var(--md-sys-typescale-label-${e}-font)`,textAlign:i,whiteSpace:l?"nowrap":"normal",...n},id:y,children:r}):null};exports.Typography=p;
|
||||||
body {
|
|
||||||
|
|
||||||
--md-ref-typeface-brand: 'Roboto Flex';
|
|
||||||
--md-ref-typeface-plain: 'Roboto Flex';
|
|
||||||
|
|
||||||
--md-sys-color-primary: ${r.hexFromArgb(s.schemes[e].primary)};
|
|
||||||
--md-sys-color-primary-container: ${r.hexFromArgb(s.schemes[e].primaryContainer)};
|
|
||||||
--md-sys-color-secondary: ${r.hexFromArgb(s.schemes[e].secondary)};
|
|
||||||
--md-sys-color-secondary-container: ${r.hexFromArgb(s.schemes[e].secondaryContainer)};
|
|
||||||
--md-sys-color-tertiary: ${r.hexFromArgb(s.schemes[e].tertiary)};
|
|
||||||
--md-sys-color-tertiary-container: ${r.hexFromArgb(s.schemes[e].tertiaryContainer)};
|
|
||||||
--md-sys-color-error: ${r.hexFromArgb(s.schemes[e].error)};
|
|
||||||
--md-sys-color-error-container: ${r.hexFromArgb(s.schemes[e].errorContainer)};
|
|
||||||
--md-sys-color-background: ${r.hexFromArgb(s.schemes[e].background)};
|
|
||||||
--md-sys-color-surface: ${r.hexFromArgb(s.schemes[e].surface)};
|
|
||||||
--md-sys-color-surface-bright: ${r.hexFromArgb(s.schemes[e].surface)};
|
|
||||||
--md-sys-color-surface-dim: ${r.hexFromArgb(s.schemes[e].surface)};
|
|
||||||
--md-sys-color-surface-container: ${r.hexFromArgb(s.schemes[e].surface)};
|
|
||||||
--md-sys-color-surface-container-lowest: ${r.hexFromArgb(s.schemes[e].surface)};
|
|
||||||
--md-sys-color-surface-container-low: ${r.hexFromArgb(s.schemes[e].surfaceVariant)};
|
|
||||||
--md-sys-color-surface-container-high: ${r.hexFromArgb(s.schemes[e].surfaceVariant)};
|
|
||||||
--md-sys-color-surface-container-highest: ${r.hexFromArgb(s.schemes[e].surfaceVariant)};
|
|
||||||
--md-sys-color-outline: ${r.hexFromArgb(s.schemes[e].outline)};
|
|
||||||
--md-sys-color-outline-variant: ${r.hexFromArgb(s.schemes[e].outlineVariant)};
|
|
||||||
--md-sys-color-scrim: ${r.hexFromArgb(s.schemes[e].scrim)};
|
|
||||||
--md-sys-color-shadow: ${r.hexFromArgb(s.schemes[e].shadow)};
|
|
||||||
--md-sys-color-on-surface: ${r.hexFromArgb(s.schemes[e].onSurface)};
|
|
||||||
--md-sys-color-on-surface-variant: ${r.hexFromArgb(s.schemes[e].onSurfaceVariant)};
|
|
||||||
--md-sys-color-on-surface-bright: ${r.hexFromArgb(s.schemes[e].onSurface)};
|
|
||||||
--md-sys-color-on-surface-dim: ${r.hexFromArgb(s.schemes[e].onSurface)};
|
|
||||||
--md-sys-color-background: ${r.hexFromArgb(s.schemes[e].background)};
|
|
||||||
--md-sys-color-background-variant: ${r.hexFromArgb(s.schemes[e].surface)};
|
|
||||||
|
|
||||||
--md-sys-color-on-primary: ${r.hexFromArgb(s.schemes[e].onPrimary)};
|
|
||||||
--md-sys-color-on-primary-container: ${r.hexFromArgb(s.schemes[e].onPrimaryContainer)};
|
|
||||||
--md-sys-color-on-secondary: ${r.hexFromArgb(s.schemes[e].onSecondary)};
|
|
||||||
--md-sys-color-on-secondary-container: ${r.hexFromArgb(s.schemes[e].onSecondaryContainer)};
|
|
||||||
--md-sys-color-on-tertiary: ${r.hexFromArgb(s.schemes[e].onTertiary)};
|
|
||||||
--md-sys-color-on-tertiary-container: ${r.hexFromArgb(s.schemes[e].onTertiaryContainer)};
|
|
||||||
--md-sys-color-on-error: ${r.hexFromArgb(s.schemes[e].onError)};
|
|
||||||
--md-sys-color-on-error-container: ${r.hexFromArgb(s.schemes[e].onErrorContainer)};
|
|
||||||
--md-sys-color-on-background: ${r.hexFromArgb(s.schemes[e].onBackground)};
|
|
||||||
|
|
||||||
--md-sys-typescale-headline-small-font: 'Roboto Flex';
|
|
||||||
--md-sys-typescale-headline-medium-font: 'Roboto Flex';
|
|
||||||
--md-sys-typescale-headline-large-font: 'Roboto Flex';
|
|
||||||
|
|
||||||
--md-sys-typescale-headline-small-size: 24px;
|
|
||||||
--md-sys-typescale-headline-medium-size: 32px;
|
|
||||||
--md-sys-typescale-headline-large-size: 40px;
|
|
||||||
|
|
||||||
--md-sys-typescale-headline-small-weight: 400;
|
|
||||||
--md-sys-typescale-headline-medium-weight: 400;
|
|
||||||
--md-sys-typescale-headline-large-weight: 400;
|
|
||||||
|
|
||||||
--md-sys-typescale-headline-small-line-height: 32px;
|
|
||||||
--md-sys-typescale-headline-medium-line-height: 40px;
|
|
||||||
--md-sys-typescale-headline-large-line-height: 48px;
|
|
||||||
|
|
||||||
--md-sys-typescale-body-small-font: 'Roboto Flex';
|
|
||||||
--md-sys-typescale-body-medium-font: 'Roboto Flex';
|
|
||||||
--md-sys-typescale-body-large-font: 'Roboto Flex';
|
|
||||||
|
|
||||||
--md-sys-typescale-body-small-size: 12px;
|
|
||||||
--md-sys-typescale-body-medium-size: 14px;
|
|
||||||
--md-sys-typescale-body-large-size: 16px;
|
|
||||||
|
|
||||||
--md-sys-typescale-body-small-weight: 400;
|
|
||||||
--md-sys-typescale-body-medium-weight: 400;
|
|
||||||
--md-sys-typescale-body-large-weight: 400;
|
|
||||||
|
|
||||||
--md-sys-typescale-body-small-line-height: 16px;
|
|
||||||
--md-sys-typescale-body-medium-line-height: 20px;
|
|
||||||
--md-sys-typescale-body-large-line-height: 24px;
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
--md-sys-typescale-label-small-font: 'Roboto Flex';
|
|
||||||
--md-sys-typescale-label-medium-font: 'Roboto Flex';
|
|
||||||
--md-sys-typescale-label-large-font: 'Roboto Flex';
|
|
||||||
|
|
||||||
--md-sys-typescale-label-small-size: 12px;
|
|
||||||
--md-sys-typescale-label-medium-size: 14px;
|
|
||||||
--md-sys-typescale-label-large-size: 16px;
|
|
||||||
|
|
||||||
--md-sys-typescale-label-small-weight: 400;
|
|
||||||
--md-sys-typescale-label-medium-weight: 400;
|
|
||||||
--md-sys-typescale-label-large-weight: 400;
|
|
||||||
|
|
||||||
--md-sys-typescale-label-small-line-height: 16px;
|
|
||||||
--md-sys-typescale-label-medium-line-height: 20px;
|
|
||||||
--md-sys-typescale-label-large-line-height: 24px;
|
|
||||||
|
|
||||||
background-color: var(--md-sys-color-background);
|
|
||||||
color: var(--md-sys-color-on-background);
|
|
||||||
}
|
|
||||||
`}),o]})}function c(){const o=l.useContext(n);if(o===void 0)throw new Error("useTheme must be used within a ThemeProvider");return o}function i(){const o=c(),s=y.useScheme();return o.schemes[s]}exports.ThemeProvider=d;exports.usePalette=i;exports.useTheme=c;
|
|
||||||
|
|
|
||||||
|
|
@ -1,124 +1,180 @@
|
||||||
import { jsxs as l, jsx as n } from "react/jsx-runtime";
|
import { jsx as h } from "react/jsx-runtime";
|
||||||
import { h as e } from "./string_utils-B4bsIQ5w.mjs";
|
import { useMemo as d } from "react";
|
||||||
import { createContext as c, useContext as y } from "react";
|
|
||||||
import { useScheme as d } from "./react-you-ui4.mjs";
|
|
||||||
/* empty css */
|
/* empty css */
|
||||||
const a = c(void 0);
|
const v = ({ children: s, variant: r = "span", className: a, color: t = "", align: i, style: n, noWrap: l, id: y, size: m = "auto", htmlFor: f }) => {
|
||||||
function f({ children: r, theme: s, scheme: o }) {
|
const o = d(() => t === "primary" ? "var(--md-sys-color-primary)" : t === "secondary" ? "var(--md-sys-color-secondary)" : t === "tertiary" ? "var(--md-sys-color-tertiary)" : t === "error" ? "var(--md-sys-color-error)" : t === "on-primary" ? "var(--md-sys-color-on-primary)" : t === "on-secondary" ? "var(--md-sys-color-on-secondary)" : t === "on-tertiary" ? "var(--md-sys-color-on-tertiary)" : t === "on-error" ? "var(--md-sys-color-on-error)" : t === "on-surface" ? "var(--md-sys-color-on-surface)" : t === "scrim" ? "var(--md-sys-color-scrim)" : t === "outline" ? "var(--md-sys-color-outline)" : t === "outline-variant" ? "var(--md-sys-color-outline-variant)" : t, [t]), e = d(() => {
|
||||||
return /* @__PURE__ */ l(a.Provider, { value: s, children: [
|
if (m === "auto")
|
||||||
/* @__PURE__ */ n("style", { children: `
|
return {
|
||||||
body {
|
h1: "large",
|
||||||
|
h2: "large",
|
||||||
--md-ref-typeface-brand: 'Roboto Flex';
|
h3: "medium",
|
||||||
--md-ref-typeface-plain: 'Roboto Flex';
|
h4: "medium",
|
||||||
|
h5: "small",
|
||||||
--md-sys-color-primary: ${e(s.schemes[o].primary)};
|
h6: "small",
|
||||||
--md-sys-color-primary-container: ${e(s.schemes[o].primaryContainer)};
|
p: "large",
|
||||||
--md-sys-color-secondary: ${e(s.schemes[o].secondary)};
|
span: "large",
|
||||||
--md-sys-color-secondary-container: ${e(s.schemes[o].secondaryContainer)};
|
label: "large"
|
||||||
--md-sys-color-tertiary: ${e(s.schemes[o].tertiary)};
|
}[r];
|
||||||
--md-sys-color-tertiary-container: ${e(s.schemes[o].tertiaryContainer)};
|
if (m === "small") return "small";
|
||||||
--md-sys-color-error: ${e(s.schemes[o].error)};
|
if (m === "medium") return "medium";
|
||||||
--md-sys-color-error-container: ${e(s.schemes[o].errorContainer)};
|
if (m === "large") return "large";
|
||||||
--md-sys-color-background: ${e(s.schemes[o].background)};
|
}, [m]);
|
||||||
--md-sys-color-surface: ${e(s.schemes[o].surface)};
|
return r === "h1" ? /* @__PURE__ */ h(
|
||||||
--md-sys-color-surface-bright: ${e(s.schemes[o].surface)};
|
"h1",
|
||||||
--md-sys-color-surface-dim: ${e(s.schemes[o].surface)};
|
{
|
||||||
--md-sys-color-surface-container: ${e(s.schemes[o].surface)};
|
className: a,
|
||||||
--md-sys-color-surface-container-lowest: ${e(s.schemes[o].surface)};
|
style: {
|
||||||
--md-sys-color-surface-container-low: ${e(s.schemes[o].surfaceVariant)};
|
color: o,
|
||||||
--md-sys-color-surface-container-high: ${e(s.schemes[o].surfaceVariant)};
|
fontWeight: `var(--md-sys-typescale-headline-${e}-weight)`,
|
||||||
--md-sys-color-surface-container-highest: ${e(s.schemes[o].surfaceVariant)};
|
fontSize: `var(--md-sys-typescale-headline-${e}-size)`,
|
||||||
--md-sys-color-outline: ${e(s.schemes[o].outline)};
|
lineHeight: `var(--md-sys-typescale-headline-${e}-line-height)`,
|
||||||
--md-sys-color-outline-variant: ${e(s.schemes[o].outlineVariant)};
|
fontFamily: `var(--md-sys-typescale-headline-${e}-font)`,
|
||||||
--md-sys-color-scrim: ${e(s.schemes[o].scrim)};
|
textAlign: i,
|
||||||
--md-sys-color-shadow: ${e(s.schemes[o].shadow)};
|
whiteSpace: l ? "nowrap" : "normal",
|
||||||
--md-sys-color-on-surface: ${e(s.schemes[o].onSurface)};
|
...n
|
||||||
--md-sys-color-on-surface-variant: ${e(s.schemes[o].onSurfaceVariant)};
|
},
|
||||||
--md-sys-color-on-surface-bright: ${e(s.schemes[o].onSurface)};
|
id: y,
|
||||||
--md-sys-color-on-surface-dim: ${e(s.schemes[o].onSurface)};
|
children: s
|
||||||
--md-sys-color-background: ${e(s.schemes[o].background)};
|
}
|
||||||
--md-sys-color-background-variant: ${e(s.schemes[o].surface)};
|
) : r === "h2" ? /* @__PURE__ */ h(
|
||||||
|
"h2",
|
||||||
--md-sys-color-on-primary: ${e(s.schemes[o].onPrimary)};
|
{
|
||||||
--md-sys-color-on-primary-container: ${e(s.schemes[o].onPrimaryContainer)};
|
className: a,
|
||||||
--md-sys-color-on-secondary: ${e(s.schemes[o].onSecondary)};
|
style: {
|
||||||
--md-sys-color-on-secondary-container: ${e(s.schemes[o].onSecondaryContainer)};
|
color: o,
|
||||||
--md-sys-color-on-tertiary: ${e(s.schemes[o].onTertiary)};
|
fontWeight: `var(--md-sys-typescale-headline-${e}-weight)`,
|
||||||
--md-sys-color-on-tertiary-container: ${e(s.schemes[o].onTertiaryContainer)};
|
fontSize: `var(--md-sys-typescale-headline-${e}-size)`,
|
||||||
--md-sys-color-on-error: ${e(s.schemes[o].onError)};
|
lineHeight: `var(--md-sys-typescale-headline-${e}-line-height)`,
|
||||||
--md-sys-color-on-error-container: ${e(s.schemes[o].onErrorContainer)};
|
fontFamily: `var(--md-sys-typescale-headline-${e}-font)`,
|
||||||
--md-sys-color-on-background: ${e(s.schemes[o].onBackground)};
|
textAlign: i,
|
||||||
|
whiteSpace: l ? "nowrap" : "normal",
|
||||||
--md-sys-typescale-headline-small-font: 'Roboto Flex';
|
...n
|
||||||
--md-sys-typescale-headline-medium-font: 'Roboto Flex';
|
},
|
||||||
--md-sys-typescale-headline-large-font: 'Roboto Flex';
|
id: y,
|
||||||
|
children: s
|
||||||
--md-sys-typescale-headline-small-size: 24px;
|
}
|
||||||
--md-sys-typescale-headline-medium-size: 32px;
|
) : r === "h3" ? /* @__PURE__ */ h(
|
||||||
--md-sys-typescale-headline-large-size: 40px;
|
"h3",
|
||||||
|
{
|
||||||
--md-sys-typescale-headline-small-weight: 400;
|
className: a,
|
||||||
--md-sys-typescale-headline-medium-weight: 400;
|
style: {
|
||||||
--md-sys-typescale-headline-large-weight: 400;
|
color: o,
|
||||||
|
fontWeight: `var(--md-sys-typescale-headline-${e}-weight)`,
|
||||||
--md-sys-typescale-headline-small-line-height: 32px;
|
fontSize: `var(--md-sys-typescale-headline-${e}-size)`,
|
||||||
--md-sys-typescale-headline-medium-line-height: 40px;
|
lineHeight: `var(--md-sys-typescale-headline-${e}-line-height)`,
|
||||||
--md-sys-typescale-headline-large-line-height: 48px;
|
fontFamily: `var(--md-sys-typescale-headline-${e}-font)`,
|
||||||
|
textAlign: i,
|
||||||
--md-sys-typescale-body-small-font: 'Roboto Flex';
|
whiteSpace: l ? "nowrap" : "normal",
|
||||||
--md-sys-typescale-body-medium-font: 'Roboto Flex';
|
...n
|
||||||
--md-sys-typescale-body-large-font: 'Roboto Flex';
|
},
|
||||||
|
id: y,
|
||||||
--md-sys-typescale-body-small-size: 12px;
|
children: s
|
||||||
--md-sys-typescale-body-medium-size: 14px;
|
}
|
||||||
--md-sys-typescale-body-large-size: 16px;
|
) : r === "h4" ? /* @__PURE__ */ h(
|
||||||
|
"h4",
|
||||||
--md-sys-typescale-body-small-weight: 400;
|
{
|
||||||
--md-sys-typescale-body-medium-weight: 400;
|
className: a,
|
||||||
--md-sys-typescale-body-large-weight: 400;
|
style: {
|
||||||
|
color: o,
|
||||||
--md-sys-typescale-body-small-line-height: 16px;
|
fontWeight: `var(--md-sys-typescale-headline-${e}-weight)`,
|
||||||
--md-sys-typescale-body-medium-line-height: 20px;
|
fontSize: `var(--md-sys-typescale-headline-${e}-size)`,
|
||||||
--md-sys-typescale-body-large-line-height: 24px;
|
lineHeight: `var(--md-sys-typescale-headline-${e}-line-height)`,
|
||||||
|
fontFamily: `var(--md-sys-typescale-headline-${e}-font)`,
|
||||||
|
textAlign: i,
|
||||||
|
whiteSpace: l ? "nowrap" : "normal",
|
||||||
--md-sys-typescale-label-small-font: 'Roboto Flex';
|
...n
|
||||||
--md-sys-typescale-label-medium-font: 'Roboto Flex';
|
},
|
||||||
--md-sys-typescale-label-large-font: 'Roboto Flex';
|
id: y,
|
||||||
|
children: s
|
||||||
--md-sys-typescale-label-small-size: 12px;
|
}
|
||||||
--md-sys-typescale-label-medium-size: 14px;
|
) : r === "h5" ? /* @__PURE__ */ h(
|
||||||
--md-sys-typescale-label-large-size: 16px;
|
"h5",
|
||||||
|
{
|
||||||
--md-sys-typescale-label-small-weight: 400;
|
className: a,
|
||||||
--md-sys-typescale-label-medium-weight: 400;
|
style: {
|
||||||
--md-sys-typescale-label-large-weight: 400;
|
color: o,
|
||||||
|
fontWeight: `var(--md-sys-typescale-headline-${e}-weight)`,
|
||||||
--md-sys-typescale-label-small-line-height: 16px;
|
fontSize: `var(--md-sys-typescale-headline-${e}-size)`,
|
||||||
--md-sys-typescale-label-medium-line-height: 20px;
|
lineHeight: `var(--md-sys-typescale-headline-${e}-line-height)`,
|
||||||
--md-sys-typescale-label-large-line-height: 24px;
|
fontFamily: `var(--md-sys-typescale-headline-${e}-font)`,
|
||||||
|
textAlign: i,
|
||||||
background-color: var(--md-sys-color-background);
|
whiteSpace: l ? "nowrap" : "normal",
|
||||||
color: var(--md-sys-color-on-background);
|
...n
|
||||||
}
|
},
|
||||||
` }),
|
id: y,
|
||||||
r
|
children: s
|
||||||
] });
|
}
|
||||||
}
|
) : r === "h6" ? /* @__PURE__ */ h(
|
||||||
function i() {
|
"h6",
|
||||||
const r = y(a);
|
{
|
||||||
if (r === void 0)
|
className: a,
|
||||||
throw new Error("useTheme must be used within a ThemeProvider");
|
style: {
|
||||||
return r;
|
color: o,
|
||||||
}
|
fontWeight: `var(--md-sys-typescale-headline-${e}-weight)`,
|
||||||
function g() {
|
fontSize: `var(--md-sys-typescale-headline-${e}-size)`,
|
||||||
const r = i(), s = d();
|
lineHeight: `var(--md-sys-typescale-headline-${e}-line-height)`,
|
||||||
return r.schemes[s];
|
fontFamily: `var(--md-sys-typescale-headline-${e}-font)`,
|
||||||
}
|
textAlign: i,
|
||||||
export {
|
whiteSpace: l ? "nowrap" : "normal",
|
||||||
f as ThemeProvider,
|
...n
|
||||||
g as usePalette,
|
},
|
||||||
i as useTheme
|
id: y,
|
||||||
|
children: s
|
||||||
|
}
|
||||||
|
) : r === "p" ? /* @__PURE__ */ h(
|
||||||
|
"p",
|
||||||
|
{
|
||||||
|
className: a,
|
||||||
|
style: {
|
||||||
|
color: o,
|
||||||
|
fontWeight: `var(--md-sys-typescale-body-${e}-weight)`,
|
||||||
|
fontSize: `var(--md-sys-typescale-body-${e}-size)`,
|
||||||
|
lineHeight: `var(--md-sys-typescale-body-${e}-line-height)`,
|
||||||
|
fontFamily: `var(--md-sys-typescale-body-${e}-font)`,
|
||||||
|
textAlign: i,
|
||||||
|
whiteSpace: l ? "nowrap" : "normal",
|
||||||
|
...n
|
||||||
|
},
|
||||||
|
id: y,
|
||||||
|
children: s
|
||||||
|
}
|
||||||
|
) : r === "span" ? /* @__PURE__ */ h(
|
||||||
|
"span",
|
||||||
|
{
|
||||||
|
className: a,
|
||||||
|
style: {
|
||||||
|
color: o,
|
||||||
|
fontWeight: `var(--md-sys-typescale-body-${e}-weight)`,
|
||||||
|
fontSize: `var(--md-sys-typescale-body-${e}-size)`,
|
||||||
|
lineHeight: `var(--md-sys-typescale-body-${e}-line-height)`,
|
||||||
|
fontFamily: `var(--md-sys-typescale-body-${e}-font)`,
|
||||||
|
textAlign: i,
|
||||||
|
whiteSpace: l ? "nowrap" : "normal",
|
||||||
|
...n
|
||||||
|
},
|
||||||
|
id: y,
|
||||||
|
children: s
|
||||||
|
}
|
||||||
|
) : r === "label" ? /* @__PURE__ */ h(
|
||||||
|
"label",
|
||||||
|
{
|
||||||
|
htmlFor: f,
|
||||||
|
className: a,
|
||||||
|
style: {
|
||||||
|
color: o,
|
||||||
|
fontWeight: `var(--md-sys-typescale-label-${e}-weight)`,
|
||||||
|
fontSize: `var(--md-sys-typescale-label-${e}-size)`,
|
||||||
|
lineHeight: `var(--md-sys-typescale-label-${e}-line-height)`,
|
||||||
|
fontFamily: `var(--md-sys-typescale-label-${e}-font)`,
|
||||||
|
textAlign: i,
|
||||||
|
whiteSpace: l ? "nowrap" : "normal",
|
||||||
|
...n
|
||||||
|
},
|
||||||
|
id: y,
|
||||||
|
children: s
|
||||||
|
}
|
||||||
|
) : null;
|
||||||
|
};
|
||||||
|
export {
|
||||||
|
v as Typography
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -1 +1 @@
|
||||||
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),t=require("react"),r=t.createContext("light");function o({children:e,scheme:c}){return n.jsx(r.Provider,{value:c,children:e})}function u(){return t.useContext(r)}exports.SchemeProvider=o;exports.useScheme=u;
|
"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;
|
||||||
|
|
|
||||||
|
|
@ -1,13 +1,20 @@
|
||||||
import { jsx as r } from "react/jsx-runtime";
|
import { jsx as a } from "react/jsx-runtime";
|
||||||
import { createContext as n, useContext as c } from "react";
|
import { Box as c } from "./react-you-ui26.mjs";
|
||||||
const t = n("light");
|
const l = ({ children: s, style: o, ...r }) => (console.log(r, o), /* @__PURE__ */ a(
|
||||||
function s({ children: e, scheme: o }) {
|
c,
|
||||||
return /* @__PURE__ */ r(t.Provider, { value: o, children: e });
|
{
|
||||||
}
|
...r,
|
||||||
function u() {
|
style: {
|
||||||
return c(t);
|
borderRadius: "28px",
|
||||||
}
|
backgroundColor: "var(--md-sys-color-surface)",
|
||||||
|
color: "var(--md-sys-color-on-surface)",
|
||||||
|
padding: "18px",
|
||||||
|
display: "flex",
|
||||||
|
...o
|
||||||
|
},
|
||||||
|
children: s
|
||||||
|
}
|
||||||
|
));
|
||||||
export {
|
export {
|
||||||
s as SchemeProvider,
|
l as Paper
|
||||||
u as useScheme
|
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -1 +1 @@
|
||||||
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const h=require("react/jsx-runtime"),d=require("react");;/* empty css */const p=({children:r,variant:s="span",className:a,color:t="",align:i,style:n,noWrap:l,id:y,size:m="auto",htmlFor:f})=>{const o=d.useMemo(()=>t==="primary"?"var(--md-sys-color-primary)":t==="secondary"?"var(--md-sys-color-secondary)":t==="tertiary"?"var(--md-sys-color-tertiary)":t==="error"?"var(--md-sys-color-error)":t==="on-primary"?"var(--md-sys-color-on-primary)":t==="on-secondary"?"var(--md-sys-color-on-secondary)":t==="on-tertiary"?"var(--md-sys-color-on-tertiary)":t==="on-error"?"var(--md-sys-color-on-error)":t==="on-surface"?"var(--md-sys-color-on-surface)":t==="scrim"?"var(--md-sys-color-scrim)":t==="outline"?"var(--md-sys-color-outline)":t==="outline-variant"?"var(--md-sys-color-outline-variant)":t,[t]),e=d.useMemo(()=>{if(m==="auto")return{h1:"large",h2:"large",h3:"medium",h4:"medium",h5:"small",h6:"small",p:"large",span:"large",label:"large"}[s];if(m==="small")return"small";if(m==="medium")return"medium";if(m==="large")return"large"},[m]);return s==="h1"?h.jsx("h1",{className:a,style:{color:o,fontWeight:`var(--md-sys-typescale-headline-${e}-weight)`,fontSize:`var(--md-sys-typescale-headline-${e}-size)`,lineHeight:`var(--md-sys-typescale-headline-${e}-line-height)`,fontFamily:`var(--md-sys-typescale-headline-${e}-font)`,textAlign:i,whiteSpace:l?"nowrap":"normal",...n},id:y,children:r}):s==="h2"?h.jsx("h2",{className:a,style:{color:o,fontWeight:`var(--md-sys-typescale-headline-${e}-weight)`,fontSize:`var(--md-sys-typescale-headline-${e}-size)`,lineHeight:`var(--md-sys-typescale-headline-${e}-line-height)`,fontFamily:`var(--md-sys-typescale-headline-${e}-font)`,textAlign:i,whiteSpace:l?"nowrap":"normal",...n},id:y,children:r}):s==="h3"?h.jsx("h3",{className:a,style:{color:o,fontWeight:`var(--md-sys-typescale-headline-${e}-weight)`,fontSize:`var(--md-sys-typescale-headline-${e}-size)`,lineHeight:`var(--md-sys-typescale-headline-${e}-line-height)`,fontFamily:`var(--md-sys-typescale-headline-${e}-font)`,textAlign:i,whiteSpace:l?"nowrap":"normal",...n},id:y,children:r}):s==="h4"?h.jsx("h4",{className:a,style:{color:o,fontWeight:`var(--md-sys-typescale-headline-${e}-weight)`,fontSize:`var(--md-sys-typescale-headline-${e}-size)`,lineHeight:`var(--md-sys-typescale-headline-${e}-line-height)`,fontFamily:`var(--md-sys-typescale-headline-${e}-font)`,textAlign:i,whiteSpace:l?"nowrap":"normal",...n},id:y,children:r}):s==="h5"?h.jsx("h5",{className:a,style:{color:o,fontWeight:`var(--md-sys-typescale-headline-${e}-weight)`,fontSize:`var(--md-sys-typescale-headline-${e}-size)`,lineHeight:`var(--md-sys-typescale-headline-${e}-line-height)`,fontFamily:`var(--md-sys-typescale-headline-${e}-font)`,textAlign:i,whiteSpace:l?"nowrap":"normal",...n},id:y,children:r}):s==="h6"?h.jsx("h6",{className:a,style:{color:o,fontWeight:`var(--md-sys-typescale-headline-${e}-weight)`,fontSize:`var(--md-sys-typescale-headline-${e}-size)`,lineHeight:`var(--md-sys-typescale-headline-${e}-line-height)`,fontFamily:`var(--md-sys-typescale-headline-${e}-font)`,textAlign:i,whiteSpace:l?"nowrap":"normal",...n},id:y,children:r}):s==="p"?h.jsx("p",{className:a,style:{color:o,fontWeight:`var(--md-sys-typescale-body-${e}-weight)`,fontSize:`var(--md-sys-typescale-body-${e}-size)`,lineHeight:`var(--md-sys-typescale-body-${e}-line-height)`,fontFamily:`var(--md-sys-typescale-body-${e}-font)`,textAlign:i,whiteSpace:l?"nowrap":"normal",...n},id:y,children:r}):s==="span"?h.jsx("span",{className:a,style:{color:o,fontWeight:`var(--md-sys-typescale-body-${e}-weight)`,fontSize:`var(--md-sys-typescale-body-${e}-size)`,lineHeight:`var(--md-sys-typescale-body-${e}-line-height)`,fontFamily:`var(--md-sys-typescale-body-${e}-font)`,textAlign:i,whiteSpace:l?"nowrap":"normal",...n},id:y,children:r}):s==="label"?h.jsx("label",{htmlFor:f,className:a,style:{color:o,fontWeight:`var(--md-sys-typescale-label-${e}-weight)`,fontSize:`var(--md-sys-typescale-label-${e}-size)`,lineHeight:`var(--md-sys-typescale-label-${e}-line-height)`,fontFamily:`var(--md-sys-typescale-label-${e}-font)`,textAlign:i,whiteSpace:l?"nowrap":"normal",...n},id:y,children:r}):null};exports.Typography=p;
|
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),m=require("./react-you-ui6.js"),g=require("./string_utils-Bad7L8P5.js"),h=e=>{const t=m.usePalette(),{href:r,target:s,rel:o,children:n,className:i,id:c,style:l,...u}=e;return a.jsx("a",{href:r,target:s,rel:o,className:i,id:c,style:{color:g.hexFromArgb(t.primary),textDecoration:"none",...l},...u,children:n})};exports.Link=h;
|
||||||
|
|
|
||||||
|
|
@ -1,180 +1,26 @@
|
||||||
import { jsx as h } from "react/jsx-runtime";
|
import { jsx as c } from "react/jsx-runtime";
|
||||||
import { useMemo as d } from "react";
|
import { usePalette as p } from "./react-you-ui6.mjs";
|
||||||
/* empty css */
|
import { h as f } from "./string_utils-B4bsIQ5w.mjs";
|
||||||
const v = ({ children: s, variant: r = "span", className: a, color: t = "", align: i, style: n, noWrap: l, id: y, size: m = "auto", htmlFor: f }) => {
|
const d = (r) => {
|
||||||
const o = d(() => t === "primary" ? "var(--md-sys-color-primary)" : t === "secondary" ? "var(--md-sys-color-secondary)" : t === "tertiary" ? "var(--md-sys-color-tertiary)" : t === "error" ? "var(--md-sys-color-error)" : t === "on-primary" ? "var(--md-sys-color-on-primary)" : t === "on-secondary" ? "var(--md-sys-color-on-secondary)" : t === "on-tertiary" ? "var(--md-sys-color-on-tertiary)" : t === "on-error" ? "var(--md-sys-color-on-error)" : t === "on-surface" ? "var(--md-sys-color-on-surface)" : t === "scrim" ? "var(--md-sys-color-scrim)" : t === "outline" ? "var(--md-sys-color-outline)" : t === "outline-variant" ? "var(--md-sys-color-outline-variant)" : t, [t]), e = d(() => {
|
const t = p(), { href: e, target: o, rel: s, children: a, className: m, id: n, style: i, ...l } = r;
|
||||||
if (m === "auto")
|
return /* @__PURE__ */ c(
|
||||||
return {
|
"a",
|
||||||
h1: "large",
|
|
||||||
h2: "large",
|
|
||||||
h3: "medium",
|
|
||||||
h4: "medium",
|
|
||||||
h5: "small",
|
|
||||||
h6: "small",
|
|
||||||
p: "large",
|
|
||||||
span: "large",
|
|
||||||
label: "large"
|
|
||||||
}[r];
|
|
||||||
if (m === "small") return "small";
|
|
||||||
if (m === "medium") return "medium";
|
|
||||||
if (m === "large") return "large";
|
|
||||||
}, [m]);
|
|
||||||
return r === "h1" ? /* @__PURE__ */ h(
|
|
||||||
"h1",
|
|
||||||
{
|
{
|
||||||
className: a,
|
href: e,
|
||||||
|
target: o,
|
||||||
|
rel: s,
|
||||||
|
className: m,
|
||||||
|
id: n,
|
||||||
style: {
|
style: {
|
||||||
color: o,
|
color: f(t.primary),
|
||||||
fontWeight: `var(--md-sys-typescale-headline-${e}-weight)`,
|
textDecoration: "none",
|
||||||
fontSize: `var(--md-sys-typescale-headline-${e}-size)`,
|
...i
|
||||||
lineHeight: `var(--md-sys-typescale-headline-${e}-line-height)`,
|
|
||||||
fontFamily: `var(--md-sys-typescale-headline-${e}-font)`,
|
|
||||||
textAlign: i,
|
|
||||||
whiteSpace: l ? "nowrap" : "normal",
|
|
||||||
...n
|
|
||||||
},
|
},
|
||||||
id: y,
|
...l,
|
||||||
children: s
|
children: a
|
||||||
}
|
}
|
||||||
) : r === "h2" ? /* @__PURE__ */ h(
|
);
|
||||||
"h2",
|
|
||||||
{
|
|
||||||
className: a,
|
|
||||||
style: {
|
|
||||||
color: o,
|
|
||||||
fontWeight: `var(--md-sys-typescale-headline-${e}-weight)`,
|
|
||||||
fontSize: `var(--md-sys-typescale-headline-${e}-size)`,
|
|
||||||
lineHeight: `var(--md-sys-typescale-headline-${e}-line-height)`,
|
|
||||||
fontFamily: `var(--md-sys-typescale-headline-${e}-font)`,
|
|
||||||
textAlign: i,
|
|
||||||
whiteSpace: l ? "nowrap" : "normal",
|
|
||||||
...n
|
|
||||||
},
|
|
||||||
id: y,
|
|
||||||
children: s
|
|
||||||
}
|
|
||||||
) : r === "h3" ? /* @__PURE__ */ h(
|
|
||||||
"h3",
|
|
||||||
{
|
|
||||||
className: a,
|
|
||||||
style: {
|
|
||||||
color: o,
|
|
||||||
fontWeight: `var(--md-sys-typescale-headline-${e}-weight)`,
|
|
||||||
fontSize: `var(--md-sys-typescale-headline-${e}-size)`,
|
|
||||||
lineHeight: `var(--md-sys-typescale-headline-${e}-line-height)`,
|
|
||||||
fontFamily: `var(--md-sys-typescale-headline-${e}-font)`,
|
|
||||||
textAlign: i,
|
|
||||||
whiteSpace: l ? "nowrap" : "normal",
|
|
||||||
...n
|
|
||||||
},
|
|
||||||
id: y,
|
|
||||||
children: s
|
|
||||||
}
|
|
||||||
) : r === "h4" ? /* @__PURE__ */ h(
|
|
||||||
"h4",
|
|
||||||
{
|
|
||||||
className: a,
|
|
||||||
style: {
|
|
||||||
color: o,
|
|
||||||
fontWeight: `var(--md-sys-typescale-headline-${e}-weight)`,
|
|
||||||
fontSize: `var(--md-sys-typescale-headline-${e}-size)`,
|
|
||||||
lineHeight: `var(--md-sys-typescale-headline-${e}-line-height)`,
|
|
||||||
fontFamily: `var(--md-sys-typescale-headline-${e}-font)`,
|
|
||||||
textAlign: i,
|
|
||||||
whiteSpace: l ? "nowrap" : "normal",
|
|
||||||
...n
|
|
||||||
},
|
|
||||||
id: y,
|
|
||||||
children: s
|
|
||||||
}
|
|
||||||
) : r === "h5" ? /* @__PURE__ */ h(
|
|
||||||
"h5",
|
|
||||||
{
|
|
||||||
className: a,
|
|
||||||
style: {
|
|
||||||
color: o,
|
|
||||||
fontWeight: `var(--md-sys-typescale-headline-${e}-weight)`,
|
|
||||||
fontSize: `var(--md-sys-typescale-headline-${e}-size)`,
|
|
||||||
lineHeight: `var(--md-sys-typescale-headline-${e}-line-height)`,
|
|
||||||
fontFamily: `var(--md-sys-typescale-headline-${e}-font)`,
|
|
||||||
textAlign: i,
|
|
||||||
whiteSpace: l ? "nowrap" : "normal",
|
|
||||||
...n
|
|
||||||
},
|
|
||||||
id: y,
|
|
||||||
children: s
|
|
||||||
}
|
|
||||||
) : r === "h6" ? /* @__PURE__ */ h(
|
|
||||||
"h6",
|
|
||||||
{
|
|
||||||
className: a,
|
|
||||||
style: {
|
|
||||||
color: o,
|
|
||||||
fontWeight: `var(--md-sys-typescale-headline-${e}-weight)`,
|
|
||||||
fontSize: `var(--md-sys-typescale-headline-${e}-size)`,
|
|
||||||
lineHeight: `var(--md-sys-typescale-headline-${e}-line-height)`,
|
|
||||||
fontFamily: `var(--md-sys-typescale-headline-${e}-font)`,
|
|
||||||
textAlign: i,
|
|
||||||
whiteSpace: l ? "nowrap" : "normal",
|
|
||||||
...n
|
|
||||||
},
|
|
||||||
id: y,
|
|
||||||
children: s
|
|
||||||
}
|
|
||||||
) : r === "p" ? /* @__PURE__ */ h(
|
|
||||||
"p",
|
|
||||||
{
|
|
||||||
className: a,
|
|
||||||
style: {
|
|
||||||
color: o,
|
|
||||||
fontWeight: `var(--md-sys-typescale-body-${e}-weight)`,
|
|
||||||
fontSize: `var(--md-sys-typescale-body-${e}-size)`,
|
|
||||||
lineHeight: `var(--md-sys-typescale-body-${e}-line-height)`,
|
|
||||||
fontFamily: `var(--md-sys-typescale-body-${e}-font)`,
|
|
||||||
textAlign: i,
|
|
||||||
whiteSpace: l ? "nowrap" : "normal",
|
|
||||||
...n
|
|
||||||
},
|
|
||||||
id: y,
|
|
||||||
children: s
|
|
||||||
}
|
|
||||||
) : r === "span" ? /* @__PURE__ */ h(
|
|
||||||
"span",
|
|
||||||
{
|
|
||||||
className: a,
|
|
||||||
style: {
|
|
||||||
color: o,
|
|
||||||
fontWeight: `var(--md-sys-typescale-body-${e}-weight)`,
|
|
||||||
fontSize: `var(--md-sys-typescale-body-${e}-size)`,
|
|
||||||
lineHeight: `var(--md-sys-typescale-body-${e}-line-height)`,
|
|
||||||
fontFamily: `var(--md-sys-typescale-body-${e}-font)`,
|
|
||||||
textAlign: i,
|
|
||||||
whiteSpace: l ? "nowrap" : "normal",
|
|
||||||
...n
|
|
||||||
},
|
|
||||||
id: y,
|
|
||||||
children: s
|
|
||||||
}
|
|
||||||
) : r === "label" ? /* @__PURE__ */ h(
|
|
||||||
"label",
|
|
||||||
{
|
|
||||||
htmlFor: f,
|
|
||||||
className: a,
|
|
||||||
style: {
|
|
||||||
color: o,
|
|
||||||
fontWeight: `var(--md-sys-typescale-label-${e}-weight)`,
|
|
||||||
fontSize: `var(--md-sys-typescale-label-${e}-size)`,
|
|
||||||
lineHeight: `var(--md-sys-typescale-label-${e}-line-height)`,
|
|
||||||
fontFamily: `var(--md-sys-typescale-label-${e}-font)`,
|
|
||||||
textAlign: i,
|
|
||||||
whiteSpace: l ? "nowrap" : "normal",
|
|
||||||
...n
|
|
||||||
},
|
|
||||||
id: y,
|
|
||||||
children: s
|
|
||||||
}
|
|
||||||
) : null;
|
|
||||||
};
|
};
|
||||||
export {
|
export {
|
||||||
v as Typography
|
d as Link
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -1 +1,99 @@
|
||||||
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),c=require("./react-you-ui25.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 a=require("react/jsx-runtime"),e=require("./string_utils-Bad7L8P5.js"),l=require("react"),y=require("./react-you-ui7.js");;/* empty css */const c=l.createContext(void 0);function d({children:o,theme:s,scheme:r}){return a.jsxs(c.Provider,{value:s,children:[a.jsx("style",{children:`
|
||||||
|
body {
|
||||||
|
|
||||||
|
--md-ref-typeface-brand: 'Roboto Flex';
|
||||||
|
--md-ref-typeface-plain: 'Roboto Flex';
|
||||||
|
|
||||||
|
--md-sys-color-primary: ${e.hexFromArgb(s.schemes[r].primary)};
|
||||||
|
--md-sys-color-primary-container: ${e.hexFromArgb(s.schemes[r].primaryContainer)};
|
||||||
|
--md-sys-color-secondary: ${e.hexFromArgb(s.schemes[r].secondary)};
|
||||||
|
--md-sys-color-secondary-container: ${e.hexFromArgb(s.schemes[r].secondaryContainer)};
|
||||||
|
--md-sys-color-tertiary: ${e.hexFromArgb(s.schemes[r].tertiary)};
|
||||||
|
--md-sys-color-tertiary-container: ${e.hexFromArgb(s.schemes[r].tertiaryContainer)};
|
||||||
|
--md-sys-color-error: ${e.hexFromArgb(s.schemes[r].error)};
|
||||||
|
--md-sys-color-error-container: ${e.hexFromArgb(s.schemes[r].errorContainer)};
|
||||||
|
--md-sys-color-background: ${e.hexFromArgb(s.schemes[r].background)};
|
||||||
|
--md-sys-color-surface: ${e.hexFromArgb(s.schemes[r].surface)};
|
||||||
|
--md-sys-color-surface-variant: ${e.hexFromArgb(s.schemes[r].surfaceVariant)};
|
||||||
|
--md-sys-color-surface-bright: ${e.hexFromArgb(s.schemes[r].surface)};
|
||||||
|
--md-sys-color-surface-dim: ${e.hexFromArgb(s.schemes[r].surface)};
|
||||||
|
--md-sys-color-surface-container: ${e.hexFromArgb(s.schemes[r].surface)};
|
||||||
|
--md-sys-color-surface-container-lowest: ${e.hexFromArgb(s.schemes[r].surface)};
|
||||||
|
--md-sys-color-surface-container-low: ${e.hexFromArgb(s.schemes[r].surfaceVariant)};
|
||||||
|
--md-sys-color-surface-container-high: ${e.hexFromArgb(s.schemes[r].surfaceVariant)};
|
||||||
|
--md-sys-color-surface-container-highest: ${e.hexFromArgb(s.schemes[r].surfaceVariant)};
|
||||||
|
--md-sys-color-outline: ${e.hexFromArgb(s.schemes[r].outline)};
|
||||||
|
--md-sys-color-outline-variant: ${e.hexFromArgb(s.schemes[r].outlineVariant)};
|
||||||
|
--md-sys-color-scrim: ${e.hexFromArgb(s.schemes[r].scrim)};
|
||||||
|
--md-sys-color-shadow: ${e.hexFromArgb(s.schemes[r].shadow)};
|
||||||
|
--md-sys-color-on-surface: ${e.hexFromArgb(s.schemes[r].onSurface)};
|
||||||
|
--md-sys-color-on-surface-variant: ${e.hexFromArgb(s.schemes[r].onSurfaceVariant)};
|
||||||
|
--md-sys-color-on-surface-bright: ${e.hexFromArgb(s.schemes[r].onSurface)};
|
||||||
|
--md-sys-color-on-surface-dim: ${e.hexFromArgb(s.schemes[r].onSurface)};
|
||||||
|
--md-sys-color-background: ${e.hexFromArgb(s.schemes[r].background)};
|
||||||
|
--md-sys-color-background-variant: ${e.hexFromArgb(s.schemes[r].surface)};
|
||||||
|
|
||||||
|
--md-sys-color-on-primary: ${e.hexFromArgb(s.schemes[r].onPrimary)};
|
||||||
|
--md-sys-color-on-primary-container: ${e.hexFromArgb(s.schemes[r].onPrimaryContainer)};
|
||||||
|
--md-sys-color-on-secondary: ${e.hexFromArgb(s.schemes[r].onSecondary)};
|
||||||
|
--md-sys-color-on-secondary-container: ${e.hexFromArgb(s.schemes[r].onSecondaryContainer)};
|
||||||
|
--md-sys-color-on-tertiary: ${e.hexFromArgb(s.schemes[r].onTertiary)};
|
||||||
|
--md-sys-color-on-tertiary-container: ${e.hexFromArgb(s.schemes[r].onTertiaryContainer)};
|
||||||
|
--md-sys-color-on-error: ${e.hexFromArgb(s.schemes[r].onError)};
|
||||||
|
--md-sys-color-on-error-container: ${e.hexFromArgb(s.schemes[r].onErrorContainer)};
|
||||||
|
--md-sys-color-on-background: ${e.hexFromArgb(s.schemes[r].onBackground)};
|
||||||
|
|
||||||
|
--md-sys-typescale-headline-small-font: 'Roboto Flex';
|
||||||
|
--md-sys-typescale-headline-medium-font: 'Roboto Flex';
|
||||||
|
--md-sys-typescale-headline-large-font: 'Roboto Flex';
|
||||||
|
|
||||||
|
--md-sys-typescale-headline-small-size: 24px;
|
||||||
|
--md-sys-typescale-headline-medium-size: 32px;
|
||||||
|
--md-sys-typescale-headline-large-size: 40px;
|
||||||
|
|
||||||
|
--md-sys-typescale-headline-small-weight: 400;
|
||||||
|
--md-sys-typescale-headline-medium-weight: 400;
|
||||||
|
--md-sys-typescale-headline-large-weight: 400;
|
||||||
|
|
||||||
|
--md-sys-typescale-headline-small-line-height: 32px;
|
||||||
|
--md-sys-typescale-headline-medium-line-height: 40px;
|
||||||
|
--md-sys-typescale-headline-large-line-height: 48px;
|
||||||
|
|
||||||
|
--md-sys-typescale-body-small-font: 'Roboto Flex';
|
||||||
|
--md-sys-typescale-body-medium-font: 'Roboto Flex';
|
||||||
|
--md-sys-typescale-body-large-font: 'Roboto Flex';
|
||||||
|
|
||||||
|
--md-sys-typescale-body-small-size: 12px;
|
||||||
|
--md-sys-typescale-body-medium-size: 14px;
|
||||||
|
--md-sys-typescale-body-large-size: 16px;
|
||||||
|
|
||||||
|
--md-sys-typescale-body-small-weight: 400;
|
||||||
|
--md-sys-typescale-body-medium-weight: 400;
|
||||||
|
--md-sys-typescale-body-large-weight: 400;
|
||||||
|
|
||||||
|
--md-sys-typescale-body-small-line-height: 16px;
|
||||||
|
--md-sys-typescale-body-medium-line-height: 20px;
|
||||||
|
--md-sys-typescale-body-large-line-height: 24px;
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
--md-sys-typescale-label-small-font: 'Roboto Flex';
|
||||||
|
--md-sys-typescale-label-medium-font: 'Roboto Flex';
|
||||||
|
--md-sys-typescale-label-large-font: 'Roboto Flex';
|
||||||
|
|
||||||
|
--md-sys-typescale-label-small-size: 12px;
|
||||||
|
--md-sys-typescale-label-medium-size: 14px;
|
||||||
|
--md-sys-typescale-label-large-size: 16px;
|
||||||
|
|
||||||
|
--md-sys-typescale-label-small-weight: 400;
|
||||||
|
--md-sys-typescale-label-medium-weight: 400;
|
||||||
|
--md-sys-typescale-label-large-weight: 400;
|
||||||
|
|
||||||
|
--md-sys-typescale-label-small-line-height: 16px;
|
||||||
|
--md-sys-typescale-label-medium-line-height: 20px;
|
||||||
|
--md-sys-typescale-label-large-line-height: 24px;
|
||||||
|
|
||||||
|
background-color: var(--md-sys-color-background);
|
||||||
|
color: var(--md-sys-color-on-background);
|
||||||
|
}
|
||||||
|
`}),o]})}function n(){const o=l.useContext(c);if(o===void 0)throw new Error("useTheme must be used within a ThemeProvider");return o}function i(){const o=n(),s=y.useScheme();return o.schemes[s]}exports.ThemeProvider=d;exports.usePalette=i;exports.useTheme=n;
|
||||||
|
|
|
||||||
|
|
@ -1,20 +1,125 @@
|
||||||
import { jsx as a } from "react/jsx-runtime";
|
import { jsxs as l, jsx as c } from "react/jsx-runtime";
|
||||||
import { Box as c } from "./react-you-ui25.mjs";
|
import { h as e } from "./string_utils-B4bsIQ5w.mjs";
|
||||||
const l = ({ children: s, style: o, ...r }) => (console.log(r, o), /* @__PURE__ */ a(
|
import { createContext as n, useContext as y } from "react";
|
||||||
c,
|
import { useScheme as d } from "./react-you-ui7.mjs";
|
||||||
{
|
/* empty css */
|
||||||
...r,
|
const a = n(void 0);
|
||||||
style: {
|
function f({ children: r, theme: s, scheme: o }) {
|
||||||
borderRadius: "28px",
|
return /* @__PURE__ */ l(a.Provider, { value: s, children: [
|
||||||
backgroundColor: "var(--md-sys-color-surface)",
|
/* @__PURE__ */ c("style", { children: `
|
||||||
color: "var(--md-sys-color-on-surface)",
|
body {
|
||||||
padding: "18px",
|
|
||||||
display: "flex",
|
--md-ref-typeface-brand: 'Roboto Flex';
|
||||||
...o
|
--md-ref-typeface-plain: 'Roboto Flex';
|
||||||
},
|
|
||||||
children: s
|
--md-sys-color-primary: ${e(s.schemes[o].primary)};
|
||||||
}
|
--md-sys-color-primary-container: ${e(s.schemes[o].primaryContainer)};
|
||||||
));
|
--md-sys-color-secondary: ${e(s.schemes[o].secondary)};
|
||||||
|
--md-sys-color-secondary-container: ${e(s.schemes[o].secondaryContainer)};
|
||||||
|
--md-sys-color-tertiary: ${e(s.schemes[o].tertiary)};
|
||||||
|
--md-sys-color-tertiary-container: ${e(s.schemes[o].tertiaryContainer)};
|
||||||
|
--md-sys-color-error: ${e(s.schemes[o].error)};
|
||||||
|
--md-sys-color-error-container: ${e(s.schemes[o].errorContainer)};
|
||||||
|
--md-sys-color-background: ${e(s.schemes[o].background)};
|
||||||
|
--md-sys-color-surface: ${e(s.schemes[o].surface)};
|
||||||
|
--md-sys-color-surface-variant: ${e(s.schemes[o].surfaceVariant)};
|
||||||
|
--md-sys-color-surface-bright: ${e(s.schemes[o].surface)};
|
||||||
|
--md-sys-color-surface-dim: ${e(s.schemes[o].surface)};
|
||||||
|
--md-sys-color-surface-container: ${e(s.schemes[o].surface)};
|
||||||
|
--md-sys-color-surface-container-lowest: ${e(s.schemes[o].surface)};
|
||||||
|
--md-sys-color-surface-container-low: ${e(s.schemes[o].surfaceVariant)};
|
||||||
|
--md-sys-color-surface-container-high: ${e(s.schemes[o].surfaceVariant)};
|
||||||
|
--md-sys-color-surface-container-highest: ${e(s.schemes[o].surfaceVariant)};
|
||||||
|
--md-sys-color-outline: ${e(s.schemes[o].outline)};
|
||||||
|
--md-sys-color-outline-variant: ${e(s.schemes[o].outlineVariant)};
|
||||||
|
--md-sys-color-scrim: ${e(s.schemes[o].scrim)};
|
||||||
|
--md-sys-color-shadow: ${e(s.schemes[o].shadow)};
|
||||||
|
--md-sys-color-on-surface: ${e(s.schemes[o].onSurface)};
|
||||||
|
--md-sys-color-on-surface-variant: ${e(s.schemes[o].onSurfaceVariant)};
|
||||||
|
--md-sys-color-on-surface-bright: ${e(s.schemes[o].onSurface)};
|
||||||
|
--md-sys-color-on-surface-dim: ${e(s.schemes[o].onSurface)};
|
||||||
|
--md-sys-color-background: ${e(s.schemes[o].background)};
|
||||||
|
--md-sys-color-background-variant: ${e(s.schemes[o].surface)};
|
||||||
|
|
||||||
|
--md-sys-color-on-primary: ${e(s.schemes[o].onPrimary)};
|
||||||
|
--md-sys-color-on-primary-container: ${e(s.schemes[o].onPrimaryContainer)};
|
||||||
|
--md-sys-color-on-secondary: ${e(s.schemes[o].onSecondary)};
|
||||||
|
--md-sys-color-on-secondary-container: ${e(s.schemes[o].onSecondaryContainer)};
|
||||||
|
--md-sys-color-on-tertiary: ${e(s.schemes[o].onTertiary)};
|
||||||
|
--md-sys-color-on-tertiary-container: ${e(s.schemes[o].onTertiaryContainer)};
|
||||||
|
--md-sys-color-on-error: ${e(s.schemes[o].onError)};
|
||||||
|
--md-sys-color-on-error-container: ${e(s.schemes[o].onErrorContainer)};
|
||||||
|
--md-sys-color-on-background: ${e(s.schemes[o].onBackground)};
|
||||||
|
|
||||||
|
--md-sys-typescale-headline-small-font: 'Roboto Flex';
|
||||||
|
--md-sys-typescale-headline-medium-font: 'Roboto Flex';
|
||||||
|
--md-sys-typescale-headline-large-font: 'Roboto Flex';
|
||||||
|
|
||||||
|
--md-sys-typescale-headline-small-size: 24px;
|
||||||
|
--md-sys-typescale-headline-medium-size: 32px;
|
||||||
|
--md-sys-typescale-headline-large-size: 40px;
|
||||||
|
|
||||||
|
--md-sys-typescale-headline-small-weight: 400;
|
||||||
|
--md-sys-typescale-headline-medium-weight: 400;
|
||||||
|
--md-sys-typescale-headline-large-weight: 400;
|
||||||
|
|
||||||
|
--md-sys-typescale-headline-small-line-height: 32px;
|
||||||
|
--md-sys-typescale-headline-medium-line-height: 40px;
|
||||||
|
--md-sys-typescale-headline-large-line-height: 48px;
|
||||||
|
|
||||||
|
--md-sys-typescale-body-small-font: 'Roboto Flex';
|
||||||
|
--md-sys-typescale-body-medium-font: 'Roboto Flex';
|
||||||
|
--md-sys-typescale-body-large-font: 'Roboto Flex';
|
||||||
|
|
||||||
|
--md-sys-typescale-body-small-size: 12px;
|
||||||
|
--md-sys-typescale-body-medium-size: 14px;
|
||||||
|
--md-sys-typescale-body-large-size: 16px;
|
||||||
|
|
||||||
|
--md-sys-typescale-body-small-weight: 400;
|
||||||
|
--md-sys-typescale-body-medium-weight: 400;
|
||||||
|
--md-sys-typescale-body-large-weight: 400;
|
||||||
|
|
||||||
|
--md-sys-typescale-body-small-line-height: 16px;
|
||||||
|
--md-sys-typescale-body-medium-line-height: 20px;
|
||||||
|
--md-sys-typescale-body-large-line-height: 24px;
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
--md-sys-typescale-label-small-font: 'Roboto Flex';
|
||||||
|
--md-sys-typescale-label-medium-font: 'Roboto Flex';
|
||||||
|
--md-sys-typescale-label-large-font: 'Roboto Flex';
|
||||||
|
|
||||||
|
--md-sys-typescale-label-small-size: 12px;
|
||||||
|
--md-sys-typescale-label-medium-size: 14px;
|
||||||
|
--md-sys-typescale-label-large-size: 16px;
|
||||||
|
|
||||||
|
--md-sys-typescale-label-small-weight: 400;
|
||||||
|
--md-sys-typescale-label-medium-weight: 400;
|
||||||
|
--md-sys-typescale-label-large-weight: 400;
|
||||||
|
|
||||||
|
--md-sys-typescale-label-small-line-height: 16px;
|
||||||
|
--md-sys-typescale-label-medium-line-height: 20px;
|
||||||
|
--md-sys-typescale-label-large-line-height: 24px;
|
||||||
|
|
||||||
|
background-color: var(--md-sys-color-background);
|
||||||
|
color: var(--md-sys-color-on-background);
|
||||||
|
}
|
||||||
|
` }),
|
||||||
|
r
|
||||||
|
] });
|
||||||
|
}
|
||||||
|
function i() {
|
||||||
|
const r = y(a);
|
||||||
|
if (r === void 0)
|
||||||
|
throw new Error("useTheme must be used within a ThemeProvider");
|
||||||
|
return r;
|
||||||
|
}
|
||||||
|
function g() {
|
||||||
|
const r = i(), s = d();
|
||||||
|
return r.schemes[s];
|
||||||
|
}
|
||||||
export {
|
export {
|
||||||
l as Paper
|
f as ThemeProvider,
|
||||||
|
g as usePalette,
|
||||||
|
i as useTheme
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -1 +1 @@
|
||||||
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),a=require("react"),l=require("./create-component-D9KTUrcf.js"),n=l.o({tagName:"label",react:a,elementClass:HTMLLabelElement}),o=e=>{const{form:s,...t}=e;return r.jsx(n,{...t,style:{display:"flex",alignItems:"center",gap:"8px",...e.style,fontFamily:"var(--md-ref-typeface-plain)"}})};exports.FormLabel=o;
|
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),t=require("react"),r=t.createContext("light");function o({children:e,scheme:c}){return n.jsx(r.Provider,{value:c,children:e})}function u(){return t.useContext(r)}exports.SchemeProvider=o;exports.useScheme=u;
|
||||||
|
|
|
||||||
|
|
@ -1,26 +1,13 @@
|
||||||
import { jsx as a } from "react/jsx-runtime";
|
import { jsx as r } from "react/jsx-runtime";
|
||||||
import r from "react";
|
import { createContext as n, useContext as c } from "react";
|
||||||
import { o as l } from "./create-component-CVXl33PD.mjs";
|
const t = n("light");
|
||||||
const m = l({
|
function s({ children: e, scheme: o }) {
|
||||||
tagName: "label",
|
return /* @__PURE__ */ r(t.Provider, { value: o, children: e });
|
||||||
react: r,
|
}
|
||||||
elementClass: HTMLLabelElement
|
function u() {
|
||||||
}), p = (e) => {
|
return c(t);
|
||||||
const { form: o, ...t } = e;
|
}
|
||||||
return /* @__PURE__ */ a(
|
|
||||||
m,
|
|
||||||
{
|
|
||||||
...t,
|
|
||||||
style: {
|
|
||||||
display: "flex",
|
|
||||||
alignItems: "center",
|
|
||||||
gap: "8px",
|
|
||||||
...e.style,
|
|
||||||
fontFamily: "var(--md-ref-typeface-plain)"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
);
|
|
||||||
};
|
|
||||||
export {
|
export {
|
||||||
p as FormLabel
|
s as SchemeProvider,
|
||||||
|
u as useScheme
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -1 +1 @@
|
||||||
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),c=require("./react-you-ui25.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:"8px 16px",backgroundColor:"transparent",...s},...o,children:r})};exports.AppBar=i;
|
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),a=require("react"),l=require("./create-component-D9KTUrcf.js"),n=l.o({tagName:"label",react:a,elementClass:HTMLLabelElement}),o=e=>{const{form:s,...t}=e;return r.jsx(n,{...t,style:{display:"flex",alignItems:"center",gap:"8px",...e.style,fontFamily:"var(--md-ref-typeface-plain)"}})};exports.FormLabel=o;
|
||||||
|
|
|
||||||
|
|
@ -1,25 +1,26 @@
|
||||||
import { jsx as p } from "react/jsx-runtime";
|
import { jsx as a } from "react/jsx-runtime";
|
||||||
import { Box as a } from "./react-you-ui25.mjs";
|
import r from "react";
|
||||||
const c = (e) => {
|
import { o as l } from "./create-component-CVXl33PD.mjs";
|
||||||
const { className: t, id: r, children: n, style: s, ...o } = e;
|
const m = l({
|
||||||
return /* @__PURE__ */ p(
|
tagName: "label",
|
||||||
a,
|
react: r,
|
||||||
|
elementClass: HTMLLabelElement
|
||||||
|
}), p = (e) => {
|
||||||
|
const { form: o, ...t } = e;
|
||||||
|
return /* @__PURE__ */ a(
|
||||||
|
m,
|
||||||
{
|
{
|
||||||
className: t,
|
...t,
|
||||||
id: r,
|
|
||||||
style: {
|
style: {
|
||||||
display: "flex",
|
display: "flex",
|
||||||
alignItems: "center",
|
alignItems: "center",
|
||||||
justifyContent: "space-between",
|
gap: "8px",
|
||||||
padding: "8px 16px",
|
...e.style,
|
||||||
backgroundColor: "transparent",
|
fontFamily: "var(--md-ref-typeface-plain)"
|
||||||
...s
|
}
|
||||||
},
|
|
||||||
...o,
|
|
||||||
children: n
|
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
export {
|
export {
|
||||||
c as AppBar
|
p as FormLabel
|
||||||
};
|
};
|
||||||
|
|
|
||||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,14 @@
|
||||||
|
import { default as React } from 'react';
|
||||||
|
import { AriaProps } from '../types/aria';
|
||||||
|
|
||||||
|
type LinkProps = AriaProps & {
|
||||||
|
href?: string;
|
||||||
|
target?: '_blank' | '_self' | '_parent' | '_top';
|
||||||
|
rel?: string;
|
||||||
|
children?: React.ReactNode;
|
||||||
|
className?: string;
|
||||||
|
id?: string;
|
||||||
|
style?: React.CSSProperties;
|
||||||
|
};
|
||||||
|
export declare const Link: (props: LinkProps) => React.JSX.Element;
|
||||||
|
export {};
|
||||||
|
|
@ -18,6 +18,7 @@ export { Menu } from './components/Menu';
|
||||||
export { Paper } from './components/Paper';
|
export { Paper } from './components/Paper';
|
||||||
export { FormLabel } from './components/Forms';
|
export { FormLabel } from './components/Forms';
|
||||||
export { AppBar } from './components/AppBar';
|
export { AppBar } from './components/AppBar';
|
||||||
|
export { Link } from './components/Link';
|
||||||
export { ThemeProvider } from './hooks/useTheme';
|
export { ThemeProvider } from './hooks/useTheme';
|
||||||
export { useTheme } from './hooks/useTheme';
|
export { useTheme } from './hooks/useTheme';
|
||||||
export { usePalette } from './hooks/useTheme';
|
export { usePalette } from './hooks/useTheme';
|
||||||
|
|
|
||||||
|
|
@ -21,7 +21,7 @@ export const AppBar = (props: AppBarProps) => {
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
justifyContent: 'space-between',
|
justifyContent: 'space-between',
|
||||||
padding: '8px 16px',
|
padding: '16px 16px',
|
||||||
backgroundColor: 'transparent',
|
backgroundColor: 'transparent',
|
||||||
...style,
|
...style,
|
||||||
}}
|
}}
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,35 @@
|
||||||
|
import React from "react";
|
||||||
|
import { AriaProps } from "../types/aria";
|
||||||
|
import { usePalette } from "../hooks/useTheme";
|
||||||
|
import { hexFromArgb } from "@material/material-color-utilities";
|
||||||
|
|
||||||
|
type LinkProps = AriaProps & {
|
||||||
|
href?: string;
|
||||||
|
target?: '_blank' | '_self' | '_parent' | '_top';
|
||||||
|
rel?: string;
|
||||||
|
children?: React.ReactNode;
|
||||||
|
className?: string;
|
||||||
|
id?: string;
|
||||||
|
style?: React.CSSProperties;
|
||||||
|
};
|
||||||
|
|
||||||
|
export const Link = (props: LinkProps) => {
|
||||||
|
const palette = usePalette();
|
||||||
|
const { href, target, rel, children, className, id, style, ...rest } = props;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<a
|
||||||
|
href={href}
|
||||||
|
target={target}
|
||||||
|
rel={rel}
|
||||||
|
className={className}
|
||||||
|
id={id}
|
||||||
|
style={{
|
||||||
|
color: hexFromArgb(palette.primary),
|
||||||
|
textDecoration: 'none',
|
||||||
|
...style,
|
||||||
|
}}
|
||||||
|
{...rest}
|
||||||
|
>{children}</a>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
@ -27,6 +27,7 @@ export function ThemeProvider({ children, theme, scheme }: { children: React.Rea
|
||||||
--md-sys-color-error-container: ${hexFromArgb(theme.schemes[scheme].errorContainer)};
|
--md-sys-color-error-container: ${hexFromArgb(theme.schemes[scheme].errorContainer)};
|
||||||
--md-sys-color-background: ${hexFromArgb(theme.schemes[scheme].background)};
|
--md-sys-color-background: ${hexFromArgb(theme.schemes[scheme].background)};
|
||||||
--md-sys-color-surface: ${hexFromArgb(theme.schemes[scheme].surface)};
|
--md-sys-color-surface: ${hexFromArgb(theme.schemes[scheme].surface)};
|
||||||
|
--md-sys-color-surface-variant: ${hexFromArgb(theme.schemes[scheme].surfaceVariant)};
|
||||||
--md-sys-color-surface-bright: ${hexFromArgb(theme.schemes[scheme].surface)};
|
--md-sys-color-surface-bright: ${hexFromArgb(theme.schemes[scheme].surface)};
|
||||||
--md-sys-color-surface-dim: ${hexFromArgb(theme.schemes[scheme].surface)};
|
--md-sys-color-surface-dim: ${hexFromArgb(theme.schemes[scheme].surface)};
|
||||||
--md-sys-color-surface-container: ${hexFromArgb(theme.schemes[scheme].surface)};
|
--md-sys-color-surface-container: ${hexFromArgb(theme.schemes[scheme].surface)};
|
||||||
|
|
|
||||||
|
|
@ -18,6 +18,7 @@ export { Menu } from "./components/Menu";
|
||||||
export { Paper } from "./components/Paper";
|
export { Paper } from "./components/Paper";
|
||||||
export { FormLabel } from "./components/Forms";
|
export { FormLabel } from "./components/Forms";
|
||||||
export { AppBar } from "./components/AppBar";
|
export { AppBar } from "./components/AppBar";
|
||||||
|
export { Link } from "./components/Link";
|
||||||
|
|
||||||
export { ThemeProvider } from "./hooks/useTheme";
|
export { ThemeProvider } from "./hooks/useTheme";
|
||||||
export { useTheme } from "./hooks/useTheme";
|
export { useTheme } from "./hooks/useTheme";
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue