react-winplaza-98
Version:
React components with a Win98 a e s t h e c t i c
3 lines (2 loc) • 3.38 kB
JavaScript
import e,{forwardRef as t,createContext as n,useContext as a,useId as l}from"react";function r(e){var t,n,a="";if("string"==typeof e||"number"==typeof e)a+=e;else if("object"==typeof e)if(Array.isArray(e))for(t=0;t<e.length;t++)e[t]&&(n=r(e[t]))&&(a&&(a+=" "),a+=n);else for(t in e)e[t]&&(a&&(a+=" "),a+=t);return a}function o(){for(var e,t,n=0,a="";n<arguments.length;)(e=arguments[n++])&&(t=r(e))&&(a&&(a+=" "),a+=t);return a}!function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var a=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===n&&a.firstChild?a.insertBefore(l,a.firstChild):a.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("button.focused {\n outline: 1px dotted black;\n outline-offset: -4px;\n}\n\nbutton.active {\n box-shadow: inset -1px -1px #fff, inset 1px 1px #0a0a0a,\n inset -2px -2px #dfdfdf, inset 2px 2px #808080;\n}\n");const c=({active:t,children:n,className:a,focused:l,...r})=>e.createElement("button",{...r,className:o(a,t&&"active",l&&"focused")},n),i=t((({name:t,label:n,...a},l)=>e.createElement(e.Fragment,null,e.createElement("input",{type:"checkbox",name:t,id:t,...a,ref:l}),e.createElement("label",{htmlFor:t},n)))),m=t((({name:t,label:n,children:a,...l},r)=>e.createElement("select",{ref:r,name:t,...l},a))),d=({label:t,children:n})=>e.createElement("fieldset",null,t&&e.createElement("legend",null,t),n);d.displayName="GroupBox";const s=n(void 0),f=t=>e.createElement(s.Provider,{value:t},t.children),u=t((({label:t,...n},r)=>{const o=l(),{name:c,value:i,onChange:m,defaultValue:d}=(()=>{const e=a(s);if(void 0===e)throw new Error("The OptionButton compound components cannot be rendered outside the OptionGroup component");return e})();return e.createElement("div",{className:"field-row"},e.createElement("input",{id:o,type:"radio",name:c,...n,ref:r,defaultChecked:d?d===n.value:void 0,checked:i?i===n.value:void 0,onChange:e=>m?.(e.target.value)}),e.createElement("label",{htmlFor:o},t))})),p=t((({name:t,label:n,minLabel:a,maxLabel:r,min:c,max:i,className:m,boxIndicator:d=!1,vertical:s=!1,onChange:f,...u},p)=>{const h=l();return e.createElement("div",{className:"field-row"},e.createElement("label",{htmlFor:`${h}-label`},n),a&&e.createElement("label",{htmlFor:h},a),e.createElement("div",{className:o(s&&"is-vertical")},e.createElement("input",{...u,ref:p,onChange:e=>{f?.(e,Number(e.target.value))},className:o(m,{"has-box-indicator":d}),id:h,name:t,type:"range",min:c,max:i})),r&&e.createElement("label",{htmlFor:`${h}-high`},r))})),h=t((({name:t,label:n,labelPosition:a="top",className:r,...c},i)=>{const m=l();return e.createElement("div",{className:o(r,{"field-row":"left"===a,"field-row-stacked":"top"===a})},e.createElement("label",{htmlFor:m},n),e.createElement("textarea",{ref:i,id:m,name:t,...c}))})),b=t((function({type:t="text",name:n,label:a,labelPosition:r="left",className:c,...i},m){const d=l();return e.createElement("div",{className:o(c,{"field-row":"left"===r,"field-row-stacked":"top"===r})},e.createElement("label",{htmlFor:d},a),e.createElement("input",{id:d,name:n,type:t,ref:m,...i}))}));export{c as Button,i as Checkbox,m as Dropdown,d as GroupBox,u as OptionButton,f as OptionGroup,p as Slider,h as TextArea,b as TextBox};
//# sourceMappingURL=index.js.map