{"version":3,"file":"SpecificationTable.I9q7RC61.mjs","names":["useState","useRef"],"sources":["https:/framerusercontent.com/modules/Ve4BqAIwUhbHFHpaCL6b/qgfaYTHVPDw2Qq6cdnt9/SpecificationTable.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{addPropertyControls,ControlType}from\"framer\";import{useState,useRef,startTransition,useEffect}from\"react\";/**\n * Create exactly this specification table with alternating row colors and proper styling\n *\n * @framerSupportedLayoutWidth any-prefer-fixed\n * @framerSupportedLayoutHeight auto\n */export default function SpecificationTable(props){const{headerBackgroundColor,headerTextColor,rowBackgroundColor,alternateRowBackgroundColor,textColor,borderColor,headerFont,bodyFont,specifications,enableReordering,style}=props;const[orderedSpecs,setOrderedSpecs]=useState(specifications);const[draggedIndex,setDraggedIndex]=useState(null);const[dragOverIndex,setDragOverIndex]=useState(null);const dragCounter=useRef(0);const handleDragStart=(e,index)=>{if(!enableReordering)return;setDraggedIndex(index);e.dataTransfer.effectAllowed=\"move\";e.dataTransfer.setData(\"text/html\",\"\");};const handleDragOver=(e,index)=>{if(!enableReordering||draggedIndex===null)return;e.preventDefault();e.dataTransfer.dropEffect=\"move\";setDragOverIndex(index);};const handleDragEnter=(e,index)=>{if(!enableReordering)return;dragCounter.current++;setDragOverIndex(index);};const handleDragLeave=e=>{if(!enableReordering)return;dragCounter.current--;if(dragCounter.current===0){setDragOverIndex(null);}};const handleDrop=(e,dropIndex)=>{if(!enableReordering||draggedIndex===null)return;e.preventDefault();const newSpecs=[...orderedSpecs];const draggedItem=newSpecs[draggedIndex];// Remove the dragged item\nnewSpecs.splice(draggedIndex,1);// Insert at new position\nnewSpecs.splice(dropIndex,0,draggedItem);startTransition(()=>{setOrderedSpecs(newSpecs);setDraggedIndex(null);setDragOverIndex(null);});dragCounter.current=0;};const handleDragEnd=()=>{setDraggedIndex(null);setDragOverIndex(null);dragCounter.current=0;};// Update ordered specs when specifications prop changes\nuseEffect(()=>{setOrderedSpecs(specifications);},[specifications]);return /*#__PURE__*/_jsxs(\"div\",{style:{...style,width:\"100%\",border:`1px solid ${borderColor}`,borderCollapse:\"collapse\",fontFamily:\"Arial, sans-serif\"},children:[/*#__PURE__*/_jsxs(\"div\",{style:{display:\"flex\",backgroundColor:headerBackgroundColor,color:headerTextColor,...headerFont},children:[/*#__PURE__*/_jsx(\"div\",{style:{flex:\"0 0 33.33%\",padding:\"12px 16px\",borderRight:`1px solid ${borderColor}`,fontWeight:\"bold\"},children:\"Category\"}),/*#__PURE__*/_jsx(\"div\",{style:{flex:\"0 0 33.33%\",padding:\"12px 16px\",borderRight:`1px solid ${borderColor}`,fontWeight:\"bold\"},children:\"Specification\"}),/*#__PURE__*/_jsx(\"div\",{style:{flex:\"0 0 33.33%\",padding:\"12px 16px\",fontWeight:\"bold\"},children:\"Value\"})]}),orderedSpecs.map((spec,index)=>{const isEvenRow=index%2===0;const backgroundColor=isEvenRow?rowBackgroundColor:alternateRowBackgroundColor;const isDragging=draggedIndex===index;const isDragOver=dragOverIndex===index;return /*#__PURE__*/_jsxs(\"div\",{draggable:enableReordering,onDragStart:e=>handleDragStart(e,index),onDragOver:e=>handleDragOver(e,index),onDragEnter:e=>handleDragEnter(e,index),onDragLeave:handleDragLeave,onDrop:e=>handleDrop(e,index),onDragEnd:handleDragEnd,style:{display:\"flex\",backgroundColor:isDragOver?\"#E3F2FD\":backgroundColor,color:textColor,borderBottom:`1px solid ${borderColor}`,opacity:isDragging?.5:1,cursor:enableReordering?\"grab\":\"default\",transition:\"all 0.2s ease\",transform:isDragOver?\"scale(1.02)\":\"scale(1)\",boxShadow:isDragOver?\"0 2px 8px rgba(0,0,0,0.1)\":\"none\",...bodyFont},children:[/*#__PURE__*/_jsx(\"div\",{style:{flex:\"0 0 33.33%\",padding:\"10px 16px\",borderRight:`1px solid ${borderColor}`,fontWeight:spec.category?\"500\":\"normal\"},children:spec.category}),/*#__PURE__*/_jsx(\"div\",{style:{flex:\"0 0 33.33%\",padding:\"10px 16px\",borderRight:`1px solid ${borderColor}`},children:spec.specification}),/*#__PURE__*/_jsx(\"div\",{style:{flex:\"0 0 33.33%\",padding:\"10px 16px\"},children:spec.value})]},`${spec.category}-${spec.specification}-${index}`);})]});}addPropertyControls(SpecificationTable,{headerBackgroundColor:{type:ControlType.Color,title:\"Header Background\",defaultValue:\"#2C3E50\"},headerTextColor:{type:ControlType.Color,title:\"Header Text\",defaultValue:\"#FFFFFF\"},rowBackgroundColor:{type:ControlType.Color,title:\"Row Background\",defaultValue:\"#FFFFFF\"},alternateRowBackgroundColor:{type:ControlType.Color,title:\"Alternate Row Background\",defaultValue:\"#F8F9FA\"},textColor:{type:ControlType.Color,title:\"Text Color\",defaultValue:\"#333333\"},borderColor:{type:ControlType.Color,title:\"Border Color\",defaultValue:\"#DEE2E6\"},headerFont:{type:ControlType.Font,title:\"Header Font\",defaultValue:{fontSize:\"14px\",variant:\"Bold\",letterSpacing:\"0em\",lineHeight:\"1.2em\"},controls:\"extended\",defaultFontType:\"sans-serif\"},bodyFont:{type:ControlType.Font,title:\"Body Font\",defaultValue:{fontSize:\"13px\",variant:\"Regular\",letterSpacing:\"0em\",lineHeight:\"1.3em\"},controls:\"extended\",defaultFontType:\"sans-serif\"},specifications:{type:ControlType.Array,title:\"Specifications\",control:{type:ControlType.Object,controls:{category:{type:ControlType.String,title:\"Category\",defaultValue:\"\"},specification:{type:ControlType.String,title:\"Specification\",defaultValue:\"\"},value:{type:ControlType.String,title:\"Value\",defaultValue:\"\"}}},defaultValue:[{category:\"Thickness\",specification:\"Total thickness (without protective film)\",value:\"0.47mm\"},{category:\"Sheet\",specification:\"Width\",value:\"1000, 1200, 1350, 1800 (mm)\"},{category:\"\",specification:\"Length\",value:\"According to customer requirements\"},{category:\"Roll\",specification:\"Width\",value:\"1020, 1220, 1520, 1850 (mm)\"},{category:\"\",specification:\"Length\",value:\"≤ 50m/Roll\"},{category:\"Roll tube\",specification:\"Inner Diameter\",value:\"6 inches\"},{category:\"Operating voltage\",specification:\"ON\",value:\"60V\"},{category:\"Operating voltage\",specification:\"ON\",value:\"60V\"},{category:\"Power consumption\",specification:\"ON\",value:\"≤ 5W/m\\xb2\"},{category:\"Viewing angle\",specification:\"ON\",value:\"≥ 160\\xb0\"},{category:\"UV blocking rate\",specification:\"OFF\",value:\"≥ 99%\"},{category:\"Infrared blocking rate\",specification:\"OFF\",value:\"≥ 60%\"},{category:\"Response time\",specification:\"OFF→ON\",value:\"≤ 30ms\"},{category:\"\",specification:\"ON→OFF\",value:\"≤ 200ms\"},{category:\"Operating temperature\",specification:\"\",value:\"-30\\xb0C ~55\\xb0C\"},{category:\"Lifetime\",specification:\"\",value:\"10~15 years\"},{category:\"Switching times\",specification:\"\",value:\"≥2 million times\"},{category:\"Storage humidity\",specification:\"\",value:\"-40\\xb0C~70\\xb0C\"},{category:\"Storage humidity\",specification:\"\",value:\"5~98%\"},{category:\"Control method\",specification:\"\",value:\"Mobile phone/computer\"},{category:\"Support video\",specification:\"\",value:\"Internal storage / U disk / synchronization\"},{category:\"Screen material\",specification:\"\",value:\"Flexible substrate + organic resin\"}]}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"SpecificationTable\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutHeight\":\"auto\",\"framerSupportedLayoutWidth\":\"any-prefer-fixed\",\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./SpecificationTable.map"],"mappings":"sMAKG,SAAwB,EAAmB,EAAM,CAAC,GAAK,CAAC,wBAAsB,kBAAgB,qBAAmB,8BAA4B,YAAU,cAAY,aAAW,WAAS,iBAAe,mBAAiB,SAAO,EAAW,CAAC,EAAa,GAAiBA,EAAS,EAAe,CAAM,CAAC,EAAa,GAAiBA,EAAS,KAAK,CAAM,CAAC,EAAc,GAAkBA,EAAS,KAAK,CAAO,EAAYC,EAAO,EAAE,CAAO,GAAiB,EAAE,IAAQ,CAAK,IAAwB,EAAgB,EAAM,CAAC,EAAE,aAAa,cAAc,OAAO,EAAE,aAAa,QAAQ,YAAY,GAAG,GAAS,GAAgB,EAAE,IAAQ,CAAI,CAAC,GAAkB,IAAe,OAAY,EAAE,gBAAgB,CAAC,EAAE,aAAa,WAAW,OAAO,EAAiB,EAAM,GAAS,GAAiB,EAAE,IAAQ,CAAK,IAAwB,EAAY,UAAU,EAAiB,EAAM,GAAS,EAAgB,GAAG,CAAK,IAAwB,EAAY,UAAa,EAAY,UAAU,GAAG,EAAiB,KAAK,GAAU,GAAY,EAAE,IAAY,CAAC,GAAG,CAAC,GAAkB,IAAe,KAAK,OAAO,EAAE,gBAAgB,CAAC,IAAM,EAAS,CAAC,GAAG,EAAa,CAAO,EAAY,EAAS,GAC3nC,EAAS,OAAO,EAAa,EAAE,CAC/B,EAAS,OAAO,EAAU,EAAE,EAAY,CAAC,MAAoB,CAAC,EAAgB,EAAS,CAAC,EAAgB,KAAK,CAAC,EAAiB,KAAK,EAAG,CAAC,EAAY,QAAQ,GAAU,MAAkB,CAAC,EAAgB,KAAK,CAAC,EAAiB,KAAK,CAAC,EAAY,QAAQ,GACvL,OAAnE,MAAc,CAAC,EAAgB,EAAe,EAAG,CAAC,EAAe,CAAC,CAAqB,EAAM,MAAM,CAAC,MAAM,CAAC,GAAG,EAAM,MAAM,OAAO,OAAO,aAAa,IAAc,eAAe,WAAW,WAAW,oBAAoB,CAAC,SAAS,CAAc,EAAM,MAAM,CAAC,MAAM,CAAC,QAAQ,OAAO,gBAAgB,EAAsB,MAAM,EAAgB,GAAG,EAAW,CAAC,SAAS,CAAc,EAAK,MAAM,CAAC,MAAM,CAAC,KAAK,aAAa,QAAQ,YAAY,YAAY,aAAa,IAAc,WAAW,OAAO,CAAC,SAAS,WAAW,CAAC,CAAc,EAAK,MAAM,CAAC,MAAM,CAAC,KAAK,aAAa,QAAQ,YAAY,YAAY,aAAa,IAAc,WAAW,OAAO,CAAC,SAAS,gBAAgB,CAAC,CAAc,EAAK,MAAM,CAAC,MAAM,CAAC,KAAK,aAAa,QAAQ,YAAY,WAAW,OAAO,CAAC,SAAS,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,EAAa,KAAK,EAAK,IAAQ,CAA6B,IAAM,EAAlB,EAAM,GAAI,EAAkC,EAAmB,EAAkC,EAAW,IAAe,EAAY,EAAW,IAAgB,EAAM,OAAoB,EAAM,MAAM,CAAC,UAAU,EAAiB,YAAY,GAAG,EAAgB,EAAE,EAAM,CAAC,WAAW,GAAG,EAAe,EAAE,EAAM,CAAC,YAAY,GAAG,EAAgB,EAAE,EAAM,CAAC,YAAY,EAAgB,OAAO,GAAG,EAAW,EAAE,EAAM,CAAC,UAAU,EAAc,MAAM,CAAC,QAAQ,OAAO,gBAAgB,EAAW,UAAU,EAAgB,MAAM,EAAU,aAAa,aAAa,IAAc,QAAQ,EAAW,GAAG,EAAE,OAAO,EAAiB,OAAO,UAAU,WAAW,gBAAgB,UAAU,EAAW,cAAc,WAAW,UAAU,EAAW,4BAA4B,OAAO,GAAG,EAAS,CAAC,SAAS,CAAc,EAAK,MAAM,CAAC,MAAM,CAAC,KAAK,aAAa,QAAQ,YAAY,YAAY,aAAa,IAAc,WAAW,EAAK,SAAS,MAAM,SAAS,CAAC,SAAS,EAAK,SAAS,CAAC,CAAc,EAAK,MAAM,CAAC,MAAM,CAAC,KAAK,aAAa,QAAQ,YAAY,YAAY,aAAa,IAAc,CAAC,SAAS,EAAK,cAAc,CAAC,CAAc,EAAK,MAAM,CAAC,MAAM,CAAC,KAAK,aAAa,QAAQ,YAAY,CAAC,SAAS,EAAK,MAAM,CAAC,CAAC,CAAC,CAAC,GAAG,EAAK,SAAS,GAAG,EAAK,cAAc,GAAG,IAAQ,EAAG,CAAC,CAAC,CAAC,kBAR79D,IAAoD,IAA6D,CAQ82D,EAAoB,EAAmB,CAAC,sBAAsB,CAAC,KAAK,EAAY,MAAM,MAAM,oBAAoB,aAAa,UAAU,CAAC,gBAAgB,CAAC,KAAK,EAAY,MAAM,MAAM,cAAc,aAAa,UAAU,CAAC,mBAAmB,CAAC,KAAK,EAAY,MAAM,MAAM,iBAAiB,aAAa,UAAU,CAAC,4BAA4B,CAAC,KAAK,EAAY,MAAM,MAAM,2BAA2B,aAAa,UAAU,CAAC,UAAU,CAAC,KAAK,EAAY,MAAM,MAAM,aAAa,aAAa,UAAU,CAAC,YAAY,CAAC,KAAK,EAAY,MAAM,MAAM,eAAe,aAAa,UAAU,CAAC,WAAW,CAAC,KAAK,EAAY,KAAK,MAAM,cAAc,aAAa,CAAC,SAAS,OAAO,QAAQ,OAAO,cAAc,MAAM,WAAW,QAAQ,CAAC,SAAS,WAAW,gBAAgB,aAAa,CAAC,SAAS,CAAC,KAAK,EAAY,KAAK,MAAM,YAAY,aAAa,CAAC,SAAS,OAAO,QAAQ,UAAU,cAAc,MAAM,WAAW,QAAQ,CAAC,SAAS,WAAW,gBAAgB,aAAa,CAAC,eAAe,CAAC,KAAK,EAAY,MAAM,MAAM,iBAAiB,QAAQ,CAAC,KAAK,EAAY,OAAO,SAAS,CAAC,SAAS,CAAC,KAAK,EAAY,OAAO,MAAM,WAAW,aAAa,GAAG,CAAC,cAAc,CAAC,KAAK,EAAY,OAAO,MAAM,gBAAgB,aAAa,GAAG,CAAC,MAAM,CAAC,KAAK,EAAY,OAAO,MAAM,QAAQ,aAAa,GAAG,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,SAAS,YAAY,cAAc,4CAA4C,MAAM,SAAS,CAAC,CAAC,SAAS,QAAQ,cAAc,QAAQ,MAAM,8BAA8B,CAAC,CAAC,SAAS,GAAG,cAAc,SAAS,MAAM,qCAAqC,CAAC,CAAC,SAAS,OAAO,cAAc,QAAQ,MAAM,8BAA8B,CAAC,CAAC,SAAS,GAAG,cAAc,SAAS,MAAM,aAAa,CAAC,CAAC,SAAS,YAAY,cAAc,iBAAiB,MAAM,WAAW,CAAC,CAAC,SAAS,oBAAoB,cAAc,KAAK,MAAM,MAAM,CAAC,CAAC,SAAS,oBAAoB,cAAc,KAAK,MAAM,MAAM,CAAC,CAAC,SAAS,oBAAoB,cAAc,KAAK,MAAM,UAAa,CAAC,CAAC,SAAS,gBAAgB,cAAc,KAAK,MAAM,SAAY,CAAC,CAAC,SAAS,mBAAmB,cAAc,MAAM,MAAM,QAAQ,CAAC,CAAC,SAAS,yBAAyB,cAAc,MAAM,MAAM,QAAQ,CAAC,CAAC,SAAS,gBAAgB,cAAc,SAAS,MAAM,SAAS,CAAC,CAAC,SAAS,GAAG,cAAc,SAAS,MAAM,UAAU,CAAC,CAAC,SAAS,wBAAwB,cAAc,GAAG,MAAM,cAAoB,CAAC,CAAC,SAAS,WAAW,cAAc,GAAG,MAAM,cAAc,CAAC,CAAC,SAAS,kBAAkB,cAAc,GAAG,MAAM,mBAAmB,CAAC,CAAC,SAAS,mBAAmB,cAAc,GAAG,MAAM,aAAmB,CAAC,CAAC,SAAS,mBAAmB,cAAc,GAAG,MAAM,QAAQ,CAAC,CAAC,SAAS,iBAAiB,cAAc,GAAG,MAAM,wBAAwB,CAAC,CAAC,SAAS,gBAAgB,cAAc,GAAG,MAAM,8CAA8C,CAAC,CAAC,SAAS,kBAAkB,cAAc,GAAG,MAAM,qCAAqC,CAAC,CAAC,CAAC,CAAC"}