ioloco-ui
Advanced tools
Comparing version 0.3.107 to 0.3.108
@@ -12,4 +12,11 @@ import React from 'react'; | ||
backgroundColor?: string; | ||
color?: string; | ||
color?: string | { | ||
default: string; | ||
[key: string]: string; | ||
}; | ||
border?: string; | ||
borderWidth?: string | { | ||
default: string; | ||
[key: string]: string; | ||
}; | ||
borderRadius?: string; | ||
@@ -22,2 +29,20 @@ display?: string; | ||
textAlign?: string; | ||
':hover'?: { | ||
borderWidth?: string | { | ||
default: string; | ||
[key: string]: string; | ||
}; | ||
color?: string | { | ||
default: string; | ||
[key: string]: string; | ||
}; | ||
backgroundColor?: string | { | ||
default: string; | ||
[key: string]: string; | ||
}; | ||
border?: string | { | ||
default: string; | ||
[key: string]: string; | ||
}; | ||
}; | ||
}>; | ||
@@ -24,0 +49,0 @@ interface IButton { |
"use client"; | ||
import{jsxs as l,jsx as n}from"react/jsx-runtime";import{useState as o,useRef as t,useEffect as r,useCallback as e}from"react";import d from"@stylexjs/stylex";function i(i){let{variant:u="filled",size:s="medium",active:b,tabs:c,children:g,onTabChange:p,ariaLabel:m="Content Tabs"}=i;const[x,h]=o(b),[$,f]=o(x),[y,B]=o(-1),S=t([]),k=Array.isArray(g)?g:[g];r((()=>{const l=setTimeout((()=>f(x)),300);return()=>clearTimeout(l)}),[x]),r((()=>{S.current=S.current.slice(0,c.length)}),[c]);const v=e(((l,n)=>{var o;const t=c.length;let r=n;switch(l.key){case"ArrowRight":case"ArrowDown":r=(n+1)%t,l.preventDefault();break;case"ArrowLeft":case"ArrowUp":r=(n-1+t)%t,l.preventDefault();break;case"Home":r=0,l.preventDefault();break;case"End":r=t-1,l.preventDefault();break;default:return}null===(o=S.current[r])||void 0===o||o.focus(),B(r);const e=c[r];h(e),null==p||p(e)}),[c,p]),C=l=>`tab-${l.toLowerCase()}`,T=l=>`panel-${l.toLowerCase()}`,R=a[`${s}Tab`],w=a[`${u}Container`],W=a[`${u}TabsList`],I=a[`${u}ActiveTab`];return l("div",Object.assign({},d.props(a.container,w),{role:"region","aria-label":m,children:[n("div",Object.assign({},d.props(a.tabs,W),{role:"tablist","aria-label":m,children:null==c?void 0:c.map(((l,o)=>n("button",Object.assign({ref:l=>{S.current[o]=l},id:C(l),role:"tab","aria-selected":x===l,"aria-controls":T(l),tabIndex:x===l?0:-1},d.props([a.tab,R,x===l&&I,y===o&&a[`${u}FocusedTab`]]),{onClick:()=>((l,n)=>{h(l),B(n),null==p||p(l)})(l,o),onKeyDown:l=>v(l,o),children:l}),l)))})),n("div",Object.assign({},{className:"x1n2onr6 xh8yej3"},{children:k.map(((l,o)=>n("div",Object.assign({id:T(c[o]),role:"tabpanel","aria-labelledby":C(c[o]),tabIndex:0},d.props([a.tabPanel,$===c[o]&&a.activePanel]),{children:l}),c[o])))}))]}))}const a={container:{width:"xh8yej3",$$css:!0},tabs:{display:"x78zum5",marginBottom:"x1t84w78",$$css:!0},tab:{cursor:"x1ypdohk",background:"x1md70p1",backgroundAttachment:null,backgroundClip:null,backgroundColor:null,backgroundImage:null,backgroundOrigin:null,backgroundPosition:null,backgroundPositionX:null,backgroundPositionY:null,backgroundRepeat:null,backgroundSize:null,border:"x1gs6z28",borderWidth:null,borderInlineWidth:null,borderInlineStartWidth:null,borderLeftWidth:null,borderInlineEndWidth:null,borderRightWidth:null,borderBlockWidth:null,borderTopWidth:null,borderBottomWidth:null,borderStyle:null,borderInlineStyle:null,borderInlineStartStyle:null,borderLeftStyle:null,borderInlineEndStyle:null,borderRightStyle:null,borderBlockStyle:null,borderTopStyle:null,borderBottomStyle:null,borderColor:null,borderInlineColor:null,borderInlineStartColor:null,borderLeftColor:null,borderInlineEndColor:null,borderRightColor:null,borderBlockColor:null,borderTopColor:null,borderBottomColor:null,fontWeight:"xk50ysn",transition:"x169l3ba",transitionBehavior:null,transitionDelay:null,transitionDuration:null,transitionProperty:null,transitionTimingFunction:null,color:"x6u426u xergv63",$$css:!0},content:{position:"x1n2onr6",width:"xh8yej3",$$css:!0},tabPanel:{display:"x1s85apg",width:"xh8yej3",$$css:!0},activePanel:{display:"x1lliihq",$$css:!0},filledContainer:{$$css:!0},filledTabsList:{borderBottom:"x3iih9a xmu4vb5",borderBottomWidth:null,borderBottomStyle:null,borderBottomColor:null,$$css:!0},filledActiveTab:{color:"xod0wng xxgsoov",backgroundColor:"xas4zb2 x1hr95wy",borderRadius:"xr78m7q",borderStartStartRadius:null,borderStartEndRadius:null,borderEndStartRadius:null,borderEndEndRadius:null,borderTopLeftRadius:null,borderTopRightRadius:null,borderBottomLeftRadius:null,borderBottomRightRadius:null,$$css:!0},filledFocusedTab:{outline:"x1o9r4pz",outlineColor:null,outlineStyle:null,outlineWidth:null,outlineOffset:"x2ssjo2",$$css:!0},elegantContainer:{$$css:!0},elegantTabsList:{borderBottom:"x3iih9a xmu4vb5",borderBottomWidth:null,borderBottomStyle:null,borderBottomColor:null,$$css:!0},elegantActiveTab:{color:"xod0wng xxgsoov",borderBottom:"x1aadtzq x1ch221x",borderBottomWidth:null,borderBottomStyle:null,borderBottomColor:null,$$css:!0},elegantFocusedTab:{borderBottom:"x2xfnqx xtg7bjb",borderBottomWidth:null,borderBottomStyle:null,borderBottomColor:null,outline:"x1a2a7pz",outlineColor:null,outlineOffset:null,outlineStyle:null,outlineWidth:null,$$css:!0},smallTab:{fontSize:"xml2kzp",padding:"xpqh473",paddingInline:null,paddingStart:null,paddingLeft:null,paddingEnd:null,paddingRight:null,paddingBlock:null,paddingTop:null,paddingBottom:null,$$css:!0},mediumTab:{fontSize:"x1uv3qv7",padding:"x17v3l2f",paddingInline:null,paddingStart:null,paddingLeft:null,paddingEnd:null,paddingRight:null,paddingBlock:null,paddingTop:null,paddingBottom:null,$$css:!0},largeTab:{fontSize:"x1elmx46",padding:"xu4qjhp",paddingInline:null,paddingStart:null,paddingLeft:null,paddingEnd:null,paddingRight:null,paddingBlock:null,paddingTop:null,paddingBottom:null,$$css:!0}};export{i as default}; | ||
import{jsxs as l,jsx as n}from"react/jsx-runtime";import{useState as o,useRef as r,useEffect as t,useCallback as e}from"react";import d from"@stylexjs/stylex";function i(i){let{variant:u="filled",size:s="medium",active:b,tabs:c,children:g,onTabChange:p,ariaLabel:m="Content Tabs"}=i;const[h,x]=o(b),[$,y]=o(h),[f,B]=o(-1),k=r([]),S=Array.isArray(g)?g:[g];t((()=>{const l=setTimeout((()=>y(h)),300);return()=>clearTimeout(l)}),[h]),t((()=>{k.current=k.current.slice(0,c.length)}),[c]);const v=e(((l,n)=>{var o;const r=c.length;let t=n;switch(l.key){case"ArrowRight":case"ArrowDown":t=(n+1)%r,l.preventDefault();break;case"ArrowLeft":case"ArrowUp":t=(n-1+r)%r,l.preventDefault();break;case"Home":t=0,l.preventDefault();break;case"End":t=r-1,l.preventDefault();break;default:return}null===(o=k.current[t])||void 0===o||o.focus(),B(t);const e=c[t];x(e),null==p||p(e)}),[c,p]),C=l=>`tab-${l.toLowerCase()}`,T=l=>`panel-${l.toLowerCase()}`,R=a[`${s}Tab`],w=a[`${u}Container`],I=a[`${u}TabsList`],L=a[`${u}ActiveTab`];return l("div",Object.assign({},d.props(a.container,w),{role:"region","aria-label":m,children:[n("div",Object.assign({},d.props(a.tabs,I),{role:"tablist","aria-label":m,children:null==c?void 0:c.map(((l,o)=>n("button",Object.assign({ref:l=>{k.current[o]=l},id:C(l),role:"tab","aria-selected":h===l,"aria-controls":T(l),tabIndex:h===l?0:-1},d.props([a.tab,R,h===l&&L,f===o&&a[`${u}FocusedTab`]]),{onClick:()=>((l,n)=>{x(l),B(n),null==p||p(l)})(l,o),onKeyDown:l=>v(l,o),children:l}),l)))})),n("div",Object.assign({},{className:"x1n2onr6 xh8yej3"},{children:S.map(((l,o)=>n("div",Object.assign({id:T(c[o]),role:"tabpanel","aria-labelledby":C(c[o]),tabIndex:0},d.props([a.tabPanel,$===c[o]&&a.activePanel]),{children:l}),c[o])))}))]}))}const a={container:{width:"xh8yej3",$$css:!0},tabs:{display:"x78zum5",marginBottom:"x1t84w78",$$css:!0},tab:{cursor:"x1ypdohk",background:"x1md70p1",backgroundAttachment:null,backgroundClip:null,backgroundColor:null,backgroundImage:null,backgroundOrigin:null,backgroundPosition:null,backgroundPositionX:null,backgroundPositionY:null,backgroundRepeat:null,backgroundSize:null,border:"x1gs6z28",borderWidth:null,borderInlineWidth:null,borderInlineStartWidth:null,borderLeftWidth:null,borderInlineEndWidth:null,borderRightWidth:null,borderBlockWidth:null,borderTopWidth:null,borderBottomWidth:null,borderStyle:null,borderInlineStyle:null,borderInlineStartStyle:null,borderLeftStyle:null,borderInlineEndStyle:null,borderRightStyle:null,borderBlockStyle:null,borderTopStyle:null,borderBottomStyle:null,borderColor:null,borderInlineColor:null,borderInlineStartColor:null,borderLeftColor:null,borderInlineEndColor:null,borderRightColor:null,borderBlockColor:null,borderTopColor:null,borderBottomColor:null,fontWeight:"xk50ysn",transition:"x169l3ba",transitionBehavior:null,transitionDelay:null,transitionDuration:null,transitionProperty:null,transitionTimingFunction:null,color:"x6u426u xergv63",$$css:!0},content:{position:"x1n2onr6",width:"xh8yej3",$$css:!0},tabPanel:{display:"x1s85apg",width:"xh8yej3",$$css:!0},activePanel:{display:"x1lliihq",$$css:!0},filledContainer:{$$css:!0},filledTabsList:{borderBottom:"x3iih9a xmu4vb5",borderBottomWidth:null,borderBottomStyle:null,borderBottomColor:null,$$css:!0},filledActiveTab:{color:"xod0wng xxgsoov",backgroundColor:"xas4zb2 x1hr95wy",borderRadius:"xr78m7q",borderStartStartRadius:null,borderStartEndRadius:null,borderEndStartRadius:null,borderEndEndRadius:null,borderTopLeftRadius:null,borderTopRightRadius:null,borderBottomLeftRadius:null,borderBottomRightRadius:null,$$css:!0},elegantContainer:{$$css:!0},elegantTabsList:{borderBottom:"x3iih9a xmu4vb5",borderBottomWidth:null,borderBottomStyle:null,borderBottomColor:null,$$css:!0},elegantActiveTab:{color:"xod0wng xxgsoov",borderBottom:"x16wai8e x15cxok5",borderBottomWidth:null,borderBottomStyle:null,borderBottomColor:null,$$css:!0},elegantFocusedTab:{borderBottom:"x1nwicqu xjz7amn",borderBottomWidth:null,borderBottomStyle:null,borderBottomColor:null,outline:"x1a2a7pz",outlineColor:null,outlineOffset:null,outlineStyle:null,outlineWidth:null,$$css:!0},smallTab:{fontSize:"xml2kzp",padding:"xpqh473",paddingInline:null,paddingStart:null,paddingLeft:null,paddingEnd:null,paddingRight:null,paddingBlock:null,paddingTop:null,paddingBottom:null,$$css:!0},mediumTab:{fontSize:"x1uv3qv7",padding:"x17v3l2f",paddingInline:null,paddingStart:null,paddingLeft:null,paddingEnd:null,paddingRight:null,paddingBlock:null,paddingTop:null,paddingBottom:null,$$css:!0},largeTab:{fontSize:"x1elmx46",padding:"xu4qjhp",paddingInline:null,paddingStart:null,paddingLeft:null,paddingEnd:null,paddingRight:null,paddingBlock:null,paddingTop:null,paddingBottom:null,$$css:!0}};export{i as default}; |
@@ -9,2 +9,3 @@ export { default as Drawer } from './Components/Drawer'; | ||
export { default as Tabs } from './Components/Tabs'; | ||
export { default as Calendar } from './Components/Calendar'; | ||
export { default as Breadcrumbs } from './Components/Breadcrumbs'; | ||
@@ -11,0 +12,0 @@ export { default as FormInput } from './Components/FormComponents/FormInput'; |
@@ -1,1 +0,1 @@ | ||
export{default as Drawer}from"./Components/Drawer/index.js";export{default as Menu}from"./Components/Menu/index.js";export{default as Paper}from"./Components/Paper/index.js";export{default as Button}from"./Components/Button/index.js";export{default as BlocSection}from"./Components/BlocSection/index.js";export{default as Accordion}from"./Components/Accordion/index.js";export{default as Chip}from"./Components/Chip/index.js";export{default as Tabs}from"./Components/Tabs/index.js";export{default as Breadcrumbs}from"./Components/Breadcrumbs/index.js";export{default as FormInput}from"./Components/FormComponents/FormInput/index.js";export{default as TextArea}from"./Components/FormComponents/TextArea/index.js";export{default as CheckBox}from"./Components/FormComponents/CheckBox/index.js";export{default as ToggleSwitch}from"./Components/FormComponents/ToggleSwitch/index.js";export{default as DataList}from"./Components/FormComponents/DataList/index.js";export{default as Select}from"./Components/FormComponents/Select/index.js";export{default as DatePicker}from"./Components/FormComponents/DatePicker/index.js";export{default as Multistep}from"./Components/FormComponents/Multistep/index.js";export{default as DateTimePicker}from"./Components/FormComponents/DateTimePicker/index.js";export{default as SpacedInputGrid}from"./Components/FormComponents/SpacedInputGrid/index.js";export{default as ErrorDisplay}from"./Components/FormComponents/ErrorDisplay/index.js";export{default as FileUpload}from"./Components/FormComponents/FileUpload/index.js"; | ||
export{default as Drawer}from"./Components/Drawer/index.js";export{default as Menu}from"./Components/Menu/index.js";export{default as Paper}from"./Components/Paper/index.js";export{default as Button}from"./Components/Button/index.js";export{default as BlocSection}from"./Components/BlocSection/index.js";export{default as Accordion}from"./Components/Accordion/index.js";export{default as Chip}from"./Components/Chip/index.js";export{default as Tabs}from"./Components/Tabs/index.js";export{default as Calendar}from"./Components/Calendar/index.js";export{default as Breadcrumbs}from"./Components/Breadcrumbs/index.js";export{default as FormInput}from"./Components/FormComponents/FormInput/index.js";export{default as TextArea}from"./Components/FormComponents/TextArea/index.js";export{default as CheckBox}from"./Components/FormComponents/CheckBox/index.js";export{default as ToggleSwitch}from"./Components/FormComponents/ToggleSwitch/index.js";export{default as DataList}from"./Components/FormComponents/DataList/index.js";export{default as Select}from"./Components/FormComponents/Select/index.js";export{default as DatePicker}from"./Components/FormComponents/DatePicker/index.js";export{default as Multistep}from"./Components/FormComponents/Multistep/index.js";export{default as DateTimePicker}from"./Components/FormComponents/DateTimePicker/index.js";export{default as SpacedInputGrid}from"./Components/FormComponents/SpacedInputGrid/index.js";export{default as ErrorDisplay}from"./Components/FormComponents/ErrorDisplay/index.js";export{default as FileUpload}from"./Components/FormComponents/FileUpload/index.js"; |
{ | ||
"name": "ioloco-ui", | ||
"version": "0.3.107", | ||
"version": "0.3.108", | ||
"description": "Stylex UI components for React", | ||
@@ -5,0 +5,0 @@ "author": { |
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
165017
72
2264