rte-utils 1.2.6 → 1.2.7
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/components/ProductionUnit.d.ts +2 -2
- package/dist/index.esm.js +1 -1
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
interface ProductionUnitProps {
|
|
2
|
-
onChangeInput?: (value:
|
|
2
|
+
onChangeInput?: (value: number) => void;
|
|
3
3
|
onChangeSwitch?: (checked: boolean) => void;
|
|
4
|
-
value?:
|
|
4
|
+
value?: number;
|
|
5
5
|
checked?: boolean;
|
|
6
6
|
}
|
|
7
7
|
export declare const ProductionUnit: ({ onChangeInput, onChangeSwitch, value, checked, }: ProductionUnitProps) => import("react/jsx-runtime").JSX.Element;
|
package/dist/index.esm.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as t,jsx as o}from"react/jsx-runtime";import{useState as a,useRef as c,useEffect as n}from"react";var i=function(i){var e=i.label,l=i.value,r=void 0===l?"":l,s=i.onChange,h=i.type,d=void 0===h?"text":h,m=i.disabled,u=void 0!==m&&m,v=i.error,p=i.className,f=void 0===p?"":p,b=i.required,g=void 0!==b&&b,N=a(r),w=N[0],L=N[1],R=a(!1),z=R[0],C=R[1],x=c(null);n(function(){L(r)},[r]);var y=["input-container",z?"input-container--focused":"",z||w.length>0?"input-container--floating":"",v?"input-container--error":"",u?"input-container--disabled":"",f].filter(Boolean).join(" ");return t("div",{className:y,children:[t("div",{className:"input-field",children:[o("input",{ref:x,type:d,value:w,onChange:function(t){var o=t.target.value;L(o),null==s||s(o)},onFocus:function(){C(!0)},onBlur:function(){C(!1)},disabled:u,required:g,className:"input-element","aria-label":e}),t("label",{className:"input-label",children:[e,g&&o("span",{className:"input-required",children:"*"})]})]}),v&&o("div",{className:"input-error",children:v})]})},e=function(c){var n=c.checked,i=void 0!==n&&n,e=c.onChange,l=c.disabled,r=void 0!==l&&l,s=c.size,h=void 0===s?"medium":s,d=c.label,m=c.className,u=void 0===m?"":m,v=c.showIcon,p=void 0===v||v,f=a(i),b=f[0],g=f[1],N=["switch","switch--".concat(h),b?"switch--checked":"",r?"switch--disabled":"",u].filter(Boolean).join(" ");return t("div",{className:"switch-container",children:[d&&o("label",{className:"switch-label",htmlFor:"switch-".concat(Math.random()),children:d}),t("div",{className:"switch-wrapper",children:[p&&o("div",{className:"switch-icon",children:o("img",{alt:"Power icon",src:b?"http://localhost:3845/assets/86c15ca80cb444eb8cc1db3e8335b63ac51c31a9.svg":"http://localhost:3845/assets/ad7677e073e42d60a4ed84f42b17c5e56222a75d.svg",className:"switch-power-icon"})}),o("button",{type:"button",role:"switch","aria-checked":b,className:N,onClick:function(){if(!r){var t=!b;g(t),null==e||e(t)}},disabled:r,children:o("span",{className:"switch-track",children:t("span",{className:"switch-thumb",children:[b&&o("img",{alt:"",src:"http://localhost:3845/assets/25f95806464af11dea630fdf68fa80d5415c7da4.svg",className:"switch-thumb-icon"}),!b&&o("img",{alt:"",src:"http://localhost:3845/assets/164245110dc3649da31e9ff08005286a44c3c907.svg",className:"switch-thumb-icon"})]})})})]})]})},l=function(a){var c=a.onChangeInput,n=a.onChangeSwitch,l=a.value,r=a.checked;return t("div",{className:"production-unit-container",children:[o(i,{label:"Production Unit",type:"number",onChange:c,value:l}),o(e,{label:"Production Unit",checked:r,onChange:n,className:"production-unit-switch"})]})},r=function(c){var i,e,l,r,s=c.max,h=c.relative,d=c.barHeight,m=void 0===d?103:d,u=c.barWidth,v=void 0===u?32:u,p=c.orientation,f=void 0===p?"vertical":p,b=c.cornerRadius,g=c.children,N=a(0),w=N[0],L=N[1],R=a(0),z=R[0],C=R[1],x=Math.min(h.value/s.value*100,100)/100*m,y=Math.min(h.value/s.value*100,100)/100*v;n(function(){L(0),C(0);var t=Date.now(),o=function(){var a=Date.now()-t,c=Math.min(a/1e3,1),n=1-Math.pow(1-c,4);L(x*n),C(y*n),c<1&&requestAnimationFrame(o)};requestAnimationFrame(o)},[x,y]);var k="horizontal"===f?m:v,M="horizontal"===f?v:m,q="horizontal"===f?m:v,B="horizontal"===f?v:m,F=function(t,o,a,c,n){var i=n.topLeft,e=n.topRight,l=n.bottomLeft,r=n.bottomRight;return"\n M ".concat(t+i," ").concat(o,"\n L ").concat(t+a-e," ").concat(o,"\n Q ").concat(t+a," ").concat(o," ").concat(t+a," ").concat(o+e,"\n L ").concat(t+a," ").concat(o+c-r,"\n Q ").concat(t+a," ").concat(o+c," ").concat(t+a-r," ").concat(o+c,"\n L ").concat(t+l," ").concat(o+c,"\n Q ").concat(t," ").concat(o+c," ").concat(t," ").concat(o+c-l,"\n L ").concat(t," ").concat(o+i,"\n Q ").concat(t," ").concat(o," ").concat(t+i," ").concat(o,"\n Z\n ").trim().replace(/\s+/g," ")},Q={topLeft:2,topRight:2,bottomLeft:2,bottomRight:2},j=b?{topLeft:null!==(i=b.topLeft)&&void 0!==i?i:Q.topLeft,topRight:null!==(e=b.topRight)&&void 0!==e?e:Q.topRight,bottomLeft:null!==(l=b.bottomLeft)&&void 0!==l?l:Q.bottomLeft,bottomRight:null!==(r=b.bottomRight)&&void 0!==r?r:Q.bottomRight}:Q;return o("div",{className:"histogram-container ".concat("horizontal"===f?"histogram-container--horizontal":""),children:t("div",{className:"histogram-content ".concat("horizontal"===f?"histogram-content--horizontal":""),children:[o("div",{className:"histogram-bar",style:{height:"".concat(M,"px"),width:"".concat(k,"px")},children:t("svg",{width:q,height:B,viewBox:"0 0 ".concat(q," ").concat(B),className:"histogram-svg",children:[o("path",{d:F(0,0,q,B,j),fill:s.color,fillOpacity:s.opacity||1}),o("path","vertical"===f?{d:F(0,B-w,q,w,{topLeft:w>=B?j.topLeft:0,topRight:w>=B?j.topRight:0,bottomLeft:j.bottomLeft,bottomRight:j.bottomRight}),fill:h.color}:{d:F(0,0,z,B,{topLeft:j.topLeft,topRight:z>=q?j.topRight:0,bottomLeft:j.bottomLeft,bottomRight:z>=q?j.bottomRight:0}),fill:h.color})]})}),g&&o("div",{className:"histogram-text-container ".concat("horizontal"===f?"histogram-text-container--horizontal":""),children:g})]})})},s=function(t){var a=t.label,c=t.bgColor,n=t.textColor;return o("div",{className:"chip-container",style:{backgroundColor:c},children:o("div",{className:"chip-content",children:o("p",{className:"chip-label",style:{color:n},children:a})})})};export{s as Chip,r as Histogram,i as Input,l as ProductionUnit,e as Switch};
|
|
1
|
+
import{jsxs as t,jsx as o}from"react/jsx-runtime";import{useState as a,useRef as c,useEffect as n}from"react";var i=function(i){var e=i.label,l=i.value,r=void 0===l?"":l,s=i.onChange,h=i.type,d=void 0===h?"text":h,m=i.disabled,u=void 0!==m&&m,v=i.error,p=i.className,f=void 0===p?"":p,b=i.required,g=void 0!==b&&b,N=a(r),w=N[0],L=N[1],R=a(!1),z=R[0],C=R[1],x=c(null);n(function(){L(r)},[r]);var y=["input-container",z?"input-container--focused":"",z||w.length>0?"input-container--floating":"",v?"input-container--error":"",u?"input-container--disabled":"",f].filter(Boolean).join(" ");return t("div",{className:y,children:[t("div",{className:"input-field",children:[o("input",{ref:x,type:d,value:w,onChange:function(t){var o=t.target.value;L(o),null==s||s(o)},onFocus:function(){C(!0)},onBlur:function(){C(!1)},disabled:u,required:g,className:"input-element","aria-label":e}),t("label",{className:"input-label",children:[e,g&&o("span",{className:"input-required",children:"*"})]})]}),v&&o("div",{className:"input-error",children:v})]})},e=function(c){var n=c.checked,i=void 0!==n&&n,e=c.onChange,l=c.disabled,r=void 0!==l&&l,s=c.size,h=void 0===s?"medium":s,d=c.label,m=c.className,u=void 0===m?"":m,v=c.showIcon,p=void 0===v||v,f=a(i),b=f[0],g=f[1],N=["switch","switch--".concat(h),b?"switch--checked":"",r?"switch--disabled":"",u].filter(Boolean).join(" ");return t("div",{className:"switch-container",children:[d&&o("label",{className:"switch-label",htmlFor:"switch-".concat(Math.random()),children:d}),t("div",{className:"switch-wrapper",children:[p&&o("div",{className:"switch-icon",children:o("img",{alt:"Power icon",src:b?"http://localhost:3845/assets/86c15ca80cb444eb8cc1db3e8335b63ac51c31a9.svg":"http://localhost:3845/assets/ad7677e073e42d60a4ed84f42b17c5e56222a75d.svg",className:"switch-power-icon"})}),o("button",{type:"button",role:"switch","aria-checked":b,className:N,onClick:function(){if(!r){var t=!b;g(t),null==e||e(t)}},disabled:r,children:o("span",{className:"switch-track",children:t("span",{className:"switch-thumb",children:[b&&o("img",{alt:"",src:"http://localhost:3845/assets/25f95806464af11dea630fdf68fa80d5415c7da4.svg",className:"switch-thumb-icon"}),!b&&o("img",{alt:"",src:"http://localhost:3845/assets/164245110dc3649da31e9ff08005286a44c3c907.svg",className:"switch-thumb-icon"})]})})})]})]})},l=function(a){var c=a.onChangeInput,n=a.onChangeSwitch,l=a.value,r=a.checked;return t("div",{className:"production-unit-container",children:[o(i,{label:"Production Unit",type:"number",onChange:c?function(t){return c(Number(t))}:void 0,value:void 0!==l?l.toString():void 0}),o(e,{label:"Production Unit",checked:r,onChange:n,className:"production-unit-switch"})]})},r=function(c){var i,e,l,r,s=c.max,h=c.relative,d=c.barHeight,m=void 0===d?103:d,u=c.barWidth,v=void 0===u?32:u,p=c.orientation,f=void 0===p?"vertical":p,b=c.cornerRadius,g=c.children,N=a(0),w=N[0],L=N[1],R=a(0),z=R[0],C=R[1],x=Math.min(h.value/s.value*100,100)/100*m,y=Math.min(h.value/s.value*100,100)/100*v;n(function(){L(0),C(0);var t=Date.now(),o=function(){var a=Date.now()-t,c=Math.min(a/1e3,1),n=1-Math.pow(1-c,4);L(x*n),C(y*n),c<1&&requestAnimationFrame(o)};requestAnimationFrame(o)},[x,y]);var k="horizontal"===f?m:v,M="horizontal"===f?v:m,q="horizontal"===f?m:v,B="horizontal"===f?v:m,F=function(t,o,a,c,n){var i=n.topLeft,e=n.topRight,l=n.bottomLeft,r=n.bottomRight;return"\n M ".concat(t+i," ").concat(o,"\n L ").concat(t+a-e," ").concat(o,"\n Q ").concat(t+a," ").concat(o," ").concat(t+a," ").concat(o+e,"\n L ").concat(t+a," ").concat(o+c-r,"\n Q ").concat(t+a," ").concat(o+c," ").concat(t+a-r," ").concat(o+c,"\n L ").concat(t+l," ").concat(o+c,"\n Q ").concat(t," ").concat(o+c," ").concat(t," ").concat(o+c-l,"\n L ").concat(t," ").concat(o+i,"\n Q ").concat(t," ").concat(o," ").concat(t+i," ").concat(o,"\n Z\n ").trim().replace(/\s+/g," ")},Q={topLeft:2,topRight:2,bottomLeft:2,bottomRight:2},j=b?{topLeft:null!==(i=b.topLeft)&&void 0!==i?i:Q.topLeft,topRight:null!==(e=b.topRight)&&void 0!==e?e:Q.topRight,bottomLeft:null!==(l=b.bottomLeft)&&void 0!==l?l:Q.bottomLeft,bottomRight:null!==(r=b.bottomRight)&&void 0!==r?r:Q.bottomRight}:Q;return o("div",{className:"histogram-container ".concat("horizontal"===f?"histogram-container--horizontal":""),children:t("div",{className:"histogram-content ".concat("horizontal"===f?"histogram-content--horizontal":""),children:[o("div",{className:"histogram-bar",style:{height:"".concat(M,"px"),width:"".concat(k,"px")},children:t("svg",{width:q,height:B,viewBox:"0 0 ".concat(q," ").concat(B),className:"histogram-svg",children:[o("path",{d:F(0,0,q,B,j),fill:s.color,fillOpacity:s.opacity||1}),o("path","vertical"===f?{d:F(0,B-w,q,w,{topLeft:w>=B?j.topLeft:0,topRight:w>=B?j.topRight:0,bottomLeft:j.bottomLeft,bottomRight:j.bottomRight}),fill:h.color}:{d:F(0,0,z,B,{topLeft:j.topLeft,topRight:z>=q?j.topRight:0,bottomLeft:j.bottomLeft,bottomRight:z>=q?j.bottomRight:0}),fill:h.color})]})}),g&&o("div",{className:"histogram-text-container ".concat("horizontal"===f?"histogram-text-container--horizontal":""),children:g})]})})},s=function(t){var a=t.label,c=t.bgColor,n=t.textColor;return o("div",{className:"chip-container",style:{backgroundColor:c},children:o("div",{className:"chip-content",children:o("p",{className:"chip-label",style:{color:n},children:a})})})};export{s as Chip,r as Histogram,i as Input,l as ProductionUnit,e as Switch};
|
|
2
2
|
//# sourceMappingURL=index.esm.js.map
|
package/dist/index.esm.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.esm.js","sources":["../src/components/Input.tsx","../src/components/Switch.tsx","../src/components/ProductionUnit.tsx","../src/components/Histogram.tsx","../src/components/Chip.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect } from 'react';\nimport './Input.css';\n\ninterface InputProps {\n label: string;\n value?: string;\n onChange?: (value: string) => void;\n type?: 'text' | 'email' | 'password' | 'number';\n disabled?: boolean;\n error?: string;\n className?: string;\n required?: boolean;\n}\n\nexport const Input: React.FC<InputProps> = ({\n label,\n value = '',\n onChange,\n type = 'text',\n disabled = false,\n error,\n className = '',\n required = false,\n}) => {\n const [internalValue, setInternalValue] = useState(value);\n const [isFocused, setIsFocused] = useState(false);\n const inputRef = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n setInternalValue(value);\n }, [value]);\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n setInternalValue(newValue);\n onChange?.(newValue);\n };\n\n const handleFocus = () => {\n setIsFocused(true);\n };\n\n const handleBlur = () => {\n setIsFocused(false);\n };\n\n const isLabelFloating = isFocused || internalValue.length > 0;\n\n const containerClasses = [\n 'input-container',\n isFocused ? 'input-container--focused' : '',\n isLabelFloating ? 'input-container--floating' : '',\n error ? 'input-container--error' : '',\n disabled ? 'input-container--disabled' : '',\n className,\n ].filter(Boolean).join(' ');\n\n return (\n <div className={containerClasses}>\n <div className=\"input-field\">\n <input\n ref={inputRef}\n type={type}\n value={internalValue}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n disabled={disabled}\n required={required}\n className=\"input-element\"\n aria-label={label}\n />\n <label className=\"input-label\">\n {label}\n {required && <span className=\"input-required\">*</span>}\n </label>\n </div>\n {error && <div className=\"input-error\">{error}</div>}\n </div>\n );\n};","import React, { useState } from 'react';\nimport './Switch.css';\n\nconst imgOn = \"http://localhost:3845/assets/86c15ca80cb444eb8cc1db3e8335b63ac51c31a9.svg\";\nconst imgOff = \"http://localhost:3845/assets/ad7677e073e42d60a4ed84f42b17c5e56222a75d.svg\";\nconst imgGroupOn = \"http://localhost:3845/assets/25f95806464af11dea630fdf68fa80d5415c7da4.svg\";\nconst imgGroupOff = \"http://localhost:3845/assets/164245110dc3649da31e9ff08005286a44c3c907.svg\";\n\ninterface SwitchProps {\n checked?: boolean;\n onChange?: (checked: boolean) => void;\n disabled?: boolean;\n size?: 'small' | 'medium' | 'large';\n label?: string;\n className?: string;\n showIcon?: boolean;\n}\n\nexport const Switch: React.FC<SwitchProps> = ({\n checked = false,\n onChange,\n disabled = false,\n size = 'medium',\n label,\n className = '',\n showIcon = true,\n}) => {\n const [internalChecked, setInternalChecked] = useState(checked);\n\n const handleToggle = () => {\n if (disabled) return;\n \n const newChecked = !internalChecked;\n setInternalChecked(newChecked);\n onChange?.(newChecked);\n };\n\n const switchClasses = [\n 'switch',\n `switch--${size}`,\n internalChecked ? 'switch--checked' : '',\n disabled ? 'switch--disabled' : '',\n className,\n ].filter(Boolean).join(' ');\n\n return (\n <div className=\"switch-container\">\n {label && (\n <label className=\"switch-label\" htmlFor={`switch-${Math.random()}`}>\n {label}\n </label>\n )}\n <div className=\"switch-wrapper\">\n {showIcon && (\n <div className=\"switch-icon\">\n <img \n alt=\"Power icon\" \n src={internalChecked ? imgOn : imgOff}\n className=\"switch-power-icon\"\n />\n </div>\n )}\n <button\n type=\"button\"\n role=\"switch\"\n aria-checked={internalChecked}\n className={switchClasses}\n onClick={handleToggle}\n disabled={disabled}\n >\n <span className=\"switch-track\">\n <span className=\"switch-thumb\">\n {internalChecked && (\n <img \n alt=\"\" \n src={imgGroupOn} \n className=\"switch-thumb-icon\"\n />\n )}\n {!internalChecked && (\n <img \n alt=\"\" \n src={imgGroupOff} \n className=\"switch-thumb-icon\"\n />\n )}\n </span>\n </span>\n </button>\n </div>\n </div>\n );\n};","import { Input } from \"./Input\";\nimport { Switch } from \"./Switch\";\ninterface ProductionUnitProps {\n onChangeInput?: (value: string) => void;\n onChangeSwitch?: (checked: boolean) => void;\n value?: string;\n checked?: boolean;\n}\nexport const ProductionUnit = ({\n onChangeInput,\n onChangeSwitch,\n value,\n checked,\n}: ProductionUnitProps) => {\n return (\n <div className=\"production-unit-container\">\n <Input\n label=\"Production Unit\"\n type=\"number\"\n onChange={onChangeInput}\n value={value}\n />\n <Switch\n label=\"Production Unit\"\n checked={checked}\n onChange={onChangeSwitch}\n className=\"production-unit-switch\"\n />\n </div>\n );\n};\n","import React, { useEffect, useState } from \"react\";\nimport \"./Histogram.css\";\n\ninterface HistogramProps {\n /** Maximum value configuration with value and color */\n max: {\n value: number;\n color: string;\n opacity?: number;\n };\n /** Relative/current value configuration with value and color */\n relative: {\n value: number;\n color: string;\n };\n /** Height of the histogram bar in pixels */\n barHeight?: number;\n /** Width of the histogram bar in pixels */\n barWidth?: number;\n /** Orientation of the histogram - 'vertical' or 'horizontal' */\n orientation?: 'vertical' | 'horizontal';\n /** Corner radius configuration for individual corners */\n cornerRadius?: {\n topLeft?: number;\n topRight?: number;\n bottomLeft?: number;\n bottomRight?: number;\n };\n /** Child components (typically text content) */\n children?: React.ReactNode;\n}\n\nexport const Histogram: React.FC<HistogramProps> = ({\n max,\n relative,\n barHeight = 103,\n barWidth = 32,\n orientation = 'vertical',\n cornerRadius,\n children,\n}) => {\n const [animatedHeight, setAnimatedHeight] = useState(0);\n const [animatedWidth, setAnimatedWidth] = useState(0);\n\n // Calculate target dimensions based on orientation\n const targetHeight = (Math.min((relative.value / max.value) * 100, 100) / 100) * barHeight;\n const targetWidth = (Math.min((relative.value / max.value) * 100, 100) / 100) * barWidth;\n\n // Simple Chart.js-like animation: always animate from 0 to target\n useEffect(() => {\n setAnimatedHeight(0);\n setAnimatedWidth(0);\n \n const startTime = Date.now();\n const duration = 1000;\n\n const animate = () => {\n const elapsed = Date.now() - startTime;\n const progress = Math.min(elapsed / duration, 1);\n\n // Chart.js-like easing (easeOutQuart)\n const easeOutQuart = 1 - Math.pow(1 - progress, 4);\n \n setAnimatedHeight(targetHeight * easeOutQuart);\n setAnimatedWidth(targetWidth * easeOutQuart);\n\n if (progress < 1) {\n requestAnimationFrame(animate);\n }\n };\n\n requestAnimationFrame(animate);\n }, [targetHeight, targetWidth]);\n\n const displayWidth = orientation === 'horizontal' ? barHeight : barWidth;\n const displayHeight = orientation === 'horizontal' ? barWidth : barHeight;\n const svgWidth = orientation === 'horizontal' ? barHeight : barWidth;\n const svgHeight = orientation === 'horizontal' ? barWidth : barHeight;\n\n // Helper function to create rounded rectangle path\n const createRoundedRectPath = (\n x: number,\n y: number,\n width: number,\n height: number,\n radii: { topLeft: number; topRight: number; bottomLeft: number; bottomRight: number }\n ) => {\n const { topLeft, topRight, bottomLeft, bottomRight } = radii;\n \n return `\n M ${x + topLeft} ${y}\n L ${x + width - topRight} ${y}\n Q ${x + width} ${y} ${x + width} ${y + topRight}\n L ${x + width} ${y + height - bottomRight}\n Q ${x + width} ${y + height} ${x + width - bottomRight} ${y + height}\n L ${x + bottomLeft} ${y + height}\n Q ${x} ${y + height} ${x} ${y + height - bottomLeft}\n L ${x} ${y + topLeft}\n Q ${x} ${y} ${x + topLeft} ${y}\n Z\n `.trim().replace(/\\s+/g, ' ');\n };\n\n // Default corner radius values\n const defaultCornerRadius = { topLeft: 2, topRight: 2, bottomLeft: 2, bottomRight: 2 };\n const corners = cornerRadius ? {\n topLeft: cornerRadius.topLeft ?? defaultCornerRadius.topLeft,\n topRight: cornerRadius.topRight ?? defaultCornerRadius.topRight,\n bottomLeft: cornerRadius.bottomLeft ?? defaultCornerRadius.bottomLeft,\n bottomRight: cornerRadius.bottomRight ?? defaultCornerRadius.bottomRight,\n } : defaultCornerRadius;\n\n return (\n <div className={`histogram-container ${orientation === 'horizontal' ? 'histogram-container--horizontal' : ''}`}>\n <div className={`histogram-content ${orientation === 'horizontal' ? 'histogram-content--horizontal' : ''}`}>\n <div \n className=\"histogram-bar\"\n style={{\n height: `${displayHeight}px`,\n width: `${displayWidth}px`\n }}\n >\n <svg\n width={svgWidth}\n height={svgHeight}\n viewBox={`0 0 ${svgWidth} ${svgHeight}`}\n className=\"histogram-svg\"\n >\n {/* Background bar (max value) */}\n <path\n d={createRoundedRectPath(0, 0, svgWidth, svgHeight, corners)}\n fill={max.color}\n fillOpacity={max.opacity || 1}\n />\n {/* Foreground bar (relative value) with animation */}\n {orientation === 'vertical' ? (\n <path\n d={createRoundedRectPath(\n 0,\n svgHeight - animatedHeight,\n svgWidth,\n animatedHeight,\n {\n topLeft: animatedHeight >= svgHeight ? corners.topLeft : 0,\n topRight: animatedHeight >= svgHeight ? corners.topRight : 0,\n bottomLeft: corners.bottomLeft,\n bottomRight: corners.bottomRight,\n }\n )}\n fill={relative.color}\n />\n ) : (\n <path\n d={createRoundedRectPath(\n 0,\n 0,\n animatedWidth,\n svgHeight,\n {\n topLeft: corners.topLeft,\n topRight: animatedWidth >= svgWidth ? corners.topRight : 0,\n bottomLeft: corners.bottomLeft,\n bottomRight: animatedWidth >= svgWidth ? corners.bottomRight : 0,\n }\n )}\n fill={relative.color}\n />\n )}\n </svg>\n </div>\n {children && (\n <div className={`histogram-text-container ${orientation === 'horizontal' ? 'histogram-text-container--horizontal' : ''}`}>\n {children}\n </div>\n )}\n </div>\n </div>\n );\n};\n","import React from \"react\";\nimport \"./Chip.css\";\n\ninterface ChipProps {\n // Define any props you want to pass to the Chip component\n label?: string;\n bgColor?: string;\n textColor?: string;\n}\n\nexport const Chip: React.FC<ChipProps> = ({ label, bgColor, textColor }) => {\n return (\n <div className=\"chip-container\" style={{ backgroundColor: bgColor }}>\n <div className=\"chip-content\">\n <p className=\"chip-label\" style={{ color: textColor }}>\n {label}\n </p>\n </div>\n </div>\n );\n};\n"],"names":["Input","_a","label","_b","value","onChange","_c","type","_d","disabled","error","_e","className","_f","required","_g","useState","internalValue","setInternalValue","_h","isFocused","setIsFocused","inputRef","useRef","useEffect","containerClasses","length","filter","Boolean","join","_jsxs","_jsx","ref","e","newValue","target","onFocus","onBlur","children","Switch","checked","size","showIcon","internalChecked","setInternalChecked","switchClasses","concat","htmlFor","Math","random","alt","src","role","onClick","newChecked","ProductionUnit","onChangeInput","onChangeSwitch","Histogram","max","relative","barHeight","barWidth","orientation","cornerRadius","_j","animatedHeight","setAnimatedHeight","_k","animatedWidth","setAnimatedWidth","targetHeight","min","targetWidth","startTime","Date","now","animate","elapsed","progress","easeOutQuart","pow","requestAnimationFrame","displayWidth","displayHeight","svgWidth","svgHeight","createRoundedRectPath","x","y","width","height","radii","topLeft","topRight","bottomLeft","bottomRight","trim","replace","defaultCornerRadius","corners","style","viewBox","d","fill","color","fillOpacity","opacity","Chip","bgColor","textColor","backgroundColor"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.esm.js","sources":["../src/components/Input.tsx","../src/components/Switch.tsx","../src/components/ProductionUnit.tsx","../src/components/Histogram.tsx","../src/components/Chip.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect } from 'react';\nimport './Input.css';\n\ninterface InputProps {\n label: string;\n value?: string;\n onChange?: (value: string) => void;\n type?: 'text' | 'email' | 'password' | 'number';\n disabled?: boolean;\n error?: string;\n className?: string;\n required?: boolean;\n}\n\nexport const Input: React.FC<InputProps> = ({\n label,\n value = '',\n onChange,\n type = 'text',\n disabled = false,\n error,\n className = '',\n required = false,\n}) => {\n const [internalValue, setInternalValue] = useState(value);\n const [isFocused, setIsFocused] = useState(false);\n const inputRef = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n setInternalValue(value);\n }, [value]);\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n setInternalValue(newValue);\n onChange?.(newValue);\n };\n\n const handleFocus = () => {\n setIsFocused(true);\n };\n\n const handleBlur = () => {\n setIsFocused(false);\n };\n\n const isLabelFloating = isFocused || internalValue.length > 0;\n\n const containerClasses = [\n 'input-container',\n isFocused ? 'input-container--focused' : '',\n isLabelFloating ? 'input-container--floating' : '',\n error ? 'input-container--error' : '',\n disabled ? 'input-container--disabled' : '',\n className,\n ].filter(Boolean).join(' ');\n\n return (\n <div className={containerClasses}>\n <div className=\"input-field\">\n <input\n ref={inputRef}\n type={type}\n value={internalValue}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n disabled={disabled}\n required={required}\n className=\"input-element\"\n aria-label={label}\n />\n <label className=\"input-label\">\n {label}\n {required && <span className=\"input-required\">*</span>}\n </label>\n </div>\n {error && <div className=\"input-error\">{error}</div>}\n </div>\n );\n};","import React, { useState } from 'react';\nimport './Switch.css';\n\nconst imgOn = \"http://localhost:3845/assets/86c15ca80cb444eb8cc1db3e8335b63ac51c31a9.svg\";\nconst imgOff = \"http://localhost:3845/assets/ad7677e073e42d60a4ed84f42b17c5e56222a75d.svg\";\nconst imgGroupOn = \"http://localhost:3845/assets/25f95806464af11dea630fdf68fa80d5415c7da4.svg\";\nconst imgGroupOff = \"http://localhost:3845/assets/164245110dc3649da31e9ff08005286a44c3c907.svg\";\n\ninterface SwitchProps {\n checked?: boolean;\n onChange?: (checked: boolean) => void;\n disabled?: boolean;\n size?: 'small' | 'medium' | 'large';\n label?: string;\n className?: string;\n showIcon?: boolean;\n}\n\nexport const Switch: React.FC<SwitchProps> = ({\n checked = false,\n onChange,\n disabled = false,\n size = 'medium',\n label,\n className = '',\n showIcon = true,\n}) => {\n const [internalChecked, setInternalChecked] = useState(checked);\n\n const handleToggle = () => {\n if (disabled) return;\n \n const newChecked = !internalChecked;\n setInternalChecked(newChecked);\n onChange?.(newChecked);\n };\n\n const switchClasses = [\n 'switch',\n `switch--${size}`,\n internalChecked ? 'switch--checked' : '',\n disabled ? 'switch--disabled' : '',\n className,\n ].filter(Boolean).join(' ');\n\n return (\n <div className=\"switch-container\">\n {label && (\n <label className=\"switch-label\" htmlFor={`switch-${Math.random()}`}>\n {label}\n </label>\n )}\n <div className=\"switch-wrapper\">\n {showIcon && (\n <div className=\"switch-icon\">\n <img \n alt=\"Power icon\" \n src={internalChecked ? imgOn : imgOff}\n className=\"switch-power-icon\"\n />\n </div>\n )}\n <button\n type=\"button\"\n role=\"switch\"\n aria-checked={internalChecked}\n className={switchClasses}\n onClick={handleToggle}\n disabled={disabled}\n >\n <span className=\"switch-track\">\n <span className=\"switch-thumb\">\n {internalChecked && (\n <img \n alt=\"\" \n src={imgGroupOn} \n className=\"switch-thumb-icon\"\n />\n )}\n {!internalChecked && (\n <img \n alt=\"\" \n src={imgGroupOff} \n className=\"switch-thumb-icon\"\n />\n )}\n </span>\n </span>\n </button>\n </div>\n </div>\n );\n};","import { Input } from \"./Input\";\nimport { Switch } from \"./Switch\";\ninterface ProductionUnitProps {\n onChangeInput?: (value: number) => void;\n onChangeSwitch?: (checked: boolean) => void;\n value?: number;\n checked?: boolean;\n}\nexport const ProductionUnit = ({\n onChangeInput,\n onChangeSwitch,\n value,\n checked,\n}: ProductionUnitProps) => {\n return (\n <div className=\"production-unit-container\">\n <Input\n label=\"Production Unit\"\n type=\"number\"\n onChange={\n onChangeInput\n ? (val: string) => onChangeInput(Number(val))\n : undefined\n }\n value={value !== undefined ? value.toString() : undefined}\n />\n <Switch\n label=\"Production Unit\"\n checked={checked}\n onChange={onChangeSwitch}\n className=\"production-unit-switch\"\n />\n </div>\n );\n};\n","import React, { useEffect, useState } from \"react\";\nimport \"./Histogram.css\";\n\ninterface HistogramProps {\n /** Maximum value configuration with value and color */\n max: {\n value: number;\n color: string;\n opacity?: number;\n };\n /** Relative/current value configuration with value and color */\n relative: {\n value: number;\n color: string;\n };\n /** Height of the histogram bar in pixels */\n barHeight?: number;\n /** Width of the histogram bar in pixels */\n barWidth?: number;\n /** Orientation of the histogram - 'vertical' or 'horizontal' */\n orientation?: 'vertical' | 'horizontal';\n /** Corner radius configuration for individual corners */\n cornerRadius?: {\n topLeft?: number;\n topRight?: number;\n bottomLeft?: number;\n bottomRight?: number;\n };\n /** Child components (typically text content) */\n children?: React.ReactNode;\n}\n\nexport const Histogram: React.FC<HistogramProps> = ({\n max,\n relative,\n barHeight = 103,\n barWidth = 32,\n orientation = 'vertical',\n cornerRadius,\n children,\n}) => {\n const [animatedHeight, setAnimatedHeight] = useState(0);\n const [animatedWidth, setAnimatedWidth] = useState(0);\n\n // Calculate target dimensions based on orientation\n const targetHeight = (Math.min((relative.value / max.value) * 100, 100) / 100) * barHeight;\n const targetWidth = (Math.min((relative.value / max.value) * 100, 100) / 100) * barWidth;\n\n // Simple Chart.js-like animation: always animate from 0 to target\n useEffect(() => {\n setAnimatedHeight(0);\n setAnimatedWidth(0);\n \n const startTime = Date.now();\n const duration = 1000;\n\n const animate = () => {\n const elapsed = Date.now() - startTime;\n const progress = Math.min(elapsed / duration, 1);\n\n // Chart.js-like easing (easeOutQuart)\n const easeOutQuart = 1 - Math.pow(1 - progress, 4);\n \n setAnimatedHeight(targetHeight * easeOutQuart);\n setAnimatedWidth(targetWidth * easeOutQuart);\n\n if (progress < 1) {\n requestAnimationFrame(animate);\n }\n };\n\n requestAnimationFrame(animate);\n }, [targetHeight, targetWidth]);\n\n const displayWidth = orientation === 'horizontal' ? barHeight : barWidth;\n const displayHeight = orientation === 'horizontal' ? barWidth : barHeight;\n const svgWidth = orientation === 'horizontal' ? barHeight : barWidth;\n const svgHeight = orientation === 'horizontal' ? barWidth : barHeight;\n\n // Helper function to create rounded rectangle path\n const createRoundedRectPath = (\n x: number,\n y: number,\n width: number,\n height: number,\n radii: { topLeft: number; topRight: number; bottomLeft: number; bottomRight: number }\n ) => {\n const { topLeft, topRight, bottomLeft, bottomRight } = radii;\n \n return `\n M ${x + topLeft} ${y}\n L ${x + width - topRight} ${y}\n Q ${x + width} ${y} ${x + width} ${y + topRight}\n L ${x + width} ${y + height - bottomRight}\n Q ${x + width} ${y + height} ${x + width - bottomRight} ${y + height}\n L ${x + bottomLeft} ${y + height}\n Q ${x} ${y + height} ${x} ${y + height - bottomLeft}\n L ${x} ${y + topLeft}\n Q ${x} ${y} ${x + topLeft} ${y}\n Z\n `.trim().replace(/\\s+/g, ' ');\n };\n\n // Default corner radius values\n const defaultCornerRadius = { topLeft: 2, topRight: 2, bottomLeft: 2, bottomRight: 2 };\n const corners = cornerRadius ? {\n topLeft: cornerRadius.topLeft ?? defaultCornerRadius.topLeft,\n topRight: cornerRadius.topRight ?? defaultCornerRadius.topRight,\n bottomLeft: cornerRadius.bottomLeft ?? defaultCornerRadius.bottomLeft,\n bottomRight: cornerRadius.bottomRight ?? defaultCornerRadius.bottomRight,\n } : defaultCornerRadius;\n\n return (\n <div className={`histogram-container ${orientation === 'horizontal' ? 'histogram-container--horizontal' : ''}`}>\n <div className={`histogram-content ${orientation === 'horizontal' ? 'histogram-content--horizontal' : ''}`}>\n <div \n className=\"histogram-bar\"\n style={{\n height: `${displayHeight}px`,\n width: `${displayWidth}px`\n }}\n >\n <svg\n width={svgWidth}\n height={svgHeight}\n viewBox={`0 0 ${svgWidth} ${svgHeight}`}\n className=\"histogram-svg\"\n >\n {/* Background bar (max value) */}\n <path\n d={createRoundedRectPath(0, 0, svgWidth, svgHeight, corners)}\n fill={max.color}\n fillOpacity={max.opacity || 1}\n />\n {/* Foreground bar (relative value) with animation */}\n {orientation === 'vertical' ? (\n <path\n d={createRoundedRectPath(\n 0,\n svgHeight - animatedHeight,\n svgWidth,\n animatedHeight,\n {\n topLeft: animatedHeight >= svgHeight ? corners.topLeft : 0,\n topRight: animatedHeight >= svgHeight ? corners.topRight : 0,\n bottomLeft: corners.bottomLeft,\n bottomRight: corners.bottomRight,\n }\n )}\n fill={relative.color}\n />\n ) : (\n <path\n d={createRoundedRectPath(\n 0,\n 0,\n animatedWidth,\n svgHeight,\n {\n topLeft: corners.topLeft,\n topRight: animatedWidth >= svgWidth ? corners.topRight : 0,\n bottomLeft: corners.bottomLeft,\n bottomRight: animatedWidth >= svgWidth ? corners.bottomRight : 0,\n }\n )}\n fill={relative.color}\n />\n )}\n </svg>\n </div>\n {children && (\n <div className={`histogram-text-container ${orientation === 'horizontal' ? 'histogram-text-container--horizontal' : ''}`}>\n {children}\n </div>\n )}\n </div>\n </div>\n );\n};\n","import React from \"react\";\nimport \"./Chip.css\";\n\ninterface ChipProps {\n // Define any props you want to pass to the Chip component\n label?: string;\n bgColor?: string;\n textColor?: string;\n}\n\nexport const Chip: React.FC<ChipProps> = ({ label, bgColor, textColor }) => {\n return (\n <div className=\"chip-container\" style={{ backgroundColor: bgColor }}>\n <div className=\"chip-content\">\n <p className=\"chip-label\" style={{ color: textColor }}>\n {label}\n </p>\n </div>\n </div>\n );\n};\n"],"names":["Input","_a","label","_b","value","onChange","_c","type","_d","disabled","error","_e","className","_f","required","_g","useState","internalValue","setInternalValue","_h","isFocused","setIsFocused","inputRef","useRef","useEffect","containerClasses","length","filter","Boolean","join","_jsxs","_jsx","ref","e","newValue","target","onFocus","onBlur","children","Switch","checked","size","showIcon","internalChecked","setInternalChecked","switchClasses","concat","htmlFor","Math","random","alt","src","role","onClick","newChecked","ProductionUnit","onChangeInput","onChangeSwitch","val","Number","undefined","toString","Histogram","max","relative","barHeight","barWidth","orientation","cornerRadius","_j","animatedHeight","setAnimatedHeight","_k","animatedWidth","setAnimatedWidth","targetHeight","min","targetWidth","startTime","Date","now","animate","elapsed","progress","easeOutQuart","pow","requestAnimationFrame","displayWidth","displayHeight","svgWidth","svgHeight","createRoundedRectPath","x","y","width","height","radii","topLeft","topRight","bottomLeft","bottomRight","trim","replace","defaultCornerRadius","corners","style","viewBox","d","fill","color","fillOpacity","opacity","Chip","bgColor","textColor","backgroundColor"],"mappings":"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"}
|
package/dist/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var t=require("react/jsx-runtime"),o=require("react"),a=function(a){var e=a.label,c=a.value,n=void 0===c?"":c,i=a.onChange,s=a.type,
|
|
1
|
+
"use strict";var t=require("react/jsx-runtime"),o=require("react"),a=function(a){var e=a.label,c=a.value,n=void 0===c?"":c,i=a.onChange,s=a.type,r=void 0===s?"text":s,l=a.disabled,h=void 0!==l&&l,d=a.error,u=a.className,m=void 0===u?"":u,p=a.required,v=void 0!==p&&p,f=o.useState(n),g=f[0],b=f[1],x=o.useState(!1),j=x[0],N=x[1],w=o.useRef(null);o.useEffect(function(){b(n)},[n]);var L=["input-container",j?"input-container--focused":"",j||g.length>0?"input-container--floating":"",d?"input-container--error":"",h?"input-container--disabled":"",m].filter(Boolean).join(" ");return t.jsxs("div",{className:L,children:[t.jsxs("div",{className:"input-field",children:[t.jsx("input",{ref:w,type:r,value:g,onChange:function(t){var o=t.target.value;b(o),null==i||i(o)},onFocus:function(){N(!0)},onBlur:function(){N(!1)},disabled:h,required:v,className:"input-element","aria-label":e}),t.jsxs("label",{className:"input-label",children:[e,v&&t.jsx("span",{className:"input-required",children:"*"})]})]}),d&&t.jsx("div",{className:"input-error",children:d})]})},e=function(a){var e=a.checked,c=void 0!==e&&e,n=a.onChange,i=a.disabled,s=void 0!==i&&i,r=a.size,l=void 0===r?"medium":r,h=a.label,d=a.className,u=void 0===d?"":d,m=a.showIcon,p=void 0===m||m,v=o.useState(c),f=v[0],g=v[1],b=["switch","switch--".concat(l),f?"switch--checked":"",s?"switch--disabled":"",u].filter(Boolean).join(" ");return t.jsxs("div",{className:"switch-container",children:[h&&t.jsx("label",{className:"switch-label",htmlFor:"switch-".concat(Math.random()),children:h}),t.jsxs("div",{className:"switch-wrapper",children:[p&&t.jsx("div",{className:"switch-icon",children:t.jsx("img",{alt:"Power icon",src:f?"http://localhost:3845/assets/86c15ca80cb444eb8cc1db3e8335b63ac51c31a9.svg":"http://localhost:3845/assets/ad7677e073e42d60a4ed84f42b17c5e56222a75d.svg",className:"switch-power-icon"})}),t.jsx("button",{type:"button",role:"switch","aria-checked":f,className:b,onClick:function(){if(!s){var t=!f;g(t),null==n||n(t)}},disabled:s,children:t.jsx("span",{className:"switch-track",children:t.jsxs("span",{className:"switch-thumb",children:[f&&t.jsx("img",{alt:"",src:"http://localhost:3845/assets/25f95806464af11dea630fdf68fa80d5415c7da4.svg",className:"switch-thumb-icon"}),!f&&t.jsx("img",{alt:"",src:"http://localhost:3845/assets/164245110dc3649da31e9ff08005286a44c3c907.svg",className:"switch-thumb-icon"})]})})})]})]})};exports.Chip=function(o){var a=o.label,e=o.bgColor,c=o.textColor;return t.jsx("div",{className:"chip-container",style:{backgroundColor:e},children:t.jsx("div",{className:"chip-content",children:t.jsx("p",{className:"chip-label",style:{color:c},children:a})})})},exports.Histogram=function(a){var e,c,n,i,s=a.max,r=a.relative,l=a.barHeight,h=void 0===l?103:l,d=a.barWidth,u=void 0===d?32:d,m=a.orientation,p=void 0===m?"vertical":m,v=a.cornerRadius,f=a.children,g=o.useState(0),b=g[0],x=g[1],j=o.useState(0),N=j[0],w=j[1],L=Math.min(r.value/s.value*100,100)/100*h,R=Math.min(r.value/s.value*100,100)/100*u;o.useEffect(function(){x(0),w(0);var t=Date.now(),o=function(){var a=Date.now()-t,e=Math.min(a/1e3,1),c=1-Math.pow(1-e,4);x(L*c),w(R*c),e<1&&requestAnimationFrame(o)};requestAnimationFrame(o)},[L,R]);var C="horizontal"===p?h:u,z="horizontal"===p?u:h,y="horizontal"===p?h:u,k="horizontal"===p?u:h,S=function(t,o,a,e,c){var n=c.topLeft,i=c.topRight,s=c.bottomLeft,r=c.bottomRight;return"\n M ".concat(t+n," ").concat(o,"\n L ").concat(t+a-i," ").concat(o,"\n Q ").concat(t+a," ").concat(o," ").concat(t+a," ").concat(o+i,"\n L ").concat(t+a," ").concat(o+e-r,"\n Q ").concat(t+a," ").concat(o+e," ").concat(t+a-r," ").concat(o+e,"\n L ").concat(t+s," ").concat(o+e,"\n Q ").concat(t," ").concat(o+e," ").concat(t," ").concat(o+e-s,"\n L ").concat(t," ").concat(o+n,"\n Q ").concat(t," ").concat(o," ").concat(t+n," ").concat(o,"\n Z\n ").trim().replace(/\s+/g," ")},q={topLeft:2,topRight:2,bottomLeft:2,bottomRight:2},M=v?{topLeft:null!==(e=v.topLeft)&&void 0!==e?e:q.topLeft,topRight:null!==(c=v.topRight)&&void 0!==c?c:q.topRight,bottomLeft:null!==(n=v.bottomLeft)&&void 0!==n?n:q.bottomLeft,bottomRight:null!==(i=v.bottomRight)&&void 0!==i?i:q.bottomRight}:q;return t.jsx("div",{className:"histogram-container ".concat("horizontal"===p?"histogram-container--horizontal":""),children:t.jsxs("div",{className:"histogram-content ".concat("horizontal"===p?"histogram-content--horizontal":""),children:[t.jsx("div",{className:"histogram-bar",style:{height:"".concat(z,"px"),width:"".concat(C,"px")},children:t.jsxs("svg",{width:y,height:k,viewBox:"0 0 ".concat(y," ").concat(k),className:"histogram-svg",children:[t.jsx("path",{d:S(0,0,y,k,M),fill:s.color,fillOpacity:s.opacity||1}),"vertical"===p?t.jsx("path",{d:S(0,k-b,y,b,{topLeft:b>=k?M.topLeft:0,topRight:b>=k?M.topRight:0,bottomLeft:M.bottomLeft,bottomRight:M.bottomRight}),fill:r.color}):t.jsx("path",{d:S(0,0,N,k,{topLeft:M.topLeft,topRight:N>=y?M.topRight:0,bottomLeft:M.bottomLeft,bottomRight:N>=y?M.bottomRight:0}),fill:r.color})]})}),f&&t.jsx("div",{className:"histogram-text-container ".concat("horizontal"===p?"histogram-text-container--horizontal":""),children:f})]})})},exports.Input=a,exports.ProductionUnit=function(o){var c=o.onChangeInput,n=o.onChangeSwitch,i=o.value,s=o.checked;return t.jsxs("div",{className:"production-unit-container",children:[t.jsx(a,{label:"Production Unit",type:"number",onChange:c?function(t){return c(Number(t))}:void 0,value:void 0!==i?i.toString():void 0}),t.jsx(e,{label:"Production Unit",checked:s,onChange:n,className:"production-unit-switch"})]})},exports.Switch=e;
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../src/components/Input.tsx","../src/components/Switch.tsx","../src/components/Chip.tsx","../src/components/Histogram.tsx","../src/components/ProductionUnit.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect } from 'react';\nimport './Input.css';\n\ninterface InputProps {\n label: string;\n value?: string;\n onChange?: (value: string) => void;\n type?: 'text' | 'email' | 'password' | 'number';\n disabled?: boolean;\n error?: string;\n className?: string;\n required?: boolean;\n}\n\nexport const Input: React.FC<InputProps> = ({\n label,\n value = '',\n onChange,\n type = 'text',\n disabled = false,\n error,\n className = '',\n required = false,\n}) => {\n const [internalValue, setInternalValue] = useState(value);\n const [isFocused, setIsFocused] = useState(false);\n const inputRef = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n setInternalValue(value);\n }, [value]);\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n setInternalValue(newValue);\n onChange?.(newValue);\n };\n\n const handleFocus = () => {\n setIsFocused(true);\n };\n\n const handleBlur = () => {\n setIsFocused(false);\n };\n\n const isLabelFloating = isFocused || internalValue.length > 0;\n\n const containerClasses = [\n 'input-container',\n isFocused ? 'input-container--focused' : '',\n isLabelFloating ? 'input-container--floating' : '',\n error ? 'input-container--error' : '',\n disabled ? 'input-container--disabled' : '',\n className,\n ].filter(Boolean).join(' ');\n\n return (\n <div className={containerClasses}>\n <div className=\"input-field\">\n <input\n ref={inputRef}\n type={type}\n value={internalValue}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n disabled={disabled}\n required={required}\n className=\"input-element\"\n aria-label={label}\n />\n <label className=\"input-label\">\n {label}\n {required && <span className=\"input-required\">*</span>}\n </label>\n </div>\n {error && <div className=\"input-error\">{error}</div>}\n </div>\n );\n};","import React, { useState } from 'react';\nimport './Switch.css';\n\nconst imgOn = \"http://localhost:3845/assets/86c15ca80cb444eb8cc1db3e8335b63ac51c31a9.svg\";\nconst imgOff = \"http://localhost:3845/assets/ad7677e073e42d60a4ed84f42b17c5e56222a75d.svg\";\nconst imgGroupOn = \"http://localhost:3845/assets/25f95806464af11dea630fdf68fa80d5415c7da4.svg\";\nconst imgGroupOff = \"http://localhost:3845/assets/164245110dc3649da31e9ff08005286a44c3c907.svg\";\n\ninterface SwitchProps {\n checked?: boolean;\n onChange?: (checked: boolean) => void;\n disabled?: boolean;\n size?: 'small' | 'medium' | 'large';\n label?: string;\n className?: string;\n showIcon?: boolean;\n}\n\nexport const Switch: React.FC<SwitchProps> = ({\n checked = false,\n onChange,\n disabled = false,\n size = 'medium',\n label,\n className = '',\n showIcon = true,\n}) => {\n const [internalChecked, setInternalChecked] = useState(checked);\n\n const handleToggle = () => {\n if (disabled) return;\n \n const newChecked = !internalChecked;\n setInternalChecked(newChecked);\n onChange?.(newChecked);\n };\n\n const switchClasses = [\n 'switch',\n `switch--${size}`,\n internalChecked ? 'switch--checked' : '',\n disabled ? 'switch--disabled' : '',\n className,\n ].filter(Boolean).join(' ');\n\n return (\n <div className=\"switch-container\">\n {label && (\n <label className=\"switch-label\" htmlFor={`switch-${Math.random()}`}>\n {label}\n </label>\n )}\n <div className=\"switch-wrapper\">\n {showIcon && (\n <div className=\"switch-icon\">\n <img \n alt=\"Power icon\" \n src={internalChecked ? imgOn : imgOff}\n className=\"switch-power-icon\"\n />\n </div>\n )}\n <button\n type=\"button\"\n role=\"switch\"\n aria-checked={internalChecked}\n className={switchClasses}\n onClick={handleToggle}\n disabled={disabled}\n >\n <span className=\"switch-track\">\n <span className=\"switch-thumb\">\n {internalChecked && (\n <img \n alt=\"\" \n src={imgGroupOn} \n className=\"switch-thumb-icon\"\n />\n )}\n {!internalChecked && (\n <img \n alt=\"\" \n src={imgGroupOff} \n className=\"switch-thumb-icon\"\n />\n )}\n </span>\n </span>\n </button>\n </div>\n </div>\n );\n};","import React from \"react\";\nimport \"./Chip.css\";\n\ninterface ChipProps {\n // Define any props you want to pass to the Chip component\n label?: string;\n bgColor?: string;\n textColor?: string;\n}\n\nexport const Chip: React.FC<ChipProps> = ({ label, bgColor, textColor }) => {\n return (\n <div className=\"chip-container\" style={{ backgroundColor: bgColor }}>\n <div className=\"chip-content\">\n <p className=\"chip-label\" style={{ color: textColor }}>\n {label}\n </p>\n </div>\n </div>\n );\n};\n","import React, { useEffect, useState } from \"react\";\nimport \"./Histogram.css\";\n\ninterface HistogramProps {\n /** Maximum value configuration with value and color */\n max: {\n value: number;\n color: string;\n opacity?: number;\n };\n /** Relative/current value configuration with value and color */\n relative: {\n value: number;\n color: string;\n };\n /** Height of the histogram bar in pixels */\n barHeight?: number;\n /** Width of the histogram bar in pixels */\n barWidth?: number;\n /** Orientation of the histogram - 'vertical' or 'horizontal' */\n orientation?: 'vertical' | 'horizontal';\n /** Corner radius configuration for individual corners */\n cornerRadius?: {\n topLeft?: number;\n topRight?: number;\n bottomLeft?: number;\n bottomRight?: number;\n };\n /** Child components (typically text content) */\n children?: React.ReactNode;\n}\n\nexport const Histogram: React.FC<HistogramProps> = ({\n max,\n relative,\n barHeight = 103,\n barWidth = 32,\n orientation = 'vertical',\n cornerRadius,\n children,\n}) => {\n const [animatedHeight, setAnimatedHeight] = useState(0);\n const [animatedWidth, setAnimatedWidth] = useState(0);\n\n // Calculate target dimensions based on orientation\n const targetHeight = (Math.min((relative.value / max.value) * 100, 100) / 100) * barHeight;\n const targetWidth = (Math.min((relative.value / max.value) * 100, 100) / 100) * barWidth;\n\n // Simple Chart.js-like animation: always animate from 0 to target\n useEffect(() => {\n setAnimatedHeight(0);\n setAnimatedWidth(0);\n \n const startTime = Date.now();\n const duration = 1000;\n\n const animate = () => {\n const elapsed = Date.now() - startTime;\n const progress = Math.min(elapsed / duration, 1);\n\n // Chart.js-like easing (easeOutQuart)\n const easeOutQuart = 1 - Math.pow(1 - progress, 4);\n \n setAnimatedHeight(targetHeight * easeOutQuart);\n setAnimatedWidth(targetWidth * easeOutQuart);\n\n if (progress < 1) {\n requestAnimationFrame(animate);\n }\n };\n\n requestAnimationFrame(animate);\n }, [targetHeight, targetWidth]);\n\n const displayWidth = orientation === 'horizontal' ? barHeight : barWidth;\n const displayHeight = orientation === 'horizontal' ? barWidth : barHeight;\n const svgWidth = orientation === 'horizontal' ? barHeight : barWidth;\n const svgHeight = orientation === 'horizontal' ? barWidth : barHeight;\n\n // Helper function to create rounded rectangle path\n const createRoundedRectPath = (\n x: number,\n y: number,\n width: number,\n height: number,\n radii: { topLeft: number; topRight: number; bottomLeft: number; bottomRight: number }\n ) => {\n const { topLeft, topRight, bottomLeft, bottomRight } = radii;\n \n return `\n M ${x + topLeft} ${y}\n L ${x + width - topRight} ${y}\n Q ${x + width} ${y} ${x + width} ${y + topRight}\n L ${x + width} ${y + height - bottomRight}\n Q ${x + width} ${y + height} ${x + width - bottomRight} ${y + height}\n L ${x + bottomLeft} ${y + height}\n Q ${x} ${y + height} ${x} ${y + height - bottomLeft}\n L ${x} ${y + topLeft}\n Q ${x} ${y} ${x + topLeft} ${y}\n Z\n `.trim().replace(/\\s+/g, ' ');\n };\n\n // Default corner radius values\n const defaultCornerRadius = { topLeft: 2, topRight: 2, bottomLeft: 2, bottomRight: 2 };\n const corners = cornerRadius ? {\n topLeft: cornerRadius.topLeft ?? defaultCornerRadius.topLeft,\n topRight: cornerRadius.topRight ?? defaultCornerRadius.topRight,\n bottomLeft: cornerRadius.bottomLeft ?? defaultCornerRadius.bottomLeft,\n bottomRight: cornerRadius.bottomRight ?? defaultCornerRadius.bottomRight,\n } : defaultCornerRadius;\n\n return (\n <div className={`histogram-container ${orientation === 'horizontal' ? 'histogram-container--horizontal' : ''}`}>\n <div className={`histogram-content ${orientation === 'horizontal' ? 'histogram-content--horizontal' : ''}`}>\n <div \n className=\"histogram-bar\"\n style={{\n height: `${displayHeight}px`,\n width: `${displayWidth}px`\n }}\n >\n <svg\n width={svgWidth}\n height={svgHeight}\n viewBox={`0 0 ${svgWidth} ${svgHeight}`}\n className=\"histogram-svg\"\n >\n {/* Background bar (max value) */}\n <path\n d={createRoundedRectPath(0, 0, svgWidth, svgHeight, corners)}\n fill={max.color}\n fillOpacity={max.opacity || 1}\n />\n {/* Foreground bar (relative value) with animation */}\n {orientation === 'vertical' ? (\n <path\n d={createRoundedRectPath(\n 0,\n svgHeight - animatedHeight,\n svgWidth,\n animatedHeight,\n {\n topLeft: animatedHeight >= svgHeight ? corners.topLeft : 0,\n topRight: animatedHeight >= svgHeight ? corners.topRight : 0,\n bottomLeft: corners.bottomLeft,\n bottomRight: corners.bottomRight,\n }\n )}\n fill={relative.color}\n />\n ) : (\n <path\n d={createRoundedRectPath(\n 0,\n 0,\n animatedWidth,\n svgHeight,\n {\n topLeft: corners.topLeft,\n topRight: animatedWidth >= svgWidth ? corners.topRight : 0,\n bottomLeft: corners.bottomLeft,\n bottomRight: animatedWidth >= svgWidth ? corners.bottomRight : 0,\n }\n )}\n fill={relative.color}\n />\n )}\n </svg>\n </div>\n {children && (\n <div className={`histogram-text-container ${orientation === 'horizontal' ? 'histogram-text-container--horizontal' : ''}`}>\n {children}\n </div>\n )}\n </div>\n </div>\n );\n};\n","import { Input } from \"./Input\";\nimport { Switch } from \"./Switch\";\ninterface ProductionUnitProps {\n onChangeInput?: (value: string) => void;\n onChangeSwitch?: (checked: boolean) => void;\n value?: string;\n checked?: boolean;\n}\nexport const ProductionUnit = ({\n onChangeInput,\n onChangeSwitch,\n value,\n checked,\n}: ProductionUnitProps) => {\n return (\n <div className=\"production-unit-container\">\n <Input\n label=\"Production Unit\"\n type=\"number\"\n onChange={onChangeInput}\n value={value}\n />\n <Switch\n label=\"Production Unit\"\n checked={checked}\n onChange={onChangeSwitch}\n className=\"production-unit-switch\"\n />\n </div>\n );\n};\n"],"names":["Input","_a","label","_b","value","onChange","_c","type","_d","disabled","error","_e","className","_f","required","_g","useState","internalValue","setInternalValue","_h","isFocused","setIsFocused","inputRef","useRef","useEffect","containerClasses","length","filter","Boolean","join","_jsxs","_jsx","ref","e","newValue","target","onFocus","onBlur","children","jsx","Switch","checked","size","showIcon","internalChecked","setInternalChecked","switchClasses","concat","htmlFor","Math","random","alt","src","role","onClick","newChecked","bgColor","textColor","style","backgroundColor","color","max","relative","barHeight","barWidth","orientation","cornerRadius","_j","animatedHeight","setAnimatedHeight","_k","animatedWidth","setAnimatedWidth","targetHeight","min","targetWidth","startTime","Date","now","animate","elapsed","progress","easeOutQuart","pow","requestAnimationFrame","displayWidth","displayHeight","svgWidth","svgHeight","createRoundedRectPath","x","y","width","height","radii","topLeft","topRight","bottomLeft","bottomRight","trim","replace","defaultCornerRadius","corners","viewBox","d","fill","fillOpacity","opacity","onChangeInput","onChangeSwitch"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../src/components/Input.tsx","../src/components/Switch.tsx","../src/components/Chip.tsx","../src/components/Histogram.tsx","../src/components/ProductionUnit.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect } from 'react';\nimport './Input.css';\n\ninterface InputProps {\n label: string;\n value?: string;\n onChange?: (value: string) => void;\n type?: 'text' | 'email' | 'password' | 'number';\n disabled?: boolean;\n error?: string;\n className?: string;\n required?: boolean;\n}\n\nexport const Input: React.FC<InputProps> = ({\n label,\n value = '',\n onChange,\n type = 'text',\n disabled = false,\n error,\n className = '',\n required = false,\n}) => {\n const [internalValue, setInternalValue] = useState(value);\n const [isFocused, setIsFocused] = useState(false);\n const inputRef = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n setInternalValue(value);\n }, [value]);\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n setInternalValue(newValue);\n onChange?.(newValue);\n };\n\n const handleFocus = () => {\n setIsFocused(true);\n };\n\n const handleBlur = () => {\n setIsFocused(false);\n };\n\n const isLabelFloating = isFocused || internalValue.length > 0;\n\n const containerClasses = [\n 'input-container',\n isFocused ? 'input-container--focused' : '',\n isLabelFloating ? 'input-container--floating' : '',\n error ? 'input-container--error' : '',\n disabled ? 'input-container--disabled' : '',\n className,\n ].filter(Boolean).join(' ');\n\n return (\n <div className={containerClasses}>\n <div className=\"input-field\">\n <input\n ref={inputRef}\n type={type}\n value={internalValue}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n disabled={disabled}\n required={required}\n className=\"input-element\"\n aria-label={label}\n />\n <label className=\"input-label\">\n {label}\n {required && <span className=\"input-required\">*</span>}\n </label>\n </div>\n {error && <div className=\"input-error\">{error}</div>}\n </div>\n );\n};","import React, { useState } from 'react';\nimport './Switch.css';\n\nconst imgOn = \"http://localhost:3845/assets/86c15ca80cb444eb8cc1db3e8335b63ac51c31a9.svg\";\nconst imgOff = \"http://localhost:3845/assets/ad7677e073e42d60a4ed84f42b17c5e56222a75d.svg\";\nconst imgGroupOn = \"http://localhost:3845/assets/25f95806464af11dea630fdf68fa80d5415c7da4.svg\";\nconst imgGroupOff = \"http://localhost:3845/assets/164245110dc3649da31e9ff08005286a44c3c907.svg\";\n\ninterface SwitchProps {\n checked?: boolean;\n onChange?: (checked: boolean) => void;\n disabled?: boolean;\n size?: 'small' | 'medium' | 'large';\n label?: string;\n className?: string;\n showIcon?: boolean;\n}\n\nexport const Switch: React.FC<SwitchProps> = ({\n checked = false,\n onChange,\n disabled = false,\n size = 'medium',\n label,\n className = '',\n showIcon = true,\n}) => {\n const [internalChecked, setInternalChecked] = useState(checked);\n\n const handleToggle = () => {\n if (disabled) return;\n \n const newChecked = !internalChecked;\n setInternalChecked(newChecked);\n onChange?.(newChecked);\n };\n\n const switchClasses = [\n 'switch',\n `switch--${size}`,\n internalChecked ? 'switch--checked' : '',\n disabled ? 'switch--disabled' : '',\n className,\n ].filter(Boolean).join(' ');\n\n return (\n <div className=\"switch-container\">\n {label && (\n <label className=\"switch-label\" htmlFor={`switch-${Math.random()}`}>\n {label}\n </label>\n )}\n <div className=\"switch-wrapper\">\n {showIcon && (\n <div className=\"switch-icon\">\n <img \n alt=\"Power icon\" \n src={internalChecked ? imgOn : imgOff}\n className=\"switch-power-icon\"\n />\n </div>\n )}\n <button\n type=\"button\"\n role=\"switch\"\n aria-checked={internalChecked}\n className={switchClasses}\n onClick={handleToggle}\n disabled={disabled}\n >\n <span className=\"switch-track\">\n <span className=\"switch-thumb\">\n {internalChecked && (\n <img \n alt=\"\" \n src={imgGroupOn} \n className=\"switch-thumb-icon\"\n />\n )}\n {!internalChecked && (\n <img \n alt=\"\" \n src={imgGroupOff} \n className=\"switch-thumb-icon\"\n />\n )}\n </span>\n </span>\n </button>\n </div>\n </div>\n );\n};","import React from \"react\";\nimport \"./Chip.css\";\n\ninterface ChipProps {\n // Define any props you want to pass to the Chip component\n label?: string;\n bgColor?: string;\n textColor?: string;\n}\n\nexport const Chip: React.FC<ChipProps> = ({ label, bgColor, textColor }) => {\n return (\n <div className=\"chip-container\" style={{ backgroundColor: bgColor }}>\n <div className=\"chip-content\">\n <p className=\"chip-label\" style={{ color: textColor }}>\n {label}\n </p>\n </div>\n </div>\n );\n};\n","import React, { useEffect, useState } from \"react\";\nimport \"./Histogram.css\";\n\ninterface HistogramProps {\n /** Maximum value configuration with value and color */\n max: {\n value: number;\n color: string;\n opacity?: number;\n };\n /** Relative/current value configuration with value and color */\n relative: {\n value: number;\n color: string;\n };\n /** Height of the histogram bar in pixels */\n barHeight?: number;\n /** Width of the histogram bar in pixels */\n barWidth?: number;\n /** Orientation of the histogram - 'vertical' or 'horizontal' */\n orientation?: 'vertical' | 'horizontal';\n /** Corner radius configuration for individual corners */\n cornerRadius?: {\n topLeft?: number;\n topRight?: number;\n bottomLeft?: number;\n bottomRight?: number;\n };\n /** Child components (typically text content) */\n children?: React.ReactNode;\n}\n\nexport const Histogram: React.FC<HistogramProps> = ({\n max,\n relative,\n barHeight = 103,\n barWidth = 32,\n orientation = 'vertical',\n cornerRadius,\n children,\n}) => {\n const [animatedHeight, setAnimatedHeight] = useState(0);\n const [animatedWidth, setAnimatedWidth] = useState(0);\n\n // Calculate target dimensions based on orientation\n const targetHeight = (Math.min((relative.value / max.value) * 100, 100) / 100) * barHeight;\n const targetWidth = (Math.min((relative.value / max.value) * 100, 100) / 100) * barWidth;\n\n // Simple Chart.js-like animation: always animate from 0 to target\n useEffect(() => {\n setAnimatedHeight(0);\n setAnimatedWidth(0);\n \n const startTime = Date.now();\n const duration = 1000;\n\n const animate = () => {\n const elapsed = Date.now() - startTime;\n const progress = Math.min(elapsed / duration, 1);\n\n // Chart.js-like easing (easeOutQuart)\n const easeOutQuart = 1 - Math.pow(1 - progress, 4);\n \n setAnimatedHeight(targetHeight * easeOutQuart);\n setAnimatedWidth(targetWidth * easeOutQuart);\n\n if (progress < 1) {\n requestAnimationFrame(animate);\n }\n };\n\n requestAnimationFrame(animate);\n }, [targetHeight, targetWidth]);\n\n const displayWidth = orientation === 'horizontal' ? barHeight : barWidth;\n const displayHeight = orientation === 'horizontal' ? barWidth : barHeight;\n const svgWidth = orientation === 'horizontal' ? barHeight : barWidth;\n const svgHeight = orientation === 'horizontal' ? barWidth : barHeight;\n\n // Helper function to create rounded rectangle path\n const createRoundedRectPath = (\n x: number,\n y: number,\n width: number,\n height: number,\n radii: { topLeft: number; topRight: number; bottomLeft: number; bottomRight: number }\n ) => {\n const { topLeft, topRight, bottomLeft, bottomRight } = radii;\n \n return `\n M ${x + topLeft} ${y}\n L ${x + width - topRight} ${y}\n Q ${x + width} ${y} ${x + width} ${y + topRight}\n L ${x + width} ${y + height - bottomRight}\n Q ${x + width} ${y + height} ${x + width - bottomRight} ${y + height}\n L ${x + bottomLeft} ${y + height}\n Q ${x} ${y + height} ${x} ${y + height - bottomLeft}\n L ${x} ${y + topLeft}\n Q ${x} ${y} ${x + topLeft} ${y}\n Z\n `.trim().replace(/\\s+/g, ' ');\n };\n\n // Default corner radius values\n const defaultCornerRadius = { topLeft: 2, topRight: 2, bottomLeft: 2, bottomRight: 2 };\n const corners = cornerRadius ? {\n topLeft: cornerRadius.topLeft ?? defaultCornerRadius.topLeft,\n topRight: cornerRadius.topRight ?? defaultCornerRadius.topRight,\n bottomLeft: cornerRadius.bottomLeft ?? defaultCornerRadius.bottomLeft,\n bottomRight: cornerRadius.bottomRight ?? defaultCornerRadius.bottomRight,\n } : defaultCornerRadius;\n\n return (\n <div className={`histogram-container ${orientation === 'horizontal' ? 'histogram-container--horizontal' : ''}`}>\n <div className={`histogram-content ${orientation === 'horizontal' ? 'histogram-content--horizontal' : ''}`}>\n <div \n className=\"histogram-bar\"\n style={{\n height: `${displayHeight}px`,\n width: `${displayWidth}px`\n }}\n >\n <svg\n width={svgWidth}\n height={svgHeight}\n viewBox={`0 0 ${svgWidth} ${svgHeight}`}\n className=\"histogram-svg\"\n >\n {/* Background bar (max value) */}\n <path\n d={createRoundedRectPath(0, 0, svgWidth, svgHeight, corners)}\n fill={max.color}\n fillOpacity={max.opacity || 1}\n />\n {/* Foreground bar (relative value) with animation */}\n {orientation === 'vertical' ? (\n <path\n d={createRoundedRectPath(\n 0,\n svgHeight - animatedHeight,\n svgWidth,\n animatedHeight,\n {\n topLeft: animatedHeight >= svgHeight ? corners.topLeft : 0,\n topRight: animatedHeight >= svgHeight ? corners.topRight : 0,\n bottomLeft: corners.bottomLeft,\n bottomRight: corners.bottomRight,\n }\n )}\n fill={relative.color}\n />\n ) : (\n <path\n d={createRoundedRectPath(\n 0,\n 0,\n animatedWidth,\n svgHeight,\n {\n topLeft: corners.topLeft,\n topRight: animatedWidth >= svgWidth ? corners.topRight : 0,\n bottomLeft: corners.bottomLeft,\n bottomRight: animatedWidth >= svgWidth ? corners.bottomRight : 0,\n }\n )}\n fill={relative.color}\n />\n )}\n </svg>\n </div>\n {children && (\n <div className={`histogram-text-container ${orientation === 'horizontal' ? 'histogram-text-container--horizontal' : ''}`}>\n {children}\n </div>\n )}\n </div>\n </div>\n );\n};\n","import { Input } from \"./Input\";\nimport { Switch } from \"./Switch\";\ninterface ProductionUnitProps {\n onChangeInput?: (value: number) => void;\n onChangeSwitch?: (checked: boolean) => void;\n value?: number;\n checked?: boolean;\n}\nexport const ProductionUnit = ({\n onChangeInput,\n onChangeSwitch,\n value,\n checked,\n}: ProductionUnitProps) => {\n return (\n <div className=\"production-unit-container\">\n <Input\n label=\"Production Unit\"\n type=\"number\"\n onChange={\n onChangeInput\n ? (val: string) => onChangeInput(Number(val))\n : undefined\n }\n value={value !== undefined ? value.toString() : undefined}\n />\n <Switch\n label=\"Production Unit\"\n checked={checked}\n onChange={onChangeSwitch}\n className=\"production-unit-switch\"\n />\n </div>\n );\n};\n"],"names":["Input","_a","label","_b","value","onChange","_c","type","_d","disabled","error","_e","className","_f","required","_g","useState","internalValue","setInternalValue","_h","isFocused","setIsFocused","inputRef","useRef","useEffect","containerClasses","length","filter","Boolean","join","_jsxs","_jsx","ref","e","newValue","target","onFocus","onBlur","children","jsx","Switch","checked","size","showIcon","internalChecked","setInternalChecked","switchClasses","concat","htmlFor","Math","random","alt","src","role","onClick","newChecked","bgColor","textColor","style","backgroundColor","color","max","relative","barHeight","barWidth","orientation","cornerRadius","_j","animatedHeight","setAnimatedHeight","_k","animatedWidth","setAnimatedWidth","targetHeight","min","targetWidth","startTime","Date","now","animate","elapsed","progress","easeOutQuart","pow","requestAnimationFrame","displayWidth","displayHeight","svgWidth","svgHeight","createRoundedRectPath","x","y","width","height","radii","topLeft","topRight","bottomLeft","bottomRight","trim","replace","defaultCornerRadius","corners","viewBox","d","fill","fillOpacity","opacity","onChangeInput","onChangeSwitch","val","Number","undefined","toString"],"mappings":"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"}
|