@vibe-flags/core 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.ts +95 -0
- package/dist/vibe-flags.cdn.js +427 -0
- package/dist/vibe-flags.cdn.mjs +1216 -0
- package/dist/vibe-flags.js +647 -0
- package/package.json +41 -0
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,95 @@
|
|
|
1
|
+
import { CSSResult } from 'lit';
|
|
2
|
+
import { LitElement } from 'lit';
|
|
3
|
+
import { nothing } from 'lit';
|
|
4
|
+
import { TemplateResult } from 'lit';
|
|
5
|
+
|
|
6
|
+
export declare type FlagConfig = FlagConfigBoolean | FlagConfigSelect;
|
|
7
|
+
|
|
8
|
+
export declare interface FlagConfigBoolean {
|
|
9
|
+
key: string;
|
|
10
|
+
type: 'boolean';
|
|
11
|
+
default: boolean;
|
|
12
|
+
label?: string;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
export declare interface FlagConfigSelect {
|
|
16
|
+
key: string;
|
|
17
|
+
type: 'select';
|
|
18
|
+
default: string;
|
|
19
|
+
options: string[];
|
|
20
|
+
label?: string;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
export declare interface FlagState {
|
|
24
|
+
[key: string]: FlagValue;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
declare class FlagStore extends EventTarget {
|
|
28
|
+
private configs;
|
|
29
|
+
private state;
|
|
30
|
+
private listening;
|
|
31
|
+
register(config: FlagConfig): void;
|
|
32
|
+
unregister(key: string): void;
|
|
33
|
+
get(key: string): FlagValue | undefined;
|
|
34
|
+
set(key: string, value: FlagValue): void;
|
|
35
|
+
getAll(): FlagState;
|
|
36
|
+
getConfig(): FlagConfig[];
|
|
37
|
+
getConfigForKey(key: string): FlagConfig | undefined;
|
|
38
|
+
reset(): void;
|
|
39
|
+
private readFromStorage;
|
|
40
|
+
private writeToStorage;
|
|
41
|
+
private removeFromStorage;
|
|
42
|
+
private dispatch;
|
|
43
|
+
private onStorageEvent;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
export declare const flagStore: FlagStore;
|
|
47
|
+
|
|
48
|
+
export declare type FlagValue = boolean | string;
|
|
49
|
+
|
|
50
|
+
export declare class VibeFlag extends LitElement {
|
|
51
|
+
key: string;
|
|
52
|
+
description: string;
|
|
53
|
+
type: 'boolean' | 'select';
|
|
54
|
+
value: string;
|
|
55
|
+
defaultValue: string;
|
|
56
|
+
options: string;
|
|
57
|
+
private isMatch;
|
|
58
|
+
private registered;
|
|
59
|
+
connectedCallback(): void;
|
|
60
|
+
disconnectedCallback(): void;
|
|
61
|
+
protected willUpdate(changed: Map<string, unknown>): void;
|
|
62
|
+
private registerFlag;
|
|
63
|
+
private parseOptions;
|
|
64
|
+
private onFlagChange;
|
|
65
|
+
private evaluate;
|
|
66
|
+
protected render(): TemplateResult<1> | typeof nothing;
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
export declare class VibeFlags extends LitElement {
|
|
70
|
+
protected render(): TemplateResult<1>;
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
export declare class VibeToolbar extends LitElement {
|
|
74
|
+
static styles: CSSResult[];
|
|
75
|
+
private open;
|
|
76
|
+
private flags;
|
|
77
|
+
private configs;
|
|
78
|
+
connectedCallback(): void;
|
|
79
|
+
disconnectedCallback(): void;
|
|
80
|
+
private onFlagChange;
|
|
81
|
+
private syncFromStore;
|
|
82
|
+
private toggleSidebar;
|
|
83
|
+
private closeSidebar;
|
|
84
|
+
private onToggle;
|
|
85
|
+
private onSelect;
|
|
86
|
+
private onReset;
|
|
87
|
+
private renderFlagIcon;
|
|
88
|
+
private renderCloseIcon;
|
|
89
|
+
private renderChevronDown;
|
|
90
|
+
private renderBooleanFlag;
|
|
91
|
+
private renderSelectFlag;
|
|
92
|
+
protected render(): TemplateResult<1>;
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
export { }
|
|
@@ -0,0 +1,427 @@
|
|
|
1
|
+
var VibeFlags=(function(c){"use strict";/**
|
|
2
|
+
* @license
|
|
3
|
+
* Copyright 2019 Google LLC
|
|
4
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
5
|
+
*/const V=globalThis,L=V.ShadowRoot&&(V.ShadyCSS===void 0||V.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,B=Symbol(),Y=new WeakMap;let G=class{constructor(t,e,s){if(this._$cssResult$=!0,s!==B)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e}get styleSheet(){let t=this.o;const e=this.t;if(L&&t===void 0){const s=e!==void 0&&e.length===1;s&&(t=Y.get(e)),t===void 0&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),s&&Y.set(e,t))}return t}toString(){return this.cssText}};const ut=r=>new G(typeof r=="string"?r:r+"",void 0,B),Q=(r,...t)=>{const e=r.length===1?r[0]:t.reduce((s,i,o)=>s+(n=>{if(n._$cssResult$===!0)return n.cssText;if(typeof n=="number")return n;throw Error("Value passed to 'css' function must be a 'css' function result: "+n+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(i)+r[o+1],r[0]);return new G(e,r,B)},gt=(r,t)=>{if(L)r.adoptedStyleSheets=t.map(e=>e instanceof CSSStyleSheet?e:e.styleSheet);else for(const e of t){const s=document.createElement("style"),i=V.litNonce;i!==void 0&&s.setAttribute("nonce",i),s.textContent=e.cssText,r.appendChild(s)}},tt=L?r=>r:r=>r instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return ut(e)})(r):r;/**
|
|
6
|
+
* @license
|
|
7
|
+
* Copyright 2017 Google LLC
|
|
8
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
9
|
+
*/const{is:vt,defineProperty:bt,getOwnPropertyDescriptor:$t,getOwnPropertyNames:yt,getOwnPropertySymbols:mt,getPrototypeOf:_t}=Object,N=globalThis,et=N.trustedTypes,xt=et?et.emptyScript:"",wt=N.reactiveElementPolyfillSupport,C=(r,t)=>r,H={toAttribute(r,t){switch(t){case Boolean:r=r?xt:null;break;case Object:case Array:r=r==null?r:JSON.stringify(r)}return r},fromAttribute(r,t){let e=r;switch(t){case Boolean:e=r!==null;break;case Number:e=r===null?null:Number(r);break;case Object:case Array:try{e=JSON.parse(r)}catch{e=null}}return e}},W=(r,t)=>!vt(r,t),st={attribute:!0,type:String,converter:H,reflect:!1,useDefault:!1,hasChanged:W};Symbol.metadata??=Symbol("metadata"),N.litPropertyMetadata??=new WeakMap;let S=class extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??=[]).push(t)}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,e=st){if(e.state&&(e.attribute=!1),this._$Ei(),this.prototype.hasOwnProperty(t)&&((e=Object.create(e)).wrapped=!0),this.elementProperties.set(t,e),!e.noAccessor){const s=Symbol(),i=this.getPropertyDescriptor(t,s,e);i!==void 0&&bt(this.prototype,t,i)}}static getPropertyDescriptor(t,e,s){const{get:i,set:o}=$t(this.prototype,t)??{get(){return this[e]},set(n){this[e]=n}};return{get:i,set(n){const l=i?.call(this);o?.call(this,n),this.requestUpdate(t,l,s)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)??st}static _$Ei(){if(this.hasOwnProperty(C("elementProperties")))return;const t=_t(this);t.finalize(),t.l!==void 0&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties)}static finalize(){if(this.hasOwnProperty(C("finalized")))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(C("properties"))){const e=this.properties,s=[...yt(e),...mt(e)];for(const i of s)this.createProperty(i,e[i])}const t=this[Symbol.metadata];if(t!==null){const e=litPropertyMetadata.get(t);if(e!==void 0)for(const[s,i]of e)this.elementProperties.set(s,i)}this._$Eh=new Map;for(const[e,s]of this.elementProperties){const i=this._$Eu(e,s);i!==void 0&&this._$Eh.set(i,e)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(t){const e=[];if(Array.isArray(t)){const s=new Set(t.flat(1/0).reverse());for(const i of s)e.unshift(tt(i))}else t!==void 0&&e.push(tt(t));return e}static _$Eu(t,e){const s=e.attribute;return s===!1?void 0:typeof s=="string"?s:typeof t=="string"?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev()}_$Ev(){this._$ES=new Promise(t=>this.enableUpdating=t),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach(t=>t(this))}addController(t){(this._$EO??=new Set).add(t),this.renderRoot!==void 0&&this.isConnected&&t.hostConnected?.()}removeController(t){this._$EO?.delete(t)}_$E_(){const t=new Map,e=this.constructor.elementProperties;for(const s of e.keys())this.hasOwnProperty(s)&&(t.set(s,this[s]),delete this[s]);t.size>0&&(this._$Ep=t)}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return gt(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(!0),this._$EO?.forEach(t=>t.hostConnected?.())}enableUpdating(t){}disconnectedCallback(){this._$EO?.forEach(t=>t.hostDisconnected?.())}attributeChangedCallback(t,e,s){this._$AK(t,s)}_$ET(t,e){const s=this.constructor.elementProperties.get(t),i=this.constructor._$Eu(t,s);if(i!==void 0&&s.reflect===!0){const o=(s.converter?.toAttribute!==void 0?s.converter:H).toAttribute(e,s.type);this._$Em=t,o==null?this.removeAttribute(i):this.setAttribute(i,o),this._$Em=null}}_$AK(t,e){const s=this.constructor,i=s._$Eh.get(t);if(i!==void 0&&this._$Em!==i){const o=s.getPropertyOptions(i),n=typeof o.converter=="function"?{fromAttribute:o.converter}:o.converter?.fromAttribute!==void 0?o.converter:H;this._$Em=i;const l=n.fromAttribute(e,o.type);this[i]=l??this._$Ej?.get(i)??l,this._$Em=null}}requestUpdate(t,e,s,i=!1,o){if(t!==void 0){const n=this.constructor;if(i===!1&&(o=this[t]),s??=n.getPropertyOptions(t),!((s.hasChanged??W)(o,e)||s.useDefault&&s.reflect&&o===this._$Ej?.get(t)&&!this.hasAttribute(n._$Eu(t,s))))return;this.C(t,e,s)}this.isUpdatePending===!1&&(this._$ES=this._$EP())}C(t,e,{useDefault:s,reflect:i,wrapped:o},n){s&&!(this._$Ej??=new Map).has(t)&&(this._$Ej.set(t,n??e??this[t]),o!==!0||n!==void 0)||(this._$AL.has(t)||(this.hasUpdated||s||(e=void 0),this._$AL.set(t,e)),i===!0&&this._$Em!==t&&(this._$Eq??=new Set).add(t))}async _$EP(){this.isUpdatePending=!0;try{await this._$ES}catch(e){Promise.reject(e)}const t=this.scheduleUpdate();return t!=null&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(const[i,o]of this._$Ep)this[i]=o;this._$Ep=void 0}const s=this.constructor.elementProperties;if(s.size>0)for(const[i,o]of s){const{wrapped:n}=o,l=this[i];n!==!0||this._$AL.has(i)||l===void 0||this.C(i,void 0,o,l)}}let t=!1;const e=this._$AL;try{t=this.shouldUpdate(e),t?(this.willUpdate(e),this._$EO?.forEach(s=>s.hostUpdate?.()),this.update(e)):this._$EM()}catch(s){throw t=!1,this._$EM(),s}t&&this._$AE(e)}willUpdate(t){}_$AE(t){this._$EO?.forEach(e=>e.hostUpdated?.()),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}_$EM(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return!0}update(t){this._$Eq&&=this._$Eq.forEach(e=>this._$ET(e,this[e])),this._$EM()}updated(t){}firstUpdated(t){}};S.elementStyles=[],S.shadowRootOptions={mode:"open"},S[C("elementProperties")]=new Map,S[C("finalized")]=new Map,wt?.({ReactiveElement:S}),(N.reactiveElementVersions??=[]).push("2.1.2");/**
|
|
10
|
+
* @license
|
|
11
|
+
* Copyright 2017 Google LLC
|
|
12
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
13
|
+
*/const q=globalThis,it=r=>r,R=q.trustedTypes,rt=R?R.createPolicy("lit-html",{createHTML:r=>r}):void 0,ot="$lit$",v=`lit$${Math.random().toFixed(9).slice(2)}$`,nt="?"+v,At=`<${nt}>`,m=document,P=()=>m.createComment(""),O=r=>r===null||typeof r!="object"&&typeof r!="function",J=Array.isArray,St=r=>J(r)||typeof r?.[Symbol.iterator]=="function",K=`[
|
|
14
|
+
\f\r]`,T=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,at=/-->/g,lt=/>/g,_=RegExp(`>|${K}(?:([^\\s"'>=/]+)(${K}*=${K}*(?:[^
|
|
15
|
+
\f\r"'\`<>=]|("|')|))|$)`,"g"),ht=/'/g,ct=/"/g,dt=/^(?:script|style|textarea|title)$/i,Et=r=>(t,...e)=>({_$litType$:r,strings:t,values:e}),u=Et(1),E=Symbol.for("lit-noChange"),d=Symbol.for("lit-nothing"),pt=new WeakMap,x=m.createTreeWalker(m,129);function ft(r,t){if(!J(r)||!r.hasOwnProperty("raw"))throw Error("invalid template strings array");return rt!==void 0?rt.createHTML(t):t}const kt=(r,t)=>{const e=r.length-1,s=[];let i,o=t===2?"<svg>":t===3?"<math>":"",n=T;for(let l=0;l<e;l++){const a=r[l];let p,f,h=-1,g=0;for(;g<a.length&&(n.lastIndex=g,f=n.exec(a),f!==null);)g=n.lastIndex,n===T?f[1]==="!--"?n=at:f[1]!==void 0?n=lt:f[2]!==void 0?(dt.test(f[2])&&(i=RegExp("</"+f[2],"g")),n=_):f[3]!==void 0&&(n=_):n===_?f[0]===">"?(n=i??T,h=-1):f[1]===void 0?h=-2:(h=n.lastIndex-f[2].length,p=f[1],n=f[3]===void 0?_:f[3]==='"'?ct:ht):n===ct||n===ht?n=_:n===at||n===lt?n=T:(n=_,i=void 0);const y=n===_&&r[l+1].startsWith("/>")?" ":"";o+=n===T?a+At:h>=0?(s.push(p),a.slice(0,h)+ot+a.slice(h)+v+y):a+v+(h===-2?l:y)}return[ft(r,o+(r[e]||"<?>")+(t===2?"</svg>":t===3?"</math>":"")),s]};class M{constructor({strings:t,_$litType$:e},s){let i;this.parts=[];let o=0,n=0;const l=t.length-1,a=this.parts,[p,f]=kt(t,e);if(this.el=M.createElement(p,s),x.currentNode=this.el.content,e===2||e===3){const h=this.el.content.firstChild;h.replaceWith(...h.childNodes)}for(;(i=x.nextNode())!==null&&a.length<l;){if(i.nodeType===1){if(i.hasAttributes())for(const h of i.getAttributeNames())if(h.endsWith(ot)){const g=f[n++],y=i.getAttribute(h).split(v),I=/([.?@])?(.*)/.exec(g);a.push({type:1,index:o,name:I[2],strings:y,ctor:I[1]==="."?Pt:I[1]==="?"?Ot:I[1]==="@"?Tt:j}),i.removeAttribute(h)}else h.startsWith(v)&&(a.push({type:6,index:o}),i.removeAttribute(h));if(dt.test(i.tagName)){const h=i.textContent.split(v),g=h.length-1;if(g>0){i.textContent=R?R.emptyScript:"";for(let y=0;y<g;y++)i.append(h[y],P()),x.nextNode(),a.push({type:2,index:++o});i.append(h[g],P())}}}else if(i.nodeType===8)if(i.data===nt)a.push({type:2,index:o});else{let h=-1;for(;(h=i.data.indexOf(v,h+1))!==-1;)a.push({type:7,index:o}),h+=v.length-1}o++}}static createElement(t,e){const s=m.createElement("template");return s.innerHTML=t,s}}function k(r,t,e=r,s){if(t===E)return t;let i=s!==void 0?e._$Co?.[s]:e._$Cl;const o=O(t)?void 0:t._$litDirective$;return i?.constructor!==o&&(i?._$AO?.(!1),o===void 0?i=void 0:(i=new o(r),i._$AT(r,e,s)),s!==void 0?(e._$Co??=[])[s]=i:e._$Cl=i),i!==void 0&&(t=k(r,i._$AS(r,t.values),i,s)),t}class Ct{constructor(t,e){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=e}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){const{el:{content:e},parts:s}=this._$AD,i=(t?.creationScope??m).importNode(e,!0);x.currentNode=i;let o=x.nextNode(),n=0,l=0,a=s[0];for(;a!==void 0;){if(n===a.index){let p;a.type===2?p=new F(o,o.nextSibling,this,t):a.type===1?p=new a.ctor(o,a.name,a.strings,this,t):a.type===6&&(p=new Mt(o,this,t)),this._$AV.push(p),a=s[++l]}n!==a?.index&&(o=x.nextNode(),n++)}return x.currentNode=m,i}p(t){let e=0;for(const s of this._$AV)s!==void 0&&(s.strings!==void 0?(s._$AI(t,s,e),e+=s.strings.length-2):s._$AI(t[e])),e++}}class F{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(t,e,s,i){this.type=2,this._$AH=d,this._$AN=void 0,this._$AA=t,this._$AB=e,this._$AM=s,this.options=i,this._$Cv=i?.isConnected??!0}get parentNode(){let t=this._$AA.parentNode;const e=this._$AM;return e!==void 0&&t?.nodeType===11&&(t=e.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,e=this){t=k(this,t,e),O(t)?t===d||t==null||t===""?(this._$AH!==d&&this._$AR(),this._$AH=d):t!==this._$AH&&t!==E&&this._(t):t._$litType$!==void 0?this.$(t):t.nodeType!==void 0?this.T(t):St(t)?this.k(t):this._(t)}O(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.O(t))}_(t){this._$AH!==d&&O(this._$AH)?this._$AA.nextSibling.data=t:this.T(m.createTextNode(t)),this._$AH=t}$(t){const{values:e,_$litType$:s}=t,i=typeof s=="number"?this._$AC(t):(s.el===void 0&&(s.el=M.createElement(ft(s.h,s.h[0]),this.options)),s);if(this._$AH?._$AD===i)this._$AH.p(e);else{const o=new Ct(i,this),n=o.u(this.options);o.p(e),this.T(n),this._$AH=o}}_$AC(t){let e=pt.get(t.strings);return e===void 0&&pt.set(t.strings,e=new M(t)),e}k(t){J(this._$AH)||(this._$AH=[],this._$AR());const e=this._$AH;let s,i=0;for(const o of t)i===e.length?e.push(s=new F(this.O(P()),this.O(P()),this,this.options)):s=e[i],s._$AI(o),i++;i<e.length&&(this._$AR(s&&s._$AB.nextSibling,i),e.length=i)}_$AR(t=this._$AA.nextSibling,e){for(this._$AP?.(!1,!0,e);t!==this._$AB;){const s=it(t).nextSibling;it(t).remove(),t=s}}setConnected(t){this._$AM===void 0&&(this._$Cv=t,this._$AP?.(t))}}class j{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,e,s,i,o){this.type=1,this._$AH=d,this._$AN=void 0,this.element=t,this.name=e,this._$AM=i,this.options=o,s.length>2||s[0]!==""||s[1]!==""?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=d}_$AI(t,e=this,s,i){const o=this.strings;let n=!1;if(o===void 0)t=k(this,t,e,0),n=!O(t)||t!==this._$AH&&t!==E,n&&(this._$AH=t);else{const l=t;let a,p;for(t=o[0],a=0;a<o.length-1;a++)p=k(this,l[s+a],e,a),p===E&&(p=this._$AH[a]),n||=!O(p)||p!==this._$AH[a],p===d?t=d:t!==d&&(t+=(p??"")+o[a+1]),this._$AH[a]=p}n&&!i&&this.j(t)}j(t){t===d?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"")}}class Pt extends j{constructor(){super(...arguments),this.type=3}j(t){this.element[this.name]=t===d?void 0:t}}class Ot extends j{constructor(){super(...arguments),this.type=4}j(t){this.element.toggleAttribute(this.name,!!t&&t!==d)}}class Tt extends j{constructor(t,e,s,i,o){super(t,e,s,i,o),this.type=5}_$AI(t,e=this){if((t=k(this,t,e,0)??d)===E)return;const s=this._$AH,i=t===d&&s!==d||t.capture!==s.capture||t.once!==s.once||t.passive!==s.passive,o=t!==d&&(s===d||i);i&&this.element.removeEventListener(this.name,this,s),o&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){typeof this._$AH=="function"?this._$AH.call(this.options?.host??this.element,t):this._$AH.handleEvent(t)}}class Mt{constructor(t,e,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=e,this.options=s}get _$AU(){return this._$AM._$AU}_$AI(t){k(this,t)}}const Ft=q.litHtmlPolyfillSupport;Ft?.(M,F),(q.litHtmlVersions??=[]).push("3.3.2");const Ut=(r,t,e)=>{const s=e?.renderBefore??t;let i=s._$litPart$;if(i===void 0){const o=e?.renderBefore??null;s._$litPart$=i=new F(t.insertBefore(P(),o),o,void 0,e??{})}return i._$AI(r),i};/**
|
|
16
|
+
* @license
|
|
17
|
+
* Copyright 2017 Google LLC
|
|
18
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
19
|
+
*/const X=globalThis;class w extends S{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){const t=super.createRenderRoot();return this.renderOptions.renderBefore??=t.firstChild,t}update(t){const e=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=Ut(e,this.renderRoot,this.renderOptions)}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(!0)}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(!1)}render(){return E}}w._$litElement$=!0,w.finalized=!0,X.litElementHydrateSupport?.({LitElement:w});const Vt=X.litElementPolyfillSupport;Vt?.({LitElement:w}),(X.litElementVersions??=[]).push("4.2.2");/**
|
|
20
|
+
* @license
|
|
21
|
+
* Copyright 2017 Google LLC
|
|
22
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
23
|
+
*/const Z=r=>(t,e)=>{e!==void 0?e.addInitializer(()=>{customElements.define(r,t)}):customElements.define(r,t)};/**
|
|
24
|
+
* @license
|
|
25
|
+
* Copyright 2017 Google LLC
|
|
26
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
27
|
+
*/const Nt={attribute:!0,type:String,converter:H,reflect:!1,hasChanged:W},Ht=(r=Nt,t,e)=>{const{kind:s,metadata:i}=e;let o=globalThis.litPropertyMetadata.get(i);if(o===void 0&&globalThis.litPropertyMetadata.set(i,o=new Map),s==="setter"&&((r=Object.create(r)).wrapped=!0),o.set(e.name,r),s==="accessor"){const{name:n}=e;return{set(l){const a=t.get.call(this);t.set.call(this,l),this.requestUpdate(n,a,r,!0,l)},init(l){return l!==void 0&&this.C(n,void 0,r,l),l}}}if(s==="setter"){const{name:n}=e;return function(l){const a=this[n];t.call(this,l),this.requestUpdate(n,a,r,!0,l)}}throw Error("Unsupported decorator location: "+s)};function A(r){return(t,e)=>typeof e=="object"?Ht(r,t,e):((s,i,o)=>{const n=i.hasOwnProperty(o);return i.constructor.createProperty(o,s),n?Object.getOwnPropertyDescriptor(i,o):void 0})(r,t,e)}/**
|
|
28
|
+
* @license
|
|
29
|
+
* Copyright 2017 Google LLC
|
|
30
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
31
|
+
*/function z(r){return A({...r,state:!0,attribute:!1})}var Rt=Object.getOwnPropertyDescriptor,jt=(r,t,e,s)=>{for(var i=s>1?void 0:s?Rt(t,e):t,o=r.length-1,n;o>=0;o--)(n=r[o])&&(i=n(i)||i);return i};c.VibeFlags=class extends w{render(){return u`<slot></slot>`}},c.VibeFlags=jt([Z("vibe-flags")],c.VibeFlags);const U="vibe-flags:";class zt extends EventTarget{constructor(){super(...arguments),this.configs=new Map,this.state={},this.listening=!1,this.onStorageEvent=t=>{if(!t.key?.startsWith(U))return;const e=t.key.slice(U.length);if(this.configs.has(e))try{const s=t.newValue?JSON.parse(t.newValue):this.configs.get(e).default;this.state[e]=s,this.dispatch(e)}catch{}}}register(t){this.configs.set(t.key,t);const e=this.readFromStorage(t.key);this.state[t.key]=e??t.default,this.listening||(this.listening=!0,typeof window<"u"&&window.addEventListener("storage",this.onStorageEvent)),this.dispatch(t.key)}unregister(t){this.configs.delete(t),delete this.state[t],this.dispatch()}get(t){return this.state[t]}set(t,e){const s=this.configs.get(t);s&&(s.type==="boolean"&&typeof e!="boolean"||s.type==="select"&&(typeof e!="string"||!s.options.includes(e))||(this.state[t]=e,this.writeToStorage(t,e),this.dispatch(t)))}getAll(){return{...this.state}}getConfig(){return Array.from(this.configs.values())}getConfigForKey(t){return this.configs.get(t)}reset(){for(const[t,e]of this.configs)this.state[t]=e.default,this.removeFromStorage(t);this.dispatch()}readFromStorage(t){if(typeof window>"u")return null;try{const e=localStorage.getItem(U+t);return e===null?null:JSON.parse(e)}catch{return null}}writeToStorage(t,e){if(!(typeof window>"u"))try{localStorage.setItem(U+t,JSON.stringify(e))}catch{}}removeFromStorage(t){if(!(typeof window>"u"))try{localStorage.removeItem(U+t)}catch{}}dispatch(t){const e={key:t,state:this.getAll()},s=new CustomEvent("vibe-flags-changed",{detail:e,bubbles:!0});this.dispatchEvent(s),typeof window<"u"&&window.dispatchEvent(new CustomEvent("vibe-flags-changed",{detail:e}))}}const b=new zt;var Dt=Object.defineProperty,It=Object.getOwnPropertyDescriptor,$=(r,t,e,s)=>{for(var i=s>1?void 0:s?It(t,e):t,o=r.length-1,n;o>=0;o--)(n=r[o])&&(i=(s?n(t,e,i):n(i))||i);return s&&i&&Dt(t,e,i),i};c.VibeFlag=class extends w{constructor(){super(...arguments),this.key="",this.description="",this.type="boolean",this.value="true",this.defaultValue="",this.options="",this.isMatch=!1,this.registered=!1,this.onFlagChange=()=>{this.evaluate()}}connectedCallback(){super.connectedCallback(),window.addEventListener("vibe-flags-changed",this.onFlagChange),this.registerFlag(),this.evaluate()}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener("vibe-flags-changed",this.onFlagChange)}willUpdate(t){["key","description","type","defaultValue","options"].some(s=>t.has(s))&&this.registerFlag()}registerFlag(){if(!this.key)return;const t=this.type==="select"?{key:this.key,type:"select",default:this.defaultValue||this.parseOptions()[0]||"",options:this.parseOptions(),label:this.description||void 0}:{key:this.key,type:"boolean",default:this.defaultValue?this.defaultValue==="true":!1,label:this.description||void 0};b.register(t),this.registered=!0,this.evaluate()}parseOptions(){return this.options.split(",").map(t=>t.trim()).filter(Boolean)}evaluate(){const t=b.get(this.key);if(t===void 0){this.isMatch=!1;return}this.isMatch=String(t)===this.value}render(){return this.isMatch?u`<slot></slot>`:d}},$([A({type:String})],c.VibeFlag.prototype,"key",2),$([A({type:String})],c.VibeFlag.prototype,"description",2),$([A({type:String})],c.VibeFlag.prototype,"type",2),$([A({type:String})],c.VibeFlag.prototype,"value",2),$([A({type:String,attribute:"default"})],c.VibeFlag.prototype,"defaultValue",2),$([A({type:String})],c.VibeFlag.prototype,"options",2),$([z()],c.VibeFlag.prototype,"isMatch",2),c.VibeFlag=$([Z("vibe-flag")],c.VibeFlag);const Lt=Q`
|
|
32
|
+
:host {
|
|
33
|
+
--vf-bg: #ffffff;
|
|
34
|
+
--vf-bg-muted: #f5f5f5;
|
|
35
|
+
--vf-bg-hover: #f0f0f0;
|
|
36
|
+
--vf-border: #e5e5e5;
|
|
37
|
+
--vf-text: #0a0a0a;
|
|
38
|
+
--vf-text-muted: #737373;
|
|
39
|
+
--vf-primary: #171717;
|
|
40
|
+
--vf-primary-fg: #fafafa;
|
|
41
|
+
--vf-accent: #6366f1;
|
|
42
|
+
--vf-accent-fg: #ffffff;
|
|
43
|
+
--vf-destructive: #ef4444;
|
|
44
|
+
--vf-radius: 6px;
|
|
45
|
+
--vf-radius-lg: 8px;
|
|
46
|
+
--vf-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
|
|
47
|
+
'Helvetica Neue', Arial, sans-serif;
|
|
48
|
+
--vf-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1),
|
|
49
|
+
0 1px 2px -1px rgba(0, 0, 0, 0.1);
|
|
50
|
+
--vf-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1),
|
|
51
|
+
0 4px 6px -4px rgba(0, 0, 0, 0.1);
|
|
52
|
+
--vf-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1),
|
|
53
|
+
0 8px 10px -6px rgba(0, 0, 0, 0.1);
|
|
54
|
+
}
|
|
55
|
+
`;var Bt=Object.defineProperty,Wt=Object.getOwnPropertyDescriptor,D=(r,t,e,s)=>{for(var i=s>1?void 0:s?Wt(t,e):t,o=r.length-1,n;o>=0;o--)(n=r[o])&&(i=(s?n(t,e,i):n(i))||i);return s&&i&&Bt(t,e,i),i};return c.VibeToolbar=class extends w{constructor(){super(...arguments),this.open=!1,this.flags={},this.configs=[],this.onFlagChange=()=>{this.syncFromStore()}}connectedCallback(){super.connectedCallback(),window.addEventListener("vibe-flags-changed",this.onFlagChange),this.syncFromStore()}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener("vibe-flags-changed",this.onFlagChange)}syncFromStore(){this.configs=b.getConfig(),this.flags=b.getAll()}toggleSidebar(){this.open=!this.open}closeSidebar(){this.open=!1}onToggle(t){const e=this.flags[t];b.set(t,!e)}onSelect(t,e){const s=e.target;b.set(t,s.value)}onReset(){b.reset()}renderFlagIcon(){return u`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 15s1-1 4-1 5 2 8 2 4-1 4-1V3s-1 1-4 1-5-2-8-2-4 1-4 1z"/><line x1="4" y1="22" x2="4" y2="15"/></svg>`}renderCloseIcon(){return u`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>`}renderChevronDown(){return u`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>`}renderBooleanFlag(t){const e=this.flags[t.key]===!0;return u`
|
|
56
|
+
<div class="flag-item">
|
|
57
|
+
<div class="flag-row">
|
|
58
|
+
<div class="flag-info">
|
|
59
|
+
<div class="flag-label">${t.label||t.key}</div>
|
|
60
|
+
<div class="flag-key">${t.key}</div>
|
|
61
|
+
</div>
|
|
62
|
+
<label class="toggle">
|
|
63
|
+
<input
|
|
64
|
+
type="checkbox"
|
|
65
|
+
.checked=${e}
|
|
66
|
+
@change=${()=>this.onToggle(t.key)}
|
|
67
|
+
/>
|
|
68
|
+
<span class="toggle-track"></span>
|
|
69
|
+
<span class="toggle-thumb"></span>
|
|
70
|
+
</label>
|
|
71
|
+
</div>
|
|
72
|
+
</div>
|
|
73
|
+
`}renderSelectFlag(t){if(t.type!=="select")return d;const e=this.flags[t.key];return u`
|
|
74
|
+
<div class="flag-item">
|
|
75
|
+
<div class="flag-row">
|
|
76
|
+
<div class="flag-info">
|
|
77
|
+
<div class="flag-label">${t.label||t.key}</div>
|
|
78
|
+
<div class="flag-key">${t.key}</div>
|
|
79
|
+
</div>
|
|
80
|
+
<div class="select-wrapper">
|
|
81
|
+
<select
|
|
82
|
+
class="select"
|
|
83
|
+
.value=${e}
|
|
84
|
+
@change=${s=>this.onSelect(t.key,s)}
|
|
85
|
+
>
|
|
86
|
+
${t.options.map(s=>u`<option value=${s} ?selected=${s===e}>
|
|
87
|
+
${s}
|
|
88
|
+
</option>`)}
|
|
89
|
+
</select>
|
|
90
|
+
<span class="select-chevron">${this.renderChevronDown()}</span>
|
|
91
|
+
</div>
|
|
92
|
+
</div>
|
|
93
|
+
</div>
|
|
94
|
+
`}render(){return u`
|
|
95
|
+
${this.open?d:u`
|
|
96
|
+
<button class="fab" @click=${this.toggleSidebar} aria-label="Toggle feature flags">
|
|
97
|
+
${this.renderFlagIcon()}
|
|
98
|
+
</button>
|
|
99
|
+
`}
|
|
100
|
+
|
|
101
|
+
<div class="backdrop ${this.open?"open":""}" @click=${this.closeSidebar}></div>
|
|
102
|
+
|
|
103
|
+
<div class="sidebar ${this.open?"open":""}">
|
|
104
|
+
<div class="header">
|
|
105
|
+
<h2>
|
|
106
|
+
${this.renderFlagIcon()}
|
|
107
|
+
VibeFlags
|
|
108
|
+
<span class="badge">${this.configs.length}</span>
|
|
109
|
+
</h2>
|
|
110
|
+
<button class="close-btn" @click=${this.closeSidebar} aria-label="Close">
|
|
111
|
+
${this.renderCloseIcon()}
|
|
112
|
+
</button>
|
|
113
|
+
</div>
|
|
114
|
+
|
|
115
|
+
<div class="flags">
|
|
116
|
+
${this.configs.length===0?u`<div class="empty">No flags configured</div>`:this.configs.map(t=>t.type==="boolean"?this.renderBooleanFlag(t):this.renderSelectFlag(t))}
|
|
117
|
+
</div>
|
|
118
|
+
|
|
119
|
+
<div class="footer">
|
|
120
|
+
<button class="reset-btn" @click=${this.onReset}>
|
|
121
|
+
Reset all to defaults
|
|
122
|
+
</button>
|
|
123
|
+
</div>
|
|
124
|
+
</div>
|
|
125
|
+
`}},c.VibeToolbar.styles=[Lt,Q`
|
|
126
|
+
* {
|
|
127
|
+
box-sizing: border-box;
|
|
128
|
+
margin: 0;
|
|
129
|
+
padding: 0;
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
.fab {
|
|
133
|
+
position: fixed;
|
|
134
|
+
right: 0;
|
|
135
|
+
top: 50%;
|
|
136
|
+
transform: translateY(-50%);
|
|
137
|
+
z-index: 99999;
|
|
138
|
+
width: 40px;
|
|
139
|
+
height: 44px;
|
|
140
|
+
border: 1px solid var(--vf-border);
|
|
141
|
+
border-right: none;
|
|
142
|
+
border-radius: var(--vf-radius-lg) 0 0 var(--vf-radius-lg);
|
|
143
|
+
background: var(--vf-bg);
|
|
144
|
+
color: var(--vf-text);
|
|
145
|
+
cursor: pointer;
|
|
146
|
+
display: flex;
|
|
147
|
+
align-items: center;
|
|
148
|
+
justify-content: center;
|
|
149
|
+
box-shadow: var(--vf-shadow-lg);
|
|
150
|
+
transition: all 0.2s ease;
|
|
151
|
+
font-family: var(--vf-font);
|
|
152
|
+
}
|
|
153
|
+
|
|
154
|
+
.fab:hover {
|
|
155
|
+
width: 46px;
|
|
156
|
+
background: var(--vf-bg-muted);
|
|
157
|
+
}
|
|
158
|
+
|
|
159
|
+
.fab svg {
|
|
160
|
+
width: 20px;
|
|
161
|
+
height: 20px;
|
|
162
|
+
flex-shrink: 0;
|
|
163
|
+
}
|
|
164
|
+
|
|
165
|
+
.backdrop {
|
|
166
|
+
position: fixed;
|
|
167
|
+
inset: 0;
|
|
168
|
+
z-index: 100000;
|
|
169
|
+
background: rgba(0, 0, 0, 0.4);
|
|
170
|
+
opacity: 0;
|
|
171
|
+
transition: opacity 0.3s ease;
|
|
172
|
+
pointer-events: none;
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
.backdrop.open {
|
|
176
|
+
opacity: 1;
|
|
177
|
+
pointer-events: auto;
|
|
178
|
+
}
|
|
179
|
+
|
|
180
|
+
.sidebar {
|
|
181
|
+
position: fixed;
|
|
182
|
+
top: 0;
|
|
183
|
+
right: 0;
|
|
184
|
+
bottom: 0;
|
|
185
|
+
z-index: 100001;
|
|
186
|
+
width: 340px;
|
|
187
|
+
max-width: 90vw;
|
|
188
|
+
background: var(--vf-bg);
|
|
189
|
+
border-left: 1px solid var(--vf-border);
|
|
190
|
+
box-shadow: var(--vf-shadow-xl);
|
|
191
|
+
transform: translateX(100%);
|
|
192
|
+
transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
|
193
|
+
display: flex;
|
|
194
|
+
flex-direction: column;
|
|
195
|
+
font-family: var(--vf-font);
|
|
196
|
+
color: var(--vf-text);
|
|
197
|
+
}
|
|
198
|
+
|
|
199
|
+
.sidebar.open {
|
|
200
|
+
transform: translateX(0);
|
|
201
|
+
}
|
|
202
|
+
|
|
203
|
+
.header {
|
|
204
|
+
display: flex;
|
|
205
|
+
align-items: center;
|
|
206
|
+
justify-content: space-between;
|
|
207
|
+
padding: 16px 20px;
|
|
208
|
+
border-bottom: 1px solid var(--vf-border);
|
|
209
|
+
flex-shrink: 0;
|
|
210
|
+
}
|
|
211
|
+
|
|
212
|
+
.header h2 {
|
|
213
|
+
font-size: 16px;
|
|
214
|
+
font-weight: 600;
|
|
215
|
+
letter-spacing: -0.025em;
|
|
216
|
+
display: flex;
|
|
217
|
+
align-items: center;
|
|
218
|
+
gap: 8px;
|
|
219
|
+
}
|
|
220
|
+
|
|
221
|
+
.header h2 svg {
|
|
222
|
+
width: 18px;
|
|
223
|
+
height: 18px;
|
|
224
|
+
color: var(--vf-accent);
|
|
225
|
+
}
|
|
226
|
+
|
|
227
|
+
.badge {
|
|
228
|
+
font-size: 11px;
|
|
229
|
+
font-weight: 500;
|
|
230
|
+
padding: 2px 7px;
|
|
231
|
+
border-radius: 9999px;
|
|
232
|
+
background: var(--vf-bg-muted);
|
|
233
|
+
color: var(--vf-text-muted);
|
|
234
|
+
border: 1px solid var(--vf-border);
|
|
235
|
+
}
|
|
236
|
+
|
|
237
|
+
.close-btn {
|
|
238
|
+
width: 32px;
|
|
239
|
+
height: 32px;
|
|
240
|
+
border: none;
|
|
241
|
+
border-radius: var(--vf-radius);
|
|
242
|
+
background: transparent;
|
|
243
|
+
color: var(--vf-text-muted);
|
|
244
|
+
cursor: pointer;
|
|
245
|
+
display: flex;
|
|
246
|
+
align-items: center;
|
|
247
|
+
justify-content: center;
|
|
248
|
+
transition: all 0.15s ease;
|
|
249
|
+
}
|
|
250
|
+
|
|
251
|
+
.close-btn:hover {
|
|
252
|
+
background: var(--vf-bg-muted);
|
|
253
|
+
color: var(--vf-text);
|
|
254
|
+
}
|
|
255
|
+
|
|
256
|
+
.close-btn svg {
|
|
257
|
+
width: 16px;
|
|
258
|
+
height: 16px;
|
|
259
|
+
}
|
|
260
|
+
|
|
261
|
+
.flags {
|
|
262
|
+
flex: 1;
|
|
263
|
+
overflow-y: auto;
|
|
264
|
+
padding: 8px 0;
|
|
265
|
+
}
|
|
266
|
+
|
|
267
|
+
.flag-item {
|
|
268
|
+
padding: 12px 20px;
|
|
269
|
+
transition: background 0.1s ease;
|
|
270
|
+
}
|
|
271
|
+
|
|
272
|
+
.flag-item:hover {
|
|
273
|
+
background: var(--vf-bg-muted);
|
|
274
|
+
}
|
|
275
|
+
|
|
276
|
+
.flag-item + .flag-item {
|
|
277
|
+
border-top: 1px solid var(--vf-border);
|
|
278
|
+
}
|
|
279
|
+
|
|
280
|
+
.flag-label {
|
|
281
|
+
font-size: 13px;
|
|
282
|
+
font-weight: 500;
|
|
283
|
+
margin-bottom: 2px;
|
|
284
|
+
}
|
|
285
|
+
|
|
286
|
+
.flag-key {
|
|
287
|
+
font-size: 11px;
|
|
288
|
+
color: var(--vf-text-muted);
|
|
289
|
+
font-family: 'SF Mono', 'Fira Code', 'Fira Mono', Menlo, Consolas,
|
|
290
|
+
monospace;
|
|
291
|
+
}
|
|
292
|
+
|
|
293
|
+
.flag-row {
|
|
294
|
+
display: flex;
|
|
295
|
+
align-items: center;
|
|
296
|
+
justify-content: space-between;
|
|
297
|
+
gap: 12px;
|
|
298
|
+
}
|
|
299
|
+
|
|
300
|
+
.flag-info {
|
|
301
|
+
min-width: 0;
|
|
302
|
+
flex: 1;
|
|
303
|
+
}
|
|
304
|
+
|
|
305
|
+
/* Toggle switch */
|
|
306
|
+
.toggle {
|
|
307
|
+
position: relative;
|
|
308
|
+
width: 40px;
|
|
309
|
+
height: 22px;
|
|
310
|
+
flex-shrink: 0;
|
|
311
|
+
}
|
|
312
|
+
|
|
313
|
+
.toggle input {
|
|
314
|
+
opacity: 0;
|
|
315
|
+
width: 0;
|
|
316
|
+
height: 0;
|
|
317
|
+
position: absolute;
|
|
318
|
+
}
|
|
319
|
+
|
|
320
|
+
.toggle-track {
|
|
321
|
+
position: absolute;
|
|
322
|
+
inset: 0;
|
|
323
|
+
border-radius: 11px;
|
|
324
|
+
background: var(--vf-border);
|
|
325
|
+
cursor: pointer;
|
|
326
|
+
transition: background 0.2s ease;
|
|
327
|
+
}
|
|
328
|
+
|
|
329
|
+
.toggle input:checked + .toggle-track {
|
|
330
|
+
background: var(--vf-primary);
|
|
331
|
+
}
|
|
332
|
+
|
|
333
|
+
.toggle-thumb {
|
|
334
|
+
position: absolute;
|
|
335
|
+
top: 2px;
|
|
336
|
+
left: 2px;
|
|
337
|
+
width: 18px;
|
|
338
|
+
height: 18px;
|
|
339
|
+
border-radius: 50%;
|
|
340
|
+
background: white;
|
|
341
|
+
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
|
|
342
|
+
transition: transform 0.2s ease;
|
|
343
|
+
pointer-events: none;
|
|
344
|
+
}
|
|
345
|
+
|
|
346
|
+
.toggle input:checked ~ .toggle-thumb {
|
|
347
|
+
transform: translateX(18px);
|
|
348
|
+
}
|
|
349
|
+
|
|
350
|
+
/* Select dropdown */
|
|
351
|
+
.select-wrapper {
|
|
352
|
+
position: relative;
|
|
353
|
+
flex-shrink: 0;
|
|
354
|
+
}
|
|
355
|
+
|
|
356
|
+
.select {
|
|
357
|
+
appearance: none;
|
|
358
|
+
-webkit-appearance: none;
|
|
359
|
+
font-size: 13px;
|
|
360
|
+
font-family: var(--vf-font);
|
|
361
|
+
padding: 6px 30px 6px 10px;
|
|
362
|
+
border: 1px solid var(--vf-border);
|
|
363
|
+
border-radius: var(--vf-radius);
|
|
364
|
+
background: var(--vf-bg);
|
|
365
|
+
color: var(--vf-text);
|
|
366
|
+
cursor: pointer;
|
|
367
|
+
outline: none;
|
|
368
|
+
min-width: 100px;
|
|
369
|
+
transition: border-color 0.15s ease;
|
|
370
|
+
}
|
|
371
|
+
|
|
372
|
+
.select:hover {
|
|
373
|
+
border-color: var(--vf-text-muted);
|
|
374
|
+
}
|
|
375
|
+
|
|
376
|
+
.select:focus {
|
|
377
|
+
border-color: var(--vf-accent);
|
|
378
|
+
box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.15);
|
|
379
|
+
}
|
|
380
|
+
|
|
381
|
+
.select-chevron {
|
|
382
|
+
position: absolute;
|
|
383
|
+
right: 8px;
|
|
384
|
+
top: 50%;
|
|
385
|
+
transform: translateY(-50%);
|
|
386
|
+
pointer-events: none;
|
|
387
|
+
color: var(--vf-text-muted);
|
|
388
|
+
}
|
|
389
|
+
|
|
390
|
+
.select-chevron svg {
|
|
391
|
+
width: 14px;
|
|
392
|
+
height: 14px;
|
|
393
|
+
}
|
|
394
|
+
|
|
395
|
+
/* Footer */
|
|
396
|
+
.footer {
|
|
397
|
+
padding: 12px 20px;
|
|
398
|
+
border-top: 1px solid var(--vf-border);
|
|
399
|
+
flex-shrink: 0;
|
|
400
|
+
}
|
|
401
|
+
|
|
402
|
+
.reset-btn {
|
|
403
|
+
width: 100%;
|
|
404
|
+
padding: 8px 16px;
|
|
405
|
+
font-size: 13px;
|
|
406
|
+
font-weight: 500;
|
|
407
|
+
font-family: var(--vf-font);
|
|
408
|
+
border: 1px solid var(--vf-border);
|
|
409
|
+
border-radius: var(--vf-radius);
|
|
410
|
+
background: var(--vf-bg);
|
|
411
|
+
color: var(--vf-text);
|
|
412
|
+
cursor: pointer;
|
|
413
|
+
transition: all 0.15s ease;
|
|
414
|
+
}
|
|
415
|
+
|
|
416
|
+
.reset-btn:hover {
|
|
417
|
+
background: var(--vf-bg-muted);
|
|
418
|
+
border-color: var(--vf-text-muted);
|
|
419
|
+
}
|
|
420
|
+
|
|
421
|
+
.empty {
|
|
422
|
+
padding: 40px 20px;
|
|
423
|
+
text-align: center;
|
|
424
|
+
color: var(--vf-text-muted);
|
|
425
|
+
font-size: 13px;
|
|
426
|
+
}
|
|
427
|
+
`],D([z()],c.VibeToolbar.prototype,"open",2),D([z()],c.VibeToolbar.prototype,"flags",2),D([z()],c.VibeToolbar.prototype,"configs",2),c.VibeToolbar=D([Z("vibe-toolbar")],c.VibeToolbar),c.flagStore=b,Object.defineProperty(c,Symbol.toStringTag,{value:"Module"}),c})({});
|