{"version":3,"file":"Use_case_grid_tablet.Dat6tIvJ.mjs","names":["useState"],"sources":["https:/framerusercontent.com/modules/aUUY0JKgGOLzikQMqx3M/LAIudkqdHFURU8hZaZOy/Use_case_grid_tablet.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{addPropertyControls,ControlType}from\"framer\";import{useState}from\"react\";// Tablet sizing - similar to desktop but slightly different aspect ratio\nconst CSS_ASPECT_RATIO=\"4 / 3\"// More square for tablet\n;/**\n * @framerSupportedLayoutWidth any\n * @framerSupportedLayoutHeight any\n */export default function UseCaseGridTablet(props){const tabs=[{id:\"1\",label:props.tab1Label||\"Standard Operating Procedure\",url:props.tab1Image||\"https://prod-limesync-files.s3.ap-southeast-2.amazonaws.com/limesync_sop_example.png\",type:\"image\"},{id:\"2\",label:props.tab2Label||\"BPMN\",url:props.tab2Image||\"https://prod-limesync-files.s3.ap-southeast-2.amazonaws.com/limesync_process_map.png\",type:\"image\"},{id:\"3\",label:props.tab3Label||\"Tutorial Video\",url:props.tab3Video||\"https://prod-limesync-files.s3.ap-southeast-2.amazonaws.com/limesync_onboarding_video.mp4\",type:\"video\"}];const[activeTabId,setActiveTabId]=useState(tabs[0]?.id);const containerStyle={width:\"100%\",aspectRatio:CSS_ASPECT_RATIO,display:\"flex\",flexDirection:\"column\",backgroundColor:\"#ffffff\",borderRadius:12,overflow:\"hidden\",position:\"relative\",fontFamily:'\"Geist\", \"Inter\", sans-serif',border:\"1px solid #e0e0e0\",margin:\"0 auto\"};const tabBarContainerStyle={width:\"100%\",borderBottom:\"1px solid #e5e5e5\",backgroundColor:\"#F9F9FB\",position:\"relative\",flexShrink:0};const tabBarScrollStyle={display:\"flex\",justifyContent:\"center\",overflowX:\"auto\",scrollbarWidth:\"none\",msOverflowStyle:\"none\",padding:\"0\",gap:0,width:\"100%\"};const tabItemStyle=(isActive,isFirst,isLast)=>({padding:\"14px 0\",cursor:\"pointer\",whiteSpace:\"nowrap\",fontSize:\"14px\",fontWeight:isActive?600:400,color:\"#3d3d3d\",width:\"100%\",flex:1,textAlign:\"center\",borderBottom:isActive?\"4px solid #2660c4\":\"4px solid transparent\",borderRight:\"1px solid #e5e5e5\",borderLeft:isFirst?\"1px solid #e5e5e5\":\"none\",transition:\"border-bottom 0.2s, font-weight 0.2s\",display:\"flex\",alignItems:\"center\",justifyContent:\"center\",background:\"transparent\",boxSizing:\"border-box\",borderTop:\"none\"});// Premium gradient background\nconst grainSvg=`url(\"data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.2' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E\")`;const contentAreaStyle={position:\"relative\",width:\"100%\",flex:1,// Holographic-like gradient\nbackground:`linear-gradient(135deg, \n            #2660c4 0%, \n            #7eaae6 40%, \n            #d6ecf8 80%, \n            #ffe4c4 100%)`,overflow:\"hidden\",minHeight:200,display:\"flex\"};// Grain overlay style\nconst grainOverlayStyle={position:\"absolute\",top:0,left:0,right:0,bottom:0,backgroundImage:grainSvg,opacity:.25,pointerEvents:\"none\",mixBlendMode:\"overlay\"};// Matte finish overlay with color shifts\nconst matteOverlayStyle={position:\"absolute\",top:0,left:0,right:0,bottom:0,background:`radial-gradient(circle at 10% 90%, rgba(200, 160, 255, 0.4) 0%, rgba(255, 255, 255, 0) 50%),\n                     radial-gradient(circle at 90% 10%, rgba(255, 200, 180, 0.3) 0%, rgba(255, 255, 255, 0) 50%)`,pointerEvents:\"none\",mixBlendMode:\"screen\"};return /*#__PURE__*/_jsxs(\"div\",{style:containerStyle,children:[/*#__PURE__*/_jsx(\"div\",{style:tabBarContainerStyle,children:/*#__PURE__*/_jsx(\"div\",{style:tabBarScrollStyle,children:tabs.map((tab,index)=>{const isActive=tab.id===activeTabId;const isFirst=index===0;const isLast=index===tabs.length-1;return /*#__PURE__*/_jsx(\"div\",{style:tabItemStyle(isActive,isFirst,isLast),onClick:()=>setActiveTabId(tab.id),children:tab.label},tab.id);})})}),/*#__PURE__*/_jsxs(\"div\",{style:contentAreaStyle,children:[/*#__PURE__*/_jsx(\"div\",{style:grainOverlayStyle}),/*#__PURE__*/_jsx(\"div\",{style:matteOverlayStyle}),tabs.map(tab=>/*#__PURE__*/_jsx(TabContent,{tab:tab,isActive:tab.id===activeTabId},tab.id))]}),/*#__PURE__*/_jsx(\"style\",{children:`\n                ::-webkit-scrollbar {\n                    display: none;\n                }\n            `})]});}// Simple TabContent with native browser video controls (like phone version)\nfunction TabContent({tab,isActive}){const wrapperStyle={width:\"100%\",height:\"100%\",position:\"absolute\",top:0,left:0,display:isActive?\"flex\":\"none\",alignItems:\"center\",justifyContent:\"center\"};const mediaStyle={maxWidth:\"90%\",maxHeight:\"90%\",width:\"auto\",height:\"auto\",objectFit:\"contain\",display:\"block\",boxShadow:\"0 2px 8px rgba(0,0,0,0.1)\",borderRadius:\"4px\"};if(!tab.url)return null;return /*#__PURE__*/_jsx(\"div\",{style:wrapperStyle,children:tab.type===\"video\"?/*#__PURE__*/_jsx(\"video\",{src:tab.url,style:mediaStyle,controls:true,playsInline:true,preload:\"metadata\"}):/*#__PURE__*/_jsx(\"img\",{src:tab.url,alt:tab.label,style:mediaStyle})});}addPropertyControls(UseCaseGridTablet,{tab1Label:{type:ControlType.String,title:\"Tab 1 Label\",defaultValue:\"Standard Operating Procedure\"},tab1Image:{type:ControlType.Image,title:\"Tab 1 Image\"},tab2Label:{type:ControlType.String,title:\"Tab 2 Label\",defaultValue:\"BPMN\"},tab2Image:{type:ControlType.Image,title:\"Tab 2 Image\"},tab3Label:{type:ControlType.String,title:\"Tab 3 Label\",defaultValue:\"Tutorial Video\"},tab3Video:{type:ControlType.String,title:\"Tab 3 Video URL\",defaultValue:\"https://prod-limesync-files.s3.ap-southeast-2.amazonaws.com/limesync_onboarding_video.mp4\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"UseCaseGridTablet\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutWidth\":\"any\",\"framerContractVersion\":\"1\",\"framerSupportedLayoutHeight\":\"any\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./Use_case_grid_tablet.map"],"mappings":"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"}