tweakpane-plugin-chromatic/dist/tweakpane-plugin-chromatic.min.js

Color palette viewer for Tweakpane

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).TweakpaneChromaticPlugin={})}(this,(function(e){"use strict";class t{constructor(e){this.controller_=e}get element(){return this.controller_.view.element}get disabled(){return this.controller_.viewProps.get("disabled")}set disabled(e){this.controller_.viewProps.set("disabled",e)}get hidden(){return this.controller_.viewProps.get("hidden")}set hidden(e){this.controller_.viewProps.set("hidden",e)}dispose(){this.controller_.viewProps.set("disposed",!0)}}function s(e){return null==e}class r{constructor(){this.observers_={}}on(e,t){let s=this.observers_[e];return s||(s=this.observers_[e]=[]),s.push({handler:t}),this}off(e,t){const s=this.observers_[e];return s&&(this.observers_[e]=s.filter((e=>e.handler!==t))),this}emit(e,t){const s=this.observers_[e];s&&s.forEach((e=>{e.handler(t)}))}}const n="tp";function i(e){return(t,s)=>[n,"-",e,"v",t?`_${t}`:"",s?`-${s}`:""].join("")}function o(e){return e.rawValue}function a(e,t){var s,r;e.emitter.on("change",(s=o,r=t,e=>r(s(e)))),t(e.rawValue)}function l(e,t,s){a(e.value(t),s)}class c{constructor(e,t){var s;this.constraint_=null==t?void 0:t.constraint,this.equals_=null!==(s=null==t?void 0:t.equals)&&void 0!==s?s:(e,t)=>e===t,this.emitter=new r,this.rawValue_=e}get constraint(){return this.constraint_}get rawValue(){return this.rawValue_}set rawValue(e){this.setRawValue(e,{forceEmit:!1,last:!0})}setRawValue(e,t){const s=null!=t?t:{forceEmit:!1,last:!0},r=this.constraint_?this.constraint_.constrain(e):e,n=this.rawValue_;(!this.equals_(n,r)||s.forceEmit)&&(this.emitter.emit("beforechange",{sender:this}),this.rawValue_=r,this.emitter.emit("change",{options:s,previousRawValue:n,rawValue:r,sender:this}))}}class d{constructor(e){this.emitter=new r,this.value_=e}get rawValue(){return this.value_}set rawValue(e){this.setRawValue(e,{forceEmit:!1,last:!0})}setRawValue(e,t){const s=null!=t?t:{forceEmit:!1,last:!0},r=this.value_;(r!==e||s.forceEmit)&&(this.emitter.emit("beforechange",{sender:this}),this.value_=e,this.emitter.emit("change",{options:s,previousRawValue:r,rawValue:this.value_,sender:this}))}}function u(e,t){const s=null==t?void 0:t.constraint,r=null==t?void 0:t.equals;return s||r?new c(e,t):new d(e)}class h{constructor(e){this.emitter=new r,this.valMap_=e;for(const e in this.valMap_){this.valMap_[e].emitter.on("change",(()=>{this.emitter.emit("change",{key:e,sender:this})}))}}static createCore(e){return Object.keys(e).reduce(((t,s)=>Object.assign(t,{[s]:u(e[s])})),{})}static fromObject(e){const t=this.createCore(e);return new h(t)}get(e){return this.valMap_[e].rawValue}set(e,t){this.valMap_[e].rawValue=t}value(e){return this.valMap_[e]}}function p(e){return t=>s=>{if(!t&&void 0===s)return{succeeded:!1,value:void 0};if(t&&void 0===s)return{succeeded:!0,value:void 0};const r=e(s);return void 0!==r?{succeeded:!0,value:r}:{succeeded:!1,value:void 0}}}function v(e){return{custom:t=>p(t)(e),boolean:p((e=>"boolean"==typeof e?e:void 0))(e),number:p((e=>"number"==typeof e?e:void 0))(e),string:p((e=>"string"==typeof e?e:void 0))(e),function:p((e=>"function"==typeof e?e:void 0))(e),constant:t=>p((e=>e===t?t:void 0))(e),raw:p((e=>e))(e),object:t=>p((e=>{var s;if(null!==(s=e)&&"object"==typeof s)return function(e,t){return Object.keys(t).reduce(((s,r)=>{if(void 0===s)return;const n=(0,t[r])(e[r]);return n.succeeded?Object.assign(Object.assign({},s),{[r]:n.value}):void 0}),{})}(e,t)}))(e),array:t=>p((e=>{var s;if(Array.isArray(e))return s=t,e.reduce(((e,t)=>{if(void 0===e)return;const r=s(t);return r.succeeded&&void 0!==r.value?[...e,r.value]:void 0}),[])}))(e)}}const b={optional:v(!0),required:v(!1)};class m{constructor(e){this.value_=e}static create(e){return[new m(e),(t,s)=>{e.setRawValue(t,s)}]}get emitter(){return this.value_.emitter}get rawValue(){return this.value_.rawValue}}const g=i("");function f(e,t){return function(e,t){return s=>{!function(e,t,s){s?e.classList.add(t):e.classList.remove(t)}(e,t,s)}}(e,g(void 0,t))}class _ extends h{constructor(e){var t;super(e),this.onDisabledChange_=this.onDisabledChange_.bind(this),this.onParentChange_=this.onParentChange_.bind(this),this.onParentGlobalDisabledChange_=this.onParentGlobalDisabledChange_.bind(this),[this.globalDisabled_,this.setGlobalDisabled_]=m.create(u(this.getGlobalDisabled_())),this.value("disabled").emitter.on("change",this.onDisabledChange_),this.value("parent").emitter.on("change",this.onParentChange_),null===(t=this.get("parent"))||void 0===t||t.globalDisabled.emitter.on("change",this.onParentGlobalDisabledChange_)}static create(e){var t,s,r;const n=null!=e?e:{};return new _(h.createCore({disabled:null!==(t=n.disabled)&&void 0!==t&&t,disposed:!1,hidden:null!==(s=n.hidden)&&void 0!==s&&s,parent:null!==(r=n.parent)&&void 0!==r?r:null}))}get globalDisabled(){return this.globalDisabled_}bindClassModifiers(e){a(this.globalDisabled_,f(e,"disabled")),l(this,"hidden",f(e,"hidden"))}bindDisabled(e){a(this.globalDisabled_,(t=>{e.disabled=t}))}bindTabIndex(e){a(this.globalDisabled_,(t=>{e.tabIndex=t?-1:0}))}handleDispose(e){this.value("disposed").emitter.on("change",(t=>{t&&e()}))}getGlobalDisabled_(){const e=this.get("parent");return!!e&&e.globalDisabled.rawValue||this.get("disabled")}updateGlobalDisabled_(){this.setGlobalDisabled_(this.getGlobalDisabled_())}onDisabledChange_(){this.updateGlobalDisabled_()}onParentGlobalDisabledChange_(){this.updateGlobalDisabled_()}onParentChange_(e){var t;const s=e.previousRawValue;null==s||s.globalDisabled.emitter.off("change",this.onParentGlobalDisabledChange_),null===(t=this.get("parent"))||void 0===t||t.globalDisabled.emitter.on("change",this.onParentGlobalDisabledChange_),this.updateGlobalDisabled_()}}const w=i(""),C={veryfirst:"vfst",first:"fst",last:"lst",verylast:"vlst"};class P{constructor(e){this.parent_=null,this.blade=e.blade,this.view=e.view,this.viewProps=e.viewProps;const t=this.view.element;this.blade.value("positions").emitter.on("change",(()=>{["veryfirst","first","last","verylast"].forEach((e=>{t.classList.remove(w(void 0,C[e]))})),this.blade.get("positions").forEach((e=>{t.classList.add(w(void 0,C[e]))}))})),this.viewProps.handleDispose((()=>{!function(e){e&&e.parentElement&&e.parentElement.removeChild(e)}(t)}))}get parent(){return this.parent_}set parent(e){if(this.parent_=e,!("parent"in this.viewProps.valMap_))return t={key:"parent",target:_.name,place:"BladeController.parent"},void console.warn([`Missing '${t.key}' of ${t.target} in ${t.place}.`,"Please rebuild plugins with the latest core package."].join(" "));var t;this.viewProps.set("parent",this.parent_?this.parent_.viewProps:null)}}function D(e){for(;e.childNodes.length>0;)e.removeChild(e.childNodes[0])}const y=i("lbl");class V{constructor(e,t){this.element=e.createElement("div"),this.element.classList.add(y()),t.viewProps.bindClassModifiers(this.element);const r=e.createElement("div");r.classList.add(y("l")),l(t.props,"label",(t=>{s(t)?this.element.classList.add(y(void 0,"nol")):(this.element.classList.remove(y(void 0,"nol")),D(r),r.appendChild(function(e,t){const s=e.createDocumentFragment();return t.split("\n").map((t=>e.createTextNode(t))).forEach(((t,r)=>{r>0&&s.appendChild(e.createElement("br")),s.appendChild(t)})),s}(e,t)))})),this.element.appendChild(r),this.labelElement=r;const n=e.createElement("div");n.classList.add(y("v")),this.element.appendChild(n),this.valueElement=n}}class j extends P{constructor(e,t){const s=t.valueController.viewProps;super(Object.assign(Object.assign({},t),{view:new V(e,{props:t.props,viewProps:s}),viewProps:s})),this.props=t.props,this.valueController=t.valueController,this.view.valueElement.appendChild(this.valueController.view.element)}}function E(e){return t=>t.toFixed(Math.max(Math.min(e,20),0))}E(0);function G(e){return[e[0],e[1],e[2]]}function M(e){return t=>function(e,t){const s=E("float"===t?2:0);return`rgb(${G(e.getComponents("rgb",t)).map((e=>s(e))).join(", ")})`}(t,e)}function x(e){return t=>function(e,t){const s=E(2),r=E("float"===t?2:0);return`rgba(${e.getComponents("rgb",t).map(((e,t)=>(3===t?s:r)(e))).join(", ")})`}(t,e)}function $(e){return t=>function(e,t){const s=E("float"===t?2:0),r=["r","g","b"];return`{${G(e.getComponents("rgb",t)).map(((e,t)=>`${r[t]}: ${s(e)}`)).join(", ")}}`}(t,e)}function L(e){return t=>function(e,t){const s=E(2),r=E("float"===t?2:0),n=["r","g","b","a"];return`{${e.getComponents("rgb",t).map(((e,t)=>`${n[t]}: ${(3===t?s:r)(e)}`)).join(", ")}}`}(t,e)}["int","float"].reduce(((e,t)=>[...e,{format:{alpha:!1,mode:"rgb",notation:"func",type:t},stringifier:M(t)},{format:{alpha:!0,mode:"rgb",notation:"func",type:t},stringifier:x(t)},{format:{alpha:!1,mode:"rgb",notation:"object",type:t},stringifier:$(t)},{format:{alpha:!0,mode:"rgb",notation:"object",type:t},stringifier:L(t)}]),[]);class O extends t{get label(){return this.controller_.props.get("label")}set label(e){this.controller_.props.set("label",e)}get colors(){return this.controller_.valueController.props.get("colors")}set colors(e){this.controller_.valueController.props.set("colors",e)}}const q=i("chrom");class k{constructor(e,t){this.element=e.createElement("div"),this.element.classList.add(q()),t.viewProps.bindClassModifiers(this.element),l(t.props,"colors",(r=>{if(s(r))D(this.element);else{D(this.element);t.props.value("colors").rawValue.forEach((t=>{const s=e.createElement("div");s.classList.add(q("col")),s.style.backgroundColor=t,this.element.appendChild(s)}))}})),t.viewProps.handleDispose((()=>{}))}}class R{constructor(e,t){this.props=t.props,this.viewProps=t.viewProps,this.view=new k(e,{props:this.props,viewProps:this.viewProps})}}const T=[{id:"blade-chromatic",type:"blade",css:".tp-chromv{cursor:pointer;display:grid;grid-template-columns:repeat(10, 1fr);height:var(--bld-us);overflow:hidden;position:relative;-moz-column-gap:1px;column-gap:1px;align-items:center}.tp-chromv.tp-v-disabled{opacity:.5}.tp-chromv_col{height:60%}",accept(e){const t=b,s=function(e,t){const s=b.required.object(t)(e);return s.succeeded?s.value:void 0}(e,{view:t.required.constant("chromatic"),colors:t.required.array(t.required.string),label:t.optional.string});return s?{params:s}:null},controller(e){const t=new R(e.document,{props:h.fromObject({colors:e.params.colors}),viewProps:e.viewProps});return new j(e.document,{blade:e.blade,props:h.fromObject({label:e.params.label}),valueController:t})},api:e=>e.controller instanceof j&&e.controller.valueController instanceof R?new O(e.controller):null}];e.plugins=T,Object.defineProperty(e,"__esModule",{value:!0})}));