@neko-os/ui 0.0.13 → 0.2.0

package/dist/components/modals/router/useUpdateModalContainer.js

@@ -0,0 +1 @@
+import{useModalRouteContext}from"./ModalsRouterContext";export function useUpdateModalContainer(){var _useModalRouteContext=useModalRouteContext(),updateContainer=_useModalRouteContext.updateContainer;return updateContainer;}

package/dist/components/presentation/Avatar.js

@@ -1 +1 @@
-import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/presentation/Avatar.js";var _excluded=["initials","name","icon","src","invert","textProps","iconProps"];import{pipe}from'ramda';import{AbsView}from"../../abstractions/View";import{IconLabel}from"./IconLabel";import{Image}from"./Image";import{getDynamicColor}from"../../theme/helpers/dynamicColor";import{getInitials}from"../../helpers";import{moveScale}from"../../theme/helpers/sizeScale";import{useBackgroundModifier}from"../../modifiers/background";import{useBorderModifier}from"../../modifiers/border";import{useColorConverter}from"../../modifiers/colorConverter";import{useDefaultModifier}from"../../modifiers/default";import{useFlexWrapperModifier}from"../../modifiers/flexWrapper";import{useFullColorModifier}from"../../modifiers/fullColor";import{useMarginModifier}from"../../modifiers/margin";import{useOverflowModifier}from"../../modifiers/overflow";import{usePaddingModifier}from"../../modifiers/padding";import{usePositionModifier}from"../../modifiers/position";import{useShadowModifier}from"../../modifiers/shadow";import{useSizeConverter}from"../../modifiers/sizeConverter";import{useSizeModifier}from"../../modifiers/size";import{useThemeComponentModifier}from"../../modifiers/themeComponent";import{jsx as _jsx}from"react/jsx-runtime";var DEFAULT_PROPS=function DEFAULT_PROPS(_ref){var _ref2=_slicedToArray(_ref,2),sizeCode=_ref2[0].sizeCode,_ref2$=_ref2[1],round=_ref2$.round,square=_ref2$.square,src=_ref2$.src,dynamicColor=_ref2$.dynamicColor,color=_ref2$.color;return{padding:!!src?undefined:1,height:sizeCode,width:sizeCode,ratio:1,br:!!square?moveScale(sizeCode,-2)||sizeCode:undefined,round:!square,center:true,border:!!src?undefined:1,overflow:'hidden',color:dynamicColor!==undefined?getDynamicColor(dynamicColor):color};};export function Avatar(rootProps){var _pipe=pipe(useSizeConverter('elementHeights','md'),useThemeComponentModifier('Avatar'),useDefaultModifier(DEFAULT_PROPS),useColorConverter('text3'),useFullColorModifier,useSizeModifier,usePositionModifier,useFlexWrapperModifier,useBackgroundModifier,usePaddingModifier,useMarginModifier,useBorderModifier,useShadowModifier,useOverflowModifier)([{},rootProps]),_pipe2=_slicedToArray(_pipe,2),_pipe2$=_pipe2[0],fontColor=_pipe2$.fontColor,sizeCode=_pipe2$.sizeCode,formattedProps=_pipe2[1];var initials=formattedProps.initials,name=formattedProps.name,icon=formattedProps.icon,src=formattedProps.src,invert=formattedProps.invert,textProps=formattedProps.textProps,iconProps=formattedProps.iconProps,props=_objectWithoutProperties(formattedProps,_excluded);initials=initials||getInitials(name);var content=_jsx(IconLabel,{center:true,color:fontColor,size:sizeCode,label:!icon&&initials,icon:icon,invert:invert,textProps:Object.assign({strong:true},textProps),iconProps:iconProps});if(!!src)content=_jsx(Image,{br:0,src:src,width:sizeCode,height:sizeCode});return _jsx(AbsView,Object.assign({className:"neko-avatar"},props,{children:content}));}
+import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/presentation/Avatar.js";var _excluded=["initials","name","icon","src","invert","textProps","iconProps","iconSize"];import{pipe}from'ramda';import{AbsView}from"../../abstractions/View";import{IconLabel}from"./IconLabel";import{Image}from"./Image";import{getDynamicColor}from"../../theme/helpers/dynamicColor";import{getInitials}from"../../helpers";import{moveScale}from"../../theme/helpers/sizeScale";import{useBackgroundModifier}from"../../modifiers/background";import{useBorderModifier}from"../../modifiers/border";import{useColorConverter}from"../../modifiers/colorConverter";import{useDefaultModifier}from"../../modifiers/default";import{useFlexWrapperModifier}from"../../modifiers/flexWrapper";import{useFullColorModifier}from"../../modifiers/fullColor";import{useMarginModifier}from"../../modifiers/margin";import{useOverflowModifier}from"../../modifiers/overflow";import{usePaddingModifier}from"../../modifiers/padding";import{usePositionModifier}from"../../modifiers/position";import{useShadowModifier}from"../../modifiers/shadow";import{useSizeConverter}from"../../modifiers/sizeConverter";import{useSizeModifier}from"../../modifiers/size";import{useThemeComponentModifier}from"../../modifiers/themeComponent";import{jsx as _jsx}from"react/jsx-runtime";var DEFAULT_PROPS=function DEFAULT_PROPS(_ref){var _ref2=_slicedToArray(_ref,2),sizeCode=_ref2[0].sizeCode,_ref2$=_ref2[1],round=_ref2$.round,square=_ref2$.square,src=_ref2$.src,dynamicColor=_ref2$.dynamicColor,color=_ref2$.color;return{padding:!!src?undefined:1,height:sizeCode,width:sizeCode,ratio:1,br:!!square?moveScale(sizeCode,-2)||sizeCode:undefined,round:!square,center:true,border:!!src?undefined:1,overflow:'hidden',color:dynamicColor!==undefined?getDynamicColor(dynamicColor):color};};export function Avatar(rootProps){var _pipe=pipe(useSizeConverter('elementHeights','md'),useThemeComponentModifier('Avatar'),useDefaultModifier(DEFAULT_PROPS),useColorConverter('text3'),useFullColorModifier,useSizeModifier,usePositionModifier,useFlexWrapperModifier,useBackgroundModifier,usePaddingModifier,useMarginModifier,useBorderModifier,useShadowModifier,useOverflowModifier)([{},rootProps]),_pipe2=_slicedToArray(_pipe,2),_pipe2$=_pipe2[0],fontColor=_pipe2$.fontColor,sizeCode=_pipe2$.sizeCode,formattedProps=_pipe2[1];var initials=formattedProps.initials,name=formattedProps.name,icon=formattedProps.icon,src=formattedProps.src,invert=formattedProps.invert,textProps=formattedProps.textProps,iconProps=formattedProps.iconProps,iconSize=formattedProps.iconSize,props=_objectWithoutProperties(formattedProps,_excluded);initials=initials||getInitials(name);var content=_jsx(IconLabel,{center:true,color:fontColor,size:sizeCode,label:!icon&&initials,icon:icon,invert:invert,textProps:Object.assign({strong:true},textProps),iconProps:Object.assign({size:iconSize},iconProps)});if(!!src)content=_jsx(Image,{br:0,src:src,width:sizeCode,height:sizeCode});return _jsx(AbsView,Object.assign({className:"neko-avatar"},props,{children:content}));}

package/dist/components/presentation/AvatarLabel.js

@@ -1 +1 @@
-import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/presentation/AvatarLabel.js";var _excluded=["icon","label","name","initials","src","avatarColor","square","dynamicColor","avatarProps","moveAvatarSizeScale","avatarSize"];import{pipe}from'ramda';import{Avatar}from"./Avatar";import{ContentLabel}from"./ContentLabel";import{moveScale}from"../../theme/helpers/sizeScale";import{useColorConverter}from"../../modifiers/colorConverter";import{useSizeConverter}from"../../modifiers/sizeConverter";import{useThemeComponentModifier}from"../../modifiers/themeComponent";import{jsx as _jsx}from"react/jsx-runtime";export function AvatarLabel(rootProps){var _pipe=pipe(useColorConverter(),useSizeConverter('elementHeights','md'),useThemeComponentModifier('AvatarLabel'))([{},rootProps]),_pipe2=_slicedToArray(_pipe,2),_pipe2$=_pipe2[0],sizeCode=_pipe2$.sizeCode,color=_pipe2$.color,formattedProps=_pipe2[1];var icon=formattedProps.icon,label=formattedProps.label,name=formattedProps.name,initials=formattedProps.initials,src=formattedProps.src,avatarColor=formattedProps.avatarColor,square=formattedProps.square,dynamicColor=formattedProps.dynamicColor,avatarProps=formattedProps.avatarProps,moveAvatarSizeScale=formattedProps.moveAvatarSizeScale,avatarSize=formattedProps.avatarSize,props=_objectWithoutProperties(formattedProps,_excluded);var hasAvatar=!!name||!!initials||!!src;return _jsx(ContentLabel,Object.assign({className:"neko-avatar-label",label:label||name,color:color,size:sizeCode,content:_jsx(Avatar,Object.assign({name:name||label,initials:initials,icon:icon,src:src,size:avatarSize||moveScale(sizeCode,moveAvatarSizeScale||-1),color:avatarColor||color,dynamicColor:dynamicColor,square:square,marginH:2},avatarProps))},props));}export var AvatarText=AvatarLabel;
+import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/presentation/AvatarLabel.js";var _excluded=["icon","label","name","initials","src","avatarColor","square","dynamicColor","avatarProps","moveAvatarSizeScale","avatarSize","iconSize"];import{pipe}from'ramda';import{Avatar}from"./Avatar";import{ContentLabel}from"./ContentLabel";import{moveScale}from"../../theme/helpers/sizeScale";import{useColorConverter}from"../../modifiers/colorConverter";import{useSizeConverter}from"../../modifiers/sizeConverter";import{useThemeComponentModifier}from"../../modifiers/themeComponent";import{jsx as _jsx}from"react/jsx-runtime";export function AvatarLabel(rootProps){var _pipe=pipe(useColorConverter(),useSizeConverter('elementHeights','md'),useThemeComponentModifier('AvatarLabel'))([{},rootProps]),_pipe2=_slicedToArray(_pipe,2),_pipe2$=_pipe2[0],sizeCode=_pipe2$.sizeCode,color=_pipe2$.color,formattedProps=_pipe2[1];var icon=formattedProps.icon,label=formattedProps.label,name=formattedProps.name,initials=formattedProps.initials,src=formattedProps.src,avatarColor=formattedProps.avatarColor,square=formattedProps.square,dynamicColor=formattedProps.dynamicColor,avatarProps=formattedProps.avatarProps,moveAvatarSizeScale=formattedProps.moveAvatarSizeScale,avatarSize=formattedProps.avatarSize,iconSize=formattedProps.iconSize,props=_objectWithoutProperties(formattedProps,_excluded);var hasAvatar=!!name||!!initials||!!src;return _jsx(ContentLabel,Object.assign({className:"neko-avatar-label",label:label||name,color:color,size:sizeCode,content:_jsx(Avatar,Object.assign({name:name||label,initials:initials,icon:icon,src:src,size:avatarSize||moveScale(sizeCode,moveAvatarSizeScale||-1),color:avatarColor||color,dynamicColor:dynamicColor,square:square,marginH:2,iconSize:iconSize},avatarProps))},props));}export var AvatarText=AvatarLabel;

package/dist/components/presentation/LabelValue.js

@@ -1 +1 @@
-import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/presentation/LabelValue.js";var _excluded=["children"],_excluded2=["icon","label","iconColor","labelProps","value","valueProps","vertical","spread"];import{pipe,is}from'ramda';import{IconLabel}from"./IconLabel";import{Text}from"../text/Text";import{View}from"../structure/View";import{moveScale}from"../../theme/helpers/sizeScale";import{useDefaultModifier}from"../../modifiers/default";import{useSizeConverter}from"../../modifiers/sizeConverter";import{useThemeComponentModifier}from"../../modifiers/themeComponent";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";var DEFAULT_PROPS=function DEFAULT_PROPS(_ref){var _ref2=_slicedToArray(_ref,2),sizeCode=_ref2[0].sizeCode,_ref2$=_ref2[1],vertical=_ref2$.vertical,spread=_ref2$.spread;return{row:!vertical,centerV:!vertical,justify:!!spread&&'space-between',gap:!vertical?moveScale(sizeCode,-1):0,labelProps:{size:moveScale(sizeCode,!vertical?0:-2),moveIconSizeScale:!vertical?-1:-2,color:'text3'},valueProps:{size:sizeCode,align:spread&&'right'}};};export function LabelValue(_ref3){var children=_ref3.children,rootProps=_objectWithoutProperties(_ref3,_excluded);var _pipe=pipe(useSizeConverter('elementHeights','md'),useThemeComponentModifier('Labelvalue'),useDefaultModifier(DEFAULT_PROPS))([{},rootProps]),_pipe2=_slicedToArray(_pipe,2),_pipe2$=_pipe2[0],sizeCode=_pipe2$.sizeCode,color=_pipe2$.color,formattedProps=_pipe2[1];var icon=formattedProps.icon,label=formattedProps.label,iconColor=formattedProps.iconColor,labelProps=formattedProps.labelProps,value=formattedProps.value,valueProps=formattedProps.valueProps,vertical=formattedProps.vertical,spread=formattedProps.spread,props=_objectWithoutProperties(formattedProps,_excluded2);var separator=!vertical&&!spread?':':'';var content=children||value;if(is(String,value))content=_jsx(Text,Object.assign({label:value},valueProps));return _jsxs(View,Object.assign({className:"neko-label-value"},props,{children:[_jsx(IconLabel,Object.assign({label:label+separator,icon:icon,iconColor:iconColor},labelProps)),content]}));}
+import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/presentation/LabelValue.js";var _excluded=["children"],_excluded2=["icon","label","iconColor","labelProps","value","valueColor","valueProps","vertical","spread"];import{pipe,is}from'ramda';import{IconLabel}from"./IconLabel";import{Text}from"../text/Text";import{View}from"../structure/View";import{moveScale}from"../../theme/helpers/sizeScale";import{useColorConverter}from"../../modifiers/colorConverter";import{useDefaultModifier}from"../../modifiers/default";import{useSizeConverter}from"../../modifiers/sizeConverter";import{useThemeComponentModifier}from"../../modifiers/themeComponent";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";var DEFAULT_PROPS=function DEFAULT_PROPS(_ref){var _ref2=_slicedToArray(_ref,2),_ref2$=_ref2[0],sizeCode=_ref2$.sizeCode,color=_ref2$.color,_ref2$2=_ref2[1],vertical=_ref2$2.vertical,spread=_ref2$2.spread;return{row:!vertical,centerV:!vertical,justify:!!spread&&'space-between',gap:!vertical?moveScale(sizeCode,-1):0,labelProps:{size:moveScale(sizeCode,!vertical?0:-2),moveIconSizeScale:!vertical?-1:-2,color:color||'text3'},valueProps:{size:sizeCode,align:spread&&'right'}};};export function LabelValue(_ref3){var children=_ref3.children,rootProps=_objectWithoutProperties(_ref3,_excluded);var _pipe=pipe(useColorConverter(),useSizeConverter('elementHeights','md'),useThemeComponentModifier('Labelvalue'),useDefaultModifier(DEFAULT_PROPS))([{},rootProps]),_pipe2=_slicedToArray(_pipe,2),_pipe2$=_pipe2[0],sizeCode=_pipe2$.sizeCode,color=_pipe2$.color,formattedProps=_pipe2[1];var icon=formattedProps.icon,label=formattedProps.label,iconColor=formattedProps.iconColor,labelProps=formattedProps.labelProps,value=formattedProps.value,valueColor=formattedProps.valueColor,valueProps=formattedProps.valueProps,vertical=formattedProps.vertical,spread=formattedProps.spread,props=_objectWithoutProperties(formattedProps,_excluded2);var separator=!vertical&&!spread?':':'';var content=children||value;if(is(String,value))content=_jsx(Text,Object.assign({label:value,color:valueColor||color},valueProps));return _jsxs(View,Object.assign({className:"neko-label-value"},props,{children:[_jsx(IconLabel,Object.assign({label:label+separator,icon:icon,iconColor:iconColor},labelProps)),content]}));}

package/dist/components/presentation/Result.js

@@ -1 +1 @@
-import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/presentation/Result.js";var _excluded=["type","icon","iconColor","title","description","footer","titleProps","descriptionProps","textProps","iconProps"];import{Divider}from"../helpers/Separator";import{Icon}from"./Icon";import{Text}from"../text/Text";import{View}from"../structure/View";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export var RESULT_TYPES={error:{icon:'close-circle-fill',color:'red'},success:{icon:'checkbox-circle-fill',color:'green'},warning:{icon:'error-warning-fill',color:'yellow'},info:{icon:'information-2-fill',color:'blue'}};export function Result(_ref){var type=_ref.type,icon=_ref.icon,iconColor=_ref.iconColor,title=_ref.title,description=_ref.description,footer=_ref.footer,titleProps=_ref.titleProps,descriptionProps=_ref.descriptionProps,textProps=_ref.textProps,iconProps=_ref.iconProps,props=_objectWithoutProperties(_ref,_excluded);var typeProps=RESULT_TYPES[type]||{};icon=icon||typeProps.icon;iconColor=iconColor||typeProps.color||'primary';return _jsxs(View,Object.assign({className:"neko-result",center:true,padding:"lg"},props,{children:[!!icon&&_jsx(Icon,Object.assign({name:icon,color:iconColor,size:42,primary:true},iconProps)),!!icon&&_jsx(Divider,{height:10}),_jsx(Text,Object.assign({h4:true},textProps,titleProps,{children:title})),!!description&&_jsx(Text,Object.assign({text3:true,sm:true,marginT:"sm"},textProps,descriptionProps,{children:description})),!!footer&&_jsx(View,{marginT:"lg",children:footer})]}));}
+import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/presentation/Result.js";var _excluded=["type","icon","iconColor","title","description","footer","titleProps","descriptionProps","textProps","iconProps"];import{Divider}from"../helpers/Separator";import{Icon}from"./Icon";import{Text}from"../text/Text";import{View}from"../structure/View";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export var RESULT_TYPES={error:{icon:'close-circle-fill',color:'red'},success:{icon:'checkbox-circle-fill',color:'green'},warning:{icon:'error-warning-fill',color:'yellow'},info:{icon:'information-2-fill',color:'blue'}};export function Result(_ref){var type=_ref.type,icon=_ref.icon,iconColor=_ref.iconColor,title=_ref.title,description=_ref.description,footer=_ref.footer,titleProps=_ref.titleProps,descriptionProps=_ref.descriptionProps,textProps=_ref.textProps,iconProps=_ref.iconProps,props=_objectWithoutProperties(_ref,_excluded);var typeProps=RESULT_TYPES[type]||{};icon=icon||typeProps.icon;iconColor=iconColor||typeProps.color||'primary';return _jsxs(View,Object.assign({className:"neko-result",center:true,padding:"lg"},props,{children:[!!icon&&_jsx(Icon,Object.assign({name:icon,color:iconColor,size:42,primary:true},iconProps)),!!icon&&_jsx(Divider,{height:10}),_jsx(Text,Object.assign({h4:true,center:true},textProps,titleProps,{children:title})),!!description&&_jsx(Text,Object.assign({text3:true,sm:true,marginT:"sm",center:true},textProps,descriptionProps,{children:description})),!!footer&&_jsx(View,{marginT:"lg",children:footer})]}));}

package/dist/components/presentation/Tooltip.js

@@ -1 +1 @@
-import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/presentation/Tooltip.js";var _excluded=["label","icon","textProps","iconProps","gap","invert","children"];import{pipe}from'ramda';import{IconLabel}from"./IconLabel";import{Popover}from"../structure/popover/Popover";import{useColorConverter}from"../../modifiers/colorConverter";import{useFullColorModifier}from"../../modifiers/fullColor";import{useSizeConverter}from"../../modifiers/sizeConverter";import{useThemeComponentModifier}from"../../modifiers/themeComponent";import{jsx as _jsx}from"react/jsx-runtime";export function Tooltip(rootProps){var _pipe=pipe(useColorConverter('overlayBG'),useSizeConverter('text','md'),useThemeComponentModifier('Tooltip'),useFullColorModifier)([{},rootProps]),_pipe2=_slicedToArray(_pipe,2),_pipe2$=_pipe2[0],loading=_pipe2$.loading,fontColor=_pipe2$.fontColor,sizeCode=_pipe2$.sizeCode,formattedProps=_pipe2[1];var label=formattedProps.label,icon=formattedProps.icon,textProps=formattedProps.textProps,iconProps=formattedProps.iconProps,gap=formattedProps.gap,invert=formattedProps.invert,children=formattedProps.children,props=_objectWithoutProperties(formattedProps,_excluded);if(!label&&!icon)return children;return _jsx(Popover,Object.assign({className:"neko-tooltip",padding:"xs"},props,{content:_jsx(IconLabel,{center:true,color:fontColor,size:sizeCode,label:label,icon:icon,gap:gap,invert:invert,textProps:textProps,iconProps:iconProps,loading:loading}),children:children}));}
+import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/presentation/Tooltip.js";var _excluded=["label","icon","textProps","iconProps","gap","invert","children"];import{pipe}from'ramda';import{IconLabel}from"./IconLabel";import{Popover}from"../structure/popover/Popover";import{useColorConverter}from"../../modifiers/colorConverter";import{useFullColorModifier}from"../../modifiers/fullColor";import{useSizeConverter}from"../../modifiers/sizeConverter";import{useThemeComponentModifier}from"../../modifiers/themeComponent";import{jsx as _jsx}from"react/jsx-runtime";export function Tooltip(rootProps){var _pipe=pipe(useColorConverter('overlayBG'),useSizeConverter('text','sm'),useThemeComponentModifier('Tooltip'),useFullColorModifier)([{},rootProps]),_pipe2=_slicedToArray(_pipe,2),_pipe2$=_pipe2[0],loading=_pipe2$.loading,fontColor=_pipe2$.fontColor,sizeCode=_pipe2$.sizeCode,formattedProps=_pipe2[1];var label=formattedProps.label,icon=formattedProps.icon,textProps=formattedProps.textProps,iconProps=formattedProps.iconProps,gap=formattedProps.gap,invert=formattedProps.invert,children=formattedProps.children,props=_objectWithoutProperties(formattedProps,_excluded);if(!label&&!icon)return children;return _jsx(Popover,Object.assign({className:"neko-tooltip",padding:"xs"},props,{content:_jsx(IconLabel,{center:true,color:fontColor,size:sizeCode,label:label,icon:icon,gap:gap,invert:invert,textProps:textProps,iconProps:iconProps,loading:loading}),children:children}));}

package/dist/components/sections/Section.js

@@ -0,0 +1 @@
+import _objectDestructuringEmpty from"@babel/runtime/helpers/objectDestructuringEmpty";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/sections/Section.js";var _excluded=["children","title"],_excluded2=["titleProps","dividerProps"];import{pipe}from'ramda';import React from'react';import{Divider}from"../helpers/Separator";import{Text}from"../text";import{View}from"../structure";import{useDefaultModifier}from"../../modifiers/default";import{useThemeComponentModifier}from"../../modifiers/themeComponent";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";var DEFAULT_PROPS={marginH:'md',bg:'overlayBG',br:'md',titleProps:{strong:true,text4:true,sm:true,marginB:'sm',paddingH:'md'},dividerProps:{line:true,height:1}};export function Section(_ref){var _this=this;var children=_ref.children,title=_ref.title,rootProps=_objectWithoutProperties(_ref,_excluded);var _pipe=pipe(useThemeComponentModifier('Section'),useDefaultModifier(DEFAULT_PROPS))([{},rootProps]),_pipe2=_slicedToArray(_pipe,2);_objectDestructuringEmpty(_pipe2[0]);var formattedProps=_pipe2[1];var titleProps=formattedProps.titleProps,dividerProps=formattedProps.dividerProps,props=_objectWithoutProperties(formattedProps,_excluded2);var childArray=React.Children.toArray(children);return _jsxs(View,{children:[!!title&&_jsx(Text,Object.assign({marginH:props.marginH},titleProps,{label:title})),_jsx(View,Object.assign({className:"neko-section"},props,{children:childArray.map(function(child,i){return _jsxs(React.Fragment,{children:[child,i<childArray.length-1&&_jsx(Divider,Object.assign({},dividerProps))]},child.key);})}))]});}

package/dist/components/sections/SectionItem.js

@@ -0,0 +1 @@
+import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _objectDestructuringEmpty from"@babel/runtime/helpers/objectDestructuringEmpty";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/sections/SectionItem.js";import{pipe}from'ramda';import{LabelValue}from"../presentation";import{useColorConverter}from"../../modifiers/colorConverter";import{useDefaultModifier}from"../../modifiers/default";import{useThemeComponentModifier}from"../../modifiers/themeComponent";import{jsx as _jsx}from"react/jsx-runtime";var DEFAULT_PROPS={paddingH:'md',paddingV:'sm',minH:'md'};export function SectionItem(_ref){var rootProps=Object.assign({},(_objectDestructuringEmpty(_ref),_ref));var _pipe=pipe(useColorConverter(),useThemeComponentModifier('SectionItem'),useDefaultModifier(DEFAULT_PROPS))([{},rootProps]),_pipe2=_slicedToArray(_pipe,2),color=_pipe2[0].color,formattedProps=_pipe2[1];var props=Object.assign({},(_objectDestructuringEmpty(formattedProps),formattedProps));return _jsx(LabelValue,Object.assign({spread:true,className:"neko-section-item",color:color},props));}

package/dist/components/sections/SectionItemDropdown.js

@@ -0,0 +1 @@
+import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/sections/SectionItemDropdown.js";var _excluded=["children","value","valueLabel","items","onChange"],_excluded2=["icon","iconLabelProps","trigger","placement","popoverProps","useBottomDrawer"];import{pipe}from'ramda';import{IconLabel}from"../presentation";import{Link}from"../actions";import{Menu}from"../actions/menu/Menu";import{Popover}from"../structure/popover/Popover";import{ScrollView}from"../list";import{SectionItem}from"./SectionItem";import{useColorConverter}from"../../modifiers/colorConverter";import{useDefaultModifier}from"../../modifiers/default";import{useResponsiveValue}from"../../responsive";import{useThemeComponentModifier}from"../../modifiers/themeComponent";import{jsx as _jsx}from"react/jsx-runtime";var DEFAULT_PROPS={paddingV:'sm',minH:'md',icon:'arrow-down-s-fill'};export function SectionItemDropdown(_ref){var _this=this;var children=_ref.children,value=_ref.value,valueLabel=_ref.valueLabel,items=_ref.items,onChange=_ref.onChange,rootProps=_objectWithoutProperties(_ref,_excluded);var _pipe=pipe(useColorConverter(),useThemeComponentModifier('SectionItemDropdown'),useDefaultModifier(DEFAULT_PROPS))([{},rootProps]),_pipe2=_slicedToArray(_pipe,2),color=_pipe2[0].color,formattedProps=_pipe2[1];var icon=formattedProps.icon,iconLabelProps=formattedProps.iconLabelProps,_formattedProps$trigg=formattedProps.trigger,trigger=_formattedProps$trigg===void 0?'click':_formattedProps$trigg,placement=formattedProps.placement,popoverProps=formattedProps.popoverProps,useBottomDrawer=formattedProps.useBottomDrawer,props=_objectWithoutProperties(formattedProps,_excluded2);useBottomDrawer=useResponsiveValue(useBottomDrawer||{native:true,sm:true,md:true});return _jsx(Popover,Object.assign({useParentMinWidth:true,placement:placement||'bottomRight',trigger:trigger,padding:0,contentProps:{padding:0},useBottomDrawer:useBottomDrawer},popoverProps,{renderContent:function renderContent(_ref2){var onClose=_ref2.onClose;var handleChange=function handleChange(){if(onChange)onChange.apply(void 0,arguments);onClose();};return _jsx(ScrollView,{children:_jsx(Menu,{vertical:true,items:items,onChange:handleChange,linkPaddingH:useBottomDrawer?'md':'sm',linkMinHeight:useBottomDrawer?'xl':'md',withDivider:useBottomDrawer})});},children:_jsx(Link,{className:"neko-section-item-dropdown",children:_jsx(SectionItem,Object.assign({color:color},props,{children:children||_jsx(IconLabel,Object.assign({gap:2,invert:true,color:color},iconLabelProps,{label:valueLabel||value,icon:icon}))}))})}));}

package/dist/components/sections/SectionItemLink.js

@@ -0,0 +1 @@
+import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/sections/SectionItemLink.js";var _excluded=["children","value","onPress"],_excluded2=["icon","iconLabelProps"];import{pipe}from'ramda';import{IconLabel}from"../presentation";import{Link}from"../actions";import{SectionItem}from"./SectionItem";import{useColorConverter}from"../../modifiers/colorConverter";import{useDefaultModifier}from"../../modifiers/default";import{useThemeComponentModifier}from"../../modifiers/themeComponent";import{jsx as _jsx}from"react/jsx-runtime";var DEFAULT_PROPS={icon:'md',paddingV:'sm',minH:'md',icon:'arrow-right-s-line'};export function SectionItemLink(_ref){var children=_ref.children,value=_ref.value,onPress=_ref.onPress,rootProps=_objectWithoutProperties(_ref,_excluded);var _pipe=pipe(useColorConverter(),useThemeComponentModifier('SectionItemLink'),useDefaultModifier(DEFAULT_PROPS))([{},rootProps]),_pipe2=_slicedToArray(_pipe,2),color=_pipe2[0].color,formattedProps=_pipe2[1];var icon=formattedProps.icon,iconLabelProps=formattedProps.iconLabelProps,props=_objectWithoutProperties(formattedProps,_excluded2);return _jsx(Link,{className:"neko-section-item-link",onPress:onPress,children:_jsx(SectionItem,Object.assign({color:color},props,{children:children||_jsx(IconLabel,Object.assign({gap:2,invert:true,color:color},iconLabelProps,{label:value,icon:icon}))}))});}

package/dist/components/sections/index.js

@@ -0,0 +1 @@
+export*from"./Section";export*from"./SectionItem";export*from"./SectionItemDropdown";export*from"./SectionItemLink";

package/dist/components/state/StatePresenter.js

@@ -0,0 +1 @@
+import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/state/StatePresenter.js";var _excluded=["loading","error","empty","errorTitle","errorDescription","emptyTitle","emptyDescription","children"];import{Loading}from"./Loading";import{Result}from"../presentation";import{View}from"../structure";import{jsx as _jsx}from"react/jsx-runtime";export function StatePresenter(_ref){var loading=_ref.loading,error=_ref.error,empty=_ref.empty,_ref$errorTitle=_ref.errorTitle,errorTitle=_ref$errorTitle===void 0?'Something went wrong':_ref$errorTitle,errorDescription=_ref.errorDescription,_ref$emptyTitle=_ref.emptyTitle,emptyTitle=_ref$emptyTitle===void 0?'No results':_ref$emptyTitle,emptyDescription=_ref.emptyDescription,children=_ref.children,props=_objectWithoutProperties(_ref,_excluded);if(loading){return _jsx(View,Object.assign({flex:true,center:true},props,{children:_jsx(Loading,{})}));}if(error){return _jsx(View,Object.assign({flex:true,center:true},props,{children:_jsx(Result,{type:"error",title:errorTitle,description:errorDescription||error.message})}));}if(empty){return _jsx(View,Object.assign({flex:true,center:true},props,{children:_jsx(Result,{type:"empty",title:emptyTitle,description:emptyDescription})}));}return children;}

package/dist/components/state/index.js

@@ -1 +1 @@
-export*from"./Loading";export*from"./LoadingView";
+export*from"./Loading";export*from"./LoadingView";export*from"./StatePresenter";

package/dist/components/structure/BlurView.js

@@ -1 +1 @@
-import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import _objectDestructuringEmpty from"@babel/runtime/helpers/objectDestructuringEmpty";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/structure/BlurView.js";var _excluded=["children"];import tinycolor from'tinycolor2';import{pipe}from'ramda';import{AbsBlurView}from"../../abstractions/BlurView";import{useAnimationModifier}from"../../modifiers/animation";import{useBackgroundModifier}from"../../modifiers/background";import{useBorderModifier}from"../../modifiers/border";import{useColors}from"../../theme";import{useDefaultModifier}from"../../modifiers/default";import{useDisplayModifier}from"../../modifiers/display";import{useFlexModifier}from"../../modifiers/flex";import{useFlexWrapperModifier}from"../../modifiers/flexWrapper";import{useMarginModifier}from"../../modifiers/margin";import{useOverflowModifier}from"../../modifiers/overflow";import{usePaddingModifier}from"../../modifiers/padding";import{usePositionModifier}from"../../modifiers/position";import{useShadowModifier}from"../../modifiers/shadow";import{useSizeModifier}from"../../modifiers/size";import{useStateModifier}from"../../modifiers/state";import{useThemeComponentModifier}from"../../modifiers/themeComponent";import{jsx as _jsx}from"react/jsx-runtime";var DEFAULT_PROPS=function DEFAULT_PROPS(colors){return function(_ref){var _ref2=_slicedToArray(_ref,2);_objectDestructuringEmpty(_ref2[0]);_objectDestructuringEmpty(_ref2[1]);var isDark=tinycolor((colors==null?void 0:colors.overlayBG)||(colors==null?void 0:colors.bg)).isDark();return{tint:isDark?'dark':'light'};};};export function BlurView(_ref3){var children=_ref3.children,rootProps=_objectWithoutProperties(_ref3,_excluded);var colors=useColors();var _pipe=pipe(useThemeComponentModifier('BlurView'),useDefaultModifier(DEFAULT_PROPS(colors)),useFlexWrapperModifier,useDisplayModifier,useAnimationModifier,useStateModifier,useSizeModifier,usePositionModifier,useOverflowModifier,usePaddingModifier,useMarginModifier,useFlexModifier,useBackgroundModifier,useBorderModifier,useShadowModifier)([{},rootProps]),_pipe2=_slicedToArray(_pipe,2);_objectDestructuringEmpty(_pipe2[0]);var props=_pipe2[1];return _jsx(AbsBlurView,Object.assign({className:"neko-blur-view"},props,{children:children}));}
+import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import _objectDestructuringEmpty from"@babel/runtime/helpers/objectDestructuringEmpty";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/structure/BlurView.js";var _excluded=["children"];import tinycolor from'tinycolor2';import{pipe}from'ramda';import{AbsBlurView}from"../../abstractions/BlurView";import{useAnimationModifier}from"../../modifiers/animation";import{useBackgroundModifier}from"../../modifiers/background";import{useBorderModifier}from"../../modifiers/border";import{useColors}from"../../theme";import{useDefaultModifier}from"../../modifiers/default";import{useDisplayModifier}from"../../modifiers/display";import{useFlexModifier}from"../../modifiers/flex";import{useFlexWrapperModifier}from"../../modifiers/flexWrapper";import{useMarginModifier}from"../../modifiers/margin";import{useOverflowModifier}from"../../modifiers/overflow";import{usePaddingModifier}from"../../modifiers/padding";import{usePositionModifier}from"../../modifiers/position";import{useShadowModifier}from"../../modifiers/shadow";import{useSizeModifier}from"../../modifiers/size";import{useStateModifier}from"../../modifiers/state";import{useThemeComponentModifier}from"../../modifiers/themeComponent";import{jsx as _jsx}from"react/jsx-runtime";var DEFAULT_PROPS=function DEFAULT_PROPS(colors){return function(_ref){var _ref2=_slicedToArray(_ref,2);_objectDestructuringEmpty(_ref2[0]);_objectDestructuringEmpty(_ref2[1]);var isDark=tinycolor((colors==null?void 0:colors.overlayBG)||(colors==null?void 0:colors.bg)).isDark();return{width:'auto',tint:isDark?'dark':'light'};};};export function BlurView(_ref3){var children=_ref3.children,rootProps=_objectWithoutProperties(_ref3,_excluded);var colors=useColors();var _pipe=pipe(useThemeComponentModifier('BlurView'),useDefaultModifier(DEFAULT_PROPS(colors)),useFlexWrapperModifier,useDisplayModifier,useAnimationModifier,useStateModifier,useSizeModifier,usePositionModifier,useOverflowModifier,usePaddingModifier,useMarginModifier,useFlexModifier,useBackgroundModifier,useBorderModifier,useShadowModifier)([{},rootProps]),_pipe2=_slicedToArray(_pipe,2);_objectDestructuringEmpty(_pipe2[0]);var props=_pipe2[1];return _jsx(AbsBlurView,Object.assign({className:"neko-blur-view"},props,{children:children}));}

package/dist/components/structure/KeyboardAvoidingView.js

@@ -0,0 +1 @@
+import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/structure/KeyboardAvoidingView.js";var _excluded=["children","keyboardVerticalOffset"];import{pipe}from'ramda';import{AbsKeyboardAvoidingView}from"../../abstractions/KeyboardAvoidingView";import{Platform}from"../../abstractions/Platform";import{useSafeAreaInsets}from"../../abstractions/helpers/useSafeAreaInsets";import{useAnimationModifier}from"../../modifiers/animation";import{useBackgroundModifier}from"../../modifiers/background";import{useBorderModifier}from"../../modifiers/border";import{useCursorModifier}from"../../modifiers/cursor";import{useDisplayModifier}from"../../modifiers/display";import{useFlexModifier}from"../../modifiers/flex";import{useFlexWrapperModifier}from"../../modifiers/flexWrapper";import{useMarginModifier}from"../../modifiers/margin";import{useOverflowModifier}from"../../modifiers/overflow";import{usePaddingModifier}from"../../modifiers/padding";import{usePositionModifier}from"../../modifiers/position";import{useShadowModifier}from"../../modifiers/shadow";import{useSizeModifier}from"../../modifiers/size";import{useStateModifier}from"../../modifiers/state";import{useThemeComponentModifier}from"../../modifiers/themeComponent";import{jsx as _jsx}from"react/jsx-runtime";export function KeyboardAvoidingView(_ref){var children=_ref.children,_ref$keyboardVertical=_ref.keyboardVerticalOffset,keyboardVerticalOffset=_ref$keyboardVertical===void 0?0:_ref$keyboardVertical,rootProps=_objectWithoutProperties(_ref,_excluded);var _useSafeAreaInsets=useSafeAreaInsets(),bottom=_useSafeAreaInsets.bottom;var _pipe=pipe(useThemeComponentModifier('KeyboardAvoidingView'),useFlexWrapperModifier,useDisplayModifier,useCursorModifier,useAnimationModifier,useStateModifier,useSizeModifier,usePositionModifier,useOverflowModifier,usePaddingModifier,useMarginModifier,useFlexModifier,useBackgroundModifier,useBorderModifier,useShadowModifier)([{},rootProps]),_pipe2=_slicedToArray(_pipe,2),_=_pipe2[0],props=_pipe2[1];return _jsx(AbsKeyboardAvoidingView,Object.assign({behavior:Platform.OS==='ios'?'padding':'height',keyboardVerticalOffset:keyboardVerticalOffset+bottom},props,{children:children}));}

package/dist/components/structure/TopBar.js

@@ -0,0 +1 @@
+import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/structure/TopBar.js";var _excluded=["right","left","WrapperView","children"];import{Text}from"../text";import{View}from"./View";import{useResponsiveConverter}from"../../modifiers/responsiveConverter";import{useSafeAreaInsets}from"../../abstractions/helpers/useSafeAreaInsets";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export function TopBar(_ref){var right=_ref.right,left=_ref.left,WrapperView=_ref.WrapperView,children=_ref.children,rootProps=_objectWithoutProperties(_ref,_excluded);var _useSafeAreaInsets=useSafeAreaInsets(),safeTop=_useSafeAreaInsets.top;var _useResponsiveConvert=useResponsiveConverter([])([{},rootProps]),_useResponsiveConvert2=_slicedToArray(_useResponsiveConvert,2),_=_useResponsiveConvert2[0],props=_useResponsiveConvert2[1];var _props$useSafeArea=props.useSafeArea,useSafeArea=_props$useSafeArea===void 0?true:_props$useSafeArea,title=props.title,subtitle=props.subtitle;var hasContent=!!title||!!subtitle||!!children||!!right||!!left;WrapperView=WrapperView||View;return _jsx(WrapperView,Object.assign({paddingT:useSafeArea&&safeTop},props,{children:!!hasContent&&_jsxs(View,{minH:"md",centerV:true,row:true,paddingH:"md",paddingV:"sm",gap:"sm",fullW:true,children:[_jsx(View,{flex:1,toLeft:true,children:left}),_jsxs(View,{center:true,flex:3,children:[children||_jsx(Text,{center:true,h6:true,numberOfLines:1,children:title}),subtitle&&_jsx(Text,{center:true,xs:true,numberOfLines:1,children:subtitle})]}),_jsx(View,{flex:1,toRight:true,children:right})]})}));}

package/dist/components/structure/index.js

@@ -1 +1 @@
-export*from"./Accordion";export*from"./AccordionGroup";export*from"./View";export*from"./GradientView";export*from"./BlurView";export*from"./SafeAreaView";export*from"./Card";export*from"./Row";export*from"./Col";export*from"./modal";export*from"./drawer";export*from"./bottomDrawer";export*from"./popover/Popover";export*from"./Segment";
+export*from"./Accordion";export*from"./AccordionGroup";export*from"./View";export*from"./GradientView";export*from"./BlurView";export*from"./SafeAreaView";export*from"./Card";export*from"./Row";export*from"./Col";export*from"./popover/Popover";export*from"./Segment";export*from"./TopBar";export*from"./KeyboardAvoidingView";

package/dist/components/structure/popover/Popover.js

@@ -1 +1 @@
-import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/structure/popover/Popover.js";var _excluded=["renderContent","content","trigger","placement","unmountOnClose","children","parentWidth","parentMinWidth","useBottomDrawer","bottomDrawerProps","watch","disabled"],_excluded2=["children","content","renderContent","snapPoints"];import React from'react';import{BottomDrawer}from"../bottomDrawer";import{PopoverContent}from"./PopoverContent";import{useRegisterOverlay}from"../overlay/OverlayHandler";import{useResponsiveValue}from"../../../responsive";import{jsx as _jsx,Fragment as _Fragment,jsxs as _jsxs}from"react/jsx-runtime";export function Popover(_ref){var _this=this;var renderContent=_ref.renderContent,content=_ref.content,_ref$trigger=_ref.trigger,trigger=_ref$trigger===void 0?'hover':_ref$trigger,_ref$placement=_ref.placement,placement=_ref$placement===void 0?'bottom':_ref$placement,unmountOnClose=_ref.unmountOnClose,children=_ref.children,parentWidth=_ref.parentWidth,parentMinWidth=_ref.parentMinWidth,_ref$useBottomDrawer=_ref.useBottomDrawer,useBottomDrawer=_ref$useBottomDrawer===void 0?{}:_ref$useBottomDrawer,_ref$bottomDrawerProp=_ref.bottomDrawerProps,bottomDrawerProps=_ref$bottomDrawerProp===void 0?{}:_ref$bottomDrawerProp,watch=_ref.watch,disabled=_ref.disabled,props=_objectWithoutProperties(_ref,_excluded);var shouldUseDrawer=useResponsiveValue(useBottomDrawer);var ref=React.useRef(null);var _useRegisterOverlay=useRegisterOverlay({unmountOnClose:unmountOnClose}),onOpen=_useRegisterOverlay.onOpen,onUpdate=_useRegisterOverlay.onUpdate,onClose=_useRegisterOverlay.onClose,onFastClose=_useRegisterOverlay.onFastClose,stopDelayedClosing=_useRegisterOverlay.stopDelayedClosing;var click=trigger==='click';var hover=trigger==='hover';var focus=trigger==='focus';renderContent=renderContent||function(){return content;};var buildContent=function buildContent(){var _ref$current,_ref$current$getBound,_ref$current2,_ref$current2$getBoun;return _jsx(PopoverContent,Object.assign({placement:placement,width:parentWidth?(_ref$current=ref.current)==null?void 0:(_ref$current$getBound=_ref$current.getBoundingClientRect())==null?void 0:_ref$current$getBound.width:undefined,minWidth:parentMinWidth?(_ref$current2=ref.current)==null?void 0:(_ref$current2$getBoun=_ref$current2.getBoundingClientRect())==null?void 0:_ref$current2$getBoun.width:undefined},props,{onMouseEnter:hover?stopDelayedClosing:undefined,onMouseLeave:hover?onClose:undefined,children:renderContent({onClose:onFastClose})}));};var computeTriggerRect=function computeTriggerRect(){var rect=ref.current.getBoundingClientRect();var scrollX=window.scrollX||window.pageXOffset;var scrollY=window.scrollY||window.pageYOffset;return{left:rect.left+scrollX,right:rect.right+scrollX,top:rect.top+scrollY,bottom:rect.bottom+scrollY,width:rect.width,height:rect.height};};var show=function show(e){if(e&&e.stopPropagation)e.stopPropagation();var triggerRect=computeTriggerRect();onOpen({content:buildContent(),triggerRect:triggerRect,placement:placement,options:{dismissOnClickOutside:click||focus}});};React.useEffect(function(){return function(){return onClose();};},[]);React.useEffect(function(){if(!ref.current||!watch)return;onUpdate({content:buildContent(),options:{dismissOnClickOutside:click||focus}});},watch);if(shouldUseDrawer){return _jsx(DrawerPopover,Object.assign({content:content,renderContent:renderContent,children:children},props,bottomDrawerProps));}var child=React.Children.only(children);var childProps={ref:ref,onClick:show};if(hover)childProps={ref:ref,onMouseEnter:show,onMouseLeave:onClose,disabled:disabled};if(focus)childProps={ref:ref,onFocus:show,disabled:disabled};return React.cloneElement(child,childProps);}function DrawerPopover(_ref2){var children=_ref2.children,content=_ref2.content,renderContent=_ref2.renderContent,snapPoints=_ref2.snapPoints,props=_objectWithoutProperties(_ref2,_excluded2);var _React$useState=React.useState(false),_React$useState2=_slicedToArray(_React$useState,2),open=_React$useState2[0],setOpen=_React$useState2[1];var onClose=function onClose(){return setOpen(false);};var child=React.Children.only(children);var childProps={onClick:function onClick(){return setOpen(true);}};return _jsxs(_Fragment,{children:[React.cloneElement(child,childProps),_jsx(BottomDrawer,Object.assign({open:open,onClose:onClose,snapPoints:snapPoints},props,{children:renderContent({onClose:onClose})}))]});}
+import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/structure/popover/Popover.js";var _excluded=["renderContent","content","trigger","placement","unmountOnClose","children","parentWidth","parentMinWidth","useBottomDrawer","bottomDrawerProps","watch","disabled"],_excluded2=["children","content","renderContent","snapPoints"];import React from'react';import{BottomDrawer}from"../../modals/bottomDrawer";import{PopoverContent}from"./PopoverContent";import{useRegisterOverlay}from"../overlay/OverlayHandler";import{useResponsiveValue}from"../../../responsive";import{jsx as _jsx,Fragment as _Fragment,jsxs as _jsxs}from"react/jsx-runtime";export function Popover(_ref){var _this=this;var renderContent=_ref.renderContent,content=_ref.content,_ref$trigger=_ref.trigger,trigger=_ref$trigger===void 0?'hover':_ref$trigger,_ref$placement=_ref.placement,placement=_ref$placement===void 0?'bottom':_ref$placement,unmountOnClose=_ref.unmountOnClose,children=_ref.children,parentWidth=_ref.parentWidth,parentMinWidth=_ref.parentMinWidth,_ref$useBottomDrawer=_ref.useBottomDrawer,useBottomDrawer=_ref$useBottomDrawer===void 0?{}:_ref$useBottomDrawer,_ref$bottomDrawerProp=_ref.bottomDrawerProps,bottomDrawerProps=_ref$bottomDrawerProp===void 0?{}:_ref$bottomDrawerProp,watch=_ref.watch,disabled=_ref.disabled,props=_objectWithoutProperties(_ref,_excluded);var shouldUseDrawer=useResponsiveValue(useBottomDrawer);var ref=React.useRef(null);var _useRegisterOverlay=useRegisterOverlay({unmountOnClose:unmountOnClose}),onOpen=_useRegisterOverlay.onOpen,onUpdate=_useRegisterOverlay.onUpdate,onClose=_useRegisterOverlay.onClose,onFastClose=_useRegisterOverlay.onFastClose,stopDelayedClosing=_useRegisterOverlay.stopDelayedClosing;var click=trigger==='click';var hover=trigger==='hover';var focus=trigger==='focus';renderContent=renderContent||function(){return content;};var buildContent=function buildContent(){var _ref$current,_ref$current$getBound,_ref$current2,_ref$current2$getBoun;return _jsx(PopoverContent,Object.assign({placement:placement,width:parentWidth?(_ref$current=ref.current)==null?void 0:(_ref$current$getBound=_ref$current.getBoundingClientRect())==null?void 0:_ref$current$getBound.width:undefined,minWidth:parentMinWidth?(_ref$current2=ref.current)==null?void 0:(_ref$current2$getBoun=_ref$current2.getBoundingClientRect())==null?void 0:_ref$current2$getBoun.width:undefined},props,{onMouseEnter:hover?stopDelayedClosing:undefined,onMouseLeave:hover?onClose:undefined,children:renderContent({onClose:onFastClose})}));};var computeTriggerRect=function computeTriggerRect(){var rect=ref.current.getBoundingClientRect();var scrollX=window.scrollX||window.pageXOffset;var scrollY=window.scrollY||window.pageYOffset;return{left:rect.left+scrollX,right:rect.right+scrollX,top:rect.top+scrollY,bottom:rect.bottom+scrollY,width:rect.width,height:rect.height};};var show=function show(e){if(e&&e.stopPropagation)e.stopPropagation();var triggerRect=computeTriggerRect();onOpen({content:buildContent(),triggerRect:triggerRect,placement:placement,options:{dismissOnClickOutside:click||focus}});};React.useEffect(function(){return function(){return onClose();};},[]);React.useEffect(function(){if(!ref.current||!watch)return;onUpdate({content:buildContent(),options:{dismissOnClickOutside:click||focus}});},watch);if(shouldUseDrawer){return _jsx(DrawerPopover,Object.assign({content:content,renderContent:renderContent,children:children},props,bottomDrawerProps));}var child=React.Children.only(children);var childProps={ref:ref,onClick:show};if(hover)childProps={ref:ref,onMouseEnter:show,onMouseLeave:onClose,disabled:disabled};if(focus)childProps={ref:ref,onFocus:show,disabled:disabled};return React.cloneElement(child,childProps);}function DrawerPopover(_ref2){var children=_ref2.children,content=_ref2.content,renderContent=_ref2.renderContent,snapPoints=_ref2.snapPoints,props=_objectWithoutProperties(_ref2,_excluded2);var _React$useState=React.useState(false),_React$useState2=_slicedToArray(_React$useState,2),open=_React$useState2[0],setOpen=_React$useState2[1];var onClose=function onClose(){return setOpen(false);};var child=React.Children.only(children);var childProps={onClick:function onClick(){return setOpen(true);}};return _jsxs(_Fragment,{children:[React.cloneElement(child,childProps),_jsx(BottomDrawer,Object.assign({open:open,onClose:onClose,snapPoints:snapPoints},props,{children:renderContent({onClose:onClose})}))]});}

package/dist/components/structure/popover/Popover.native.js

@@ -1 +1 @@
-import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/structure/popover/Popover.native.js";var _excluded=["content","renderContent","placement","children","useBottomDrawer","bottomDrawerProps","snapPoints"];import{Modal,TouchableWithoutFeedback}from"react-native-web";import React from'react';import{BottomDrawer}from"../bottomDrawer";import{PopoverContent}from"./PopoverContent";import{View}from"../View";import{calculatePosition}from"../overlay/calculatePosition";import{useResponsiveValue}from"../../../responsive";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";export function Popover(_ref){var _position$y,_position$x;var content=_ref.content,renderContent=_ref.renderContent,_ref$placement=_ref.placement,placement=_ref$placement===void 0?'bottom':_ref$placement,children=_ref.children,_ref$useBottomDrawer=_ref.useBottomDrawer,useBottomDrawer=_ref$useBottomDrawer===void 0?{}:_ref$useBottomDrawer,_ref$bottomDrawerProp=_ref.bottomDrawerProps,bottomDrawerProps=_ref$bottomDrawerProp===void 0?{}:_ref$bottomDrawerProp,snapPoints=_ref.snapPoints,props=_objectWithoutProperties(_ref,_excluded);var shouldUseDrawer=useResponsiveValue(useBottomDrawer);var ref=React.useRef(null);var _React$useState=React.useState(false),_React$useState2=_slicedToArray(_React$useState,2),open=_React$useState2[0],setOpen=_React$useState2[1];var _React$useState3=React.useState(null),_React$useState4=_slicedToArray(_React$useState3,2),triggerRect=_React$useState4[0],setTriggerRect=_React$useState4[1];var _React$useState5=React.useState(null),_React$useState6=_slicedToArray(_React$useState5,2),position=_React$useState6[0],setPosition=_React$useState6[1];renderContent=renderContent||function(){return content;};var onOpen=function onOpen(){if(shouldUseDrawer){setOpen(true);return;}if(ref.current){ref.current.measureInWindow(function(x,y,width,height){setTriggerRect({left:x,top:y,right:x+width,bottom:y+height,width:width,height:height});setOpen(true);});}};var onClose=function onClose(){setOpen(false);setTriggerRect(null);setPosition(null);};children=React.cloneElement(React.Children.only(children),{onPress:onOpen});if(shouldUseDrawer){return _jsxs(View,{ref:ref,children:[children,_jsx(BottomDrawer,Object.assign({open:open,onClose:onClose,snapPoints:snapPoints},bottomDrawerProps,{children:renderContent({onClose:onClose})}))]});}return _jsxs(_Fragment,{children:[_jsx(View,{ref:ref,children:children}),open&&_jsx(Modal,{transparent:true,visible:open,animationType:"fade",onRequestClose:onClose,children:_jsx(View,{fullW:true,flex:true,fullH:true,bg:"backdrop_op50",children:_jsx(TouchableWithoutFeedback,{onPress:onClose,children:_jsx(View,{style:{flex:1},children:triggerRect&&_jsx(View,{style:{position:'absolute',top:(_position$y=position==null?void 0:position.y)!=null?_position$y:-9999,left:(_position$x=position==null?void 0:position.x)!=null?_position$x:-9999},onLayout:function onLayout(e){var _e$nativeEvent$layout=e.nativeEvent.layout,width=_e$nativeEvent$layout.width,height=_e$nativeEvent$layout.height;var popoverRect={width:width,height:height};var pos=calculatePosition(triggerRect,popoverRect,placement,8);setPosition(pos);},children:_jsx(PopoverContent,Object.assign({placement:placement},props,{children:renderContent({onClose:onClose})}))})})})})})]});}
+import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/structure/popover/Popover.native.js";var _excluded=["content","renderContent","placement","children","useBottomDrawer","bottomDrawerProps","snapPoints"];import{Modal,TouchableWithoutFeedback}from"react-native-web";import React from'react';import{BottomDrawer}from"../../modals/bottomDrawer";import{PopoverContent}from"./PopoverContent";import{View}from"../View";import{calculatePosition}from"../overlay/calculatePosition";import{useResponsiveValue}from"../../../responsive";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";export function Popover(_ref){var _position$y,_position$x;var content=_ref.content,renderContent=_ref.renderContent,_ref$placement=_ref.placement,placement=_ref$placement===void 0?'bottom':_ref$placement,children=_ref.children,_ref$useBottomDrawer=_ref.useBottomDrawer,useBottomDrawer=_ref$useBottomDrawer===void 0?{}:_ref$useBottomDrawer,_ref$bottomDrawerProp=_ref.bottomDrawerProps,bottomDrawerProps=_ref$bottomDrawerProp===void 0?{}:_ref$bottomDrawerProp,snapPoints=_ref.snapPoints,props=_objectWithoutProperties(_ref,_excluded);var shouldUseDrawer=useResponsiveValue(useBottomDrawer);var ref=React.useRef(null);var _React$useState=React.useState(false),_React$useState2=_slicedToArray(_React$useState,2),open=_React$useState2[0],setOpen=_React$useState2[1];var _React$useState3=React.useState(null),_React$useState4=_slicedToArray(_React$useState3,2),triggerRect=_React$useState4[0],setTriggerRect=_React$useState4[1];var _React$useState5=React.useState(null),_React$useState6=_slicedToArray(_React$useState5,2),position=_React$useState6[0],setPosition=_React$useState6[1];renderContent=renderContent||function(){return content;};var onOpen=function onOpen(){if(shouldUseDrawer){setOpen(true);return;}if(ref.current){ref.current.measureInWindow(function(x,y,width,height){setTriggerRect({left:x,top:y,right:x+width,bottom:y+height,width:width,height:height});setOpen(true);});}};var onClose=function onClose(){setOpen(false);setTriggerRect(null);setPosition(null);};children=React.cloneElement(React.Children.only(children),{onPress:onOpen});if(shouldUseDrawer){return _jsxs(View,{ref:ref,children:[children,_jsx(BottomDrawer,Object.assign({open:open,onClose:onClose,snapPoints:snapPoints},bottomDrawerProps,{children:renderContent({onClose:onClose})}))]});}return _jsxs(_Fragment,{children:[_jsx(View,{ref:ref,children:children}),open&&_jsx(Modal,{transparent:true,visible:open,animationType:"fade",onRequestClose:onClose,children:_jsx(View,{fullW:true,flex:true,fullH:true,bg:"backdrop_op50",children:_jsx(TouchableWithoutFeedback,{onPress:onClose,children:_jsx(View,{style:{flex:1},children:triggerRect&&_jsx(View,{style:{position:'absolute',top:(_position$y=position==null?void 0:position.y)!=null?_position$y:-9999,left:(_position$x=position==null?void 0:position.x)!=null?_position$x:-9999},onLayout:function onLayout(e){var _e$nativeEvent$layout=e.nativeEvent.layout,width=_e$nativeEvent$layout.width,height=_e$nativeEvent$layout.height;var popoverRect={width:width,height:height};var pos=calculatePosition(triggerRect,popoverRect,placement,8);setPosition(pos);},children:_jsx(PopoverContent,Object.assign({placement:placement},props,{children:renderContent({onClose:onClose})}))})})})})})]});}

package/dist/components/structure/popover/Popover_BU.js

@@ -1 +1 @@
-import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/structure/popover/Popover_BU.js";var _excluded=["renderContent","content","trigger","placement","unmountOnClose","children","parentWidth","parentMinWidth","useBottomDrawer","bottomDrawerProps","watch"],_excluded2=["children","content","renderContent","snapPoints"];import React from'react';import{BottomDrawer}from"../bottomDrawer";import{PopoverContent}from"./PopoverContent";import{useRegisterOverlay}from"../overlay/OverlayHandler";import{useResponsiveValue}from"../../../responsive";import{jsx as _jsx,Fragment as _Fragment,jsxs as _jsxs}from"react/jsx-runtime";export function Popover(_ref){var _this=this;var renderContent=_ref.renderContent,content=_ref.content,_ref$trigger=_ref.trigger,trigger=_ref$trigger===void 0?'hover':_ref$trigger,_ref$placement=_ref.placement,placement=_ref$placement===void 0?'bottom':_ref$placement,unmountOnClose=_ref.unmountOnClose,children=_ref.children,parentWidth=_ref.parentWidth,parentMinWidth=_ref.parentMinWidth,_ref$useBottomDrawer=_ref.useBottomDrawer,useBottomDrawer=_ref$useBottomDrawer===void 0?{}:_ref$useBottomDrawer,_ref$bottomDrawerProp=_ref.bottomDrawerProps,bottomDrawerProps=_ref$bottomDrawerProp===void 0?{}:_ref$bottomDrawerProp,watch=_ref.watch,props=_objectWithoutProperties(_ref,_excluded);var shouldUseDrawer=useResponsiveValue(useBottomDrawer);var ref=React.useRef(null);var _useRegisterOverlay=useRegisterOverlay({unmountOnClose:unmountOnClose}),onOpen=_useRegisterOverlay.onOpen,onUpdate=_useRegisterOverlay.onUpdate,onClose=_useRegisterOverlay.onClose,onFastClose=_useRegisterOverlay.onFastClose,stopDelayedClosing=_useRegisterOverlay.stopDelayedClosing;var click=trigger==='click';var hover=trigger==='hover';var focus=trigger==='focus';renderContent=renderContent||function(){return content;};var buildContent=function buildContent(){var _ref$current,_ref$current$getBound,_ref$current2,_ref$current2$getBoun;return _jsx(PopoverContent,Object.assign({placement:placement,width:parentWidth?(_ref$current=ref.current)==null?void 0:(_ref$current$getBound=_ref$current.getBoundingClientRect())==null?void 0:_ref$current$getBound.width:undefined,minWidth:parentMinWidth?(_ref$current2=ref.current)==null?void 0:(_ref$current2$getBoun=_ref$current2.getBoundingClientRect())==null?void 0:_ref$current2$getBoun.width:undefined},props,{onMouseEnter:hover?stopDelayedClosing:undefined,onMouseLeave:hover?onClose:undefined,children:renderContent({onClose:onFastClose})}));};var computeTriggerRect=function computeTriggerRect(){var rect=ref.current.getBoundingClientRect();var scrollX=window.scrollX||window.pageXOffset;var scrollY=window.scrollY||window.pageYOffset;return{left:rect.left+scrollX,right:rect.right+scrollX,top:rect.top+scrollY,bottom:rect.bottom+scrollY,width:rect.width,height:rect.height};};var show=function show(e){if(e&&e.stopPropagation)e.stopPropagation();var triggerRect=computeTriggerRect();onOpen({content:buildContent(),triggerRect:triggerRect,placement:placement,options:{dismissOnClickOutside:click||focus}});};React.useEffect(function(){return function(){return onClose();};},[]);React.useEffect(function(){if(!ref.current)return;var triggerRect=computeTriggerRect();onUpdate({content:buildContent(),triggerRect:triggerRect,placement:placement,options:{dismissOnClickOutside:click||focus}});},[watch,renderContent]);if(shouldUseDrawer){return _jsx(DrawerPopover,Object.assign({content:content,renderContent:renderContent,children:children},props,bottomDrawerProps));}var child=React.Children.only(children);var childProps={ref:ref,onClick:show};if(hover)childProps={ref:ref,onMouseEnter:show,onMouseLeave:onClose};if(focus)childProps={ref:ref,onFocus:show};return React.cloneElement(child,childProps);}function DrawerPopover(_ref2){var children=_ref2.children,content=_ref2.content,renderContent=_ref2.renderContent,snapPoints=_ref2.snapPoints,props=_objectWithoutProperties(_ref2,_excluded2);var _React$useState=React.useState(false),_React$useState2=_slicedToArray(_React$useState,2),open=_React$useState2[0],setOpen=_React$useState2[1];var onClose=function onClose(){return setOpen(false);};var child=React.Children.only(children);var childProps={onClick:function onClick(){return setOpen(true);}};return _jsxs(_Fragment,{children:[React.cloneElement(child,childProps),_jsx(BottomDrawer,Object.assign({open:open,onClose:onClose,snapPoints:snapPoints},props,{children:renderContent({onClose:onClose})}))]});}
+import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/structure/popover/Popover_BU.js";var _excluded=["renderContent","content","trigger","placement","unmountOnClose","children","parentWidth","parentMinWidth","useBottomDrawer","bottomDrawerProps","watch"],_excluded2=["children","content","renderContent","snapPoints"];import React from'react';import{BottomDrawer}from"../../modals/bottomDrawer";import{PopoverContent}from"./PopoverContent";import{useRegisterOverlay}from"../overlay/OverlayHandler";import{useResponsiveValue}from"../../../responsive";import{jsx as _jsx,Fragment as _Fragment,jsxs as _jsxs}from"react/jsx-runtime";export function Popover(_ref){var _this=this;var renderContent=_ref.renderContent,content=_ref.content,_ref$trigger=_ref.trigger,trigger=_ref$trigger===void 0?'hover':_ref$trigger,_ref$placement=_ref.placement,placement=_ref$placement===void 0?'bottom':_ref$placement,unmountOnClose=_ref.unmountOnClose,children=_ref.children,parentWidth=_ref.parentWidth,parentMinWidth=_ref.parentMinWidth,_ref$useBottomDrawer=_ref.useBottomDrawer,useBottomDrawer=_ref$useBottomDrawer===void 0?{}:_ref$useBottomDrawer,_ref$bottomDrawerProp=_ref.bottomDrawerProps,bottomDrawerProps=_ref$bottomDrawerProp===void 0?{}:_ref$bottomDrawerProp,watch=_ref.watch,props=_objectWithoutProperties(_ref,_excluded);var shouldUseDrawer=useResponsiveValue(useBottomDrawer);var ref=React.useRef(null);var _useRegisterOverlay=useRegisterOverlay({unmountOnClose:unmountOnClose}),onOpen=_useRegisterOverlay.onOpen,onUpdate=_useRegisterOverlay.onUpdate,onClose=_useRegisterOverlay.onClose,onFastClose=_useRegisterOverlay.onFastClose,stopDelayedClosing=_useRegisterOverlay.stopDelayedClosing;var click=trigger==='click';var hover=trigger==='hover';var focus=trigger==='focus';renderContent=renderContent||function(){return content;};var buildContent=function buildContent(){var _ref$current,_ref$current$getBound,_ref$current2,_ref$current2$getBoun;return _jsx(PopoverContent,Object.assign({placement:placement,width:parentWidth?(_ref$current=ref.current)==null?void 0:(_ref$current$getBound=_ref$current.getBoundingClientRect())==null?void 0:_ref$current$getBound.width:undefined,minWidth:parentMinWidth?(_ref$current2=ref.current)==null?void 0:(_ref$current2$getBoun=_ref$current2.getBoundingClientRect())==null?void 0:_ref$current2$getBoun.width:undefined},props,{onMouseEnter:hover?stopDelayedClosing:undefined,onMouseLeave:hover?onClose:undefined,children:renderContent({onClose:onFastClose})}));};var computeTriggerRect=function computeTriggerRect(){var rect=ref.current.getBoundingClientRect();var scrollX=window.scrollX||window.pageXOffset;var scrollY=window.scrollY||window.pageYOffset;return{left:rect.left+scrollX,right:rect.right+scrollX,top:rect.top+scrollY,bottom:rect.bottom+scrollY,width:rect.width,height:rect.height};};var show=function show(e){if(e&&e.stopPropagation)e.stopPropagation();var triggerRect=computeTriggerRect();onOpen({content:buildContent(),triggerRect:triggerRect,placement:placement,options:{dismissOnClickOutside:click||focus}});};React.useEffect(function(){return function(){return onClose();};},[]);React.useEffect(function(){if(!ref.current)return;var triggerRect=computeTriggerRect();onUpdate({content:buildContent(),triggerRect:triggerRect,placement:placement,options:{dismissOnClickOutside:click||focus}});},[watch,renderContent]);if(shouldUseDrawer){return _jsx(DrawerPopover,Object.assign({content:content,renderContent:renderContent,children:children},props,bottomDrawerProps));}var child=React.Children.only(children);var childProps={ref:ref,onClick:show};if(hover)childProps={ref:ref,onMouseEnter:show,onMouseLeave:onClose};if(focus)childProps={ref:ref,onFocus:show};return React.cloneElement(child,childProps);}function DrawerPopover(_ref2){var children=_ref2.children,content=_ref2.content,renderContent=_ref2.renderContent,snapPoints=_ref2.snapPoints,props=_objectWithoutProperties(_ref2,_excluded2);var _React$useState=React.useState(false),_React$useState2=_slicedToArray(_React$useState,2),open=_React$useState2[0],setOpen=_React$useState2[1];var onClose=function onClose(){return setOpen(false);};var child=React.Children.only(children);var childProps={onClick:function onClick(){return setOpen(true);}};return _jsxs(_Fragment,{children:[React.cloneElement(child,childProps),_jsx(BottomDrawer,Object.assign({open:open,onClose:onClose,snapPoints:snapPoints},props,{children:renderContent({onClose:onClose})}))]});}

package/dist/components/text/DateText.js

@@ -0,0 +1 @@
+import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/text/DateText.js";var _excluded=["format","value","children"];import{is}from'ramda';import dayjs from'dayjs';import{Text}from"../text";import{jsx as _jsx}from"react/jsx-runtime";export function DateText(_ref){var _ref$format=_ref.format,format=_ref$format===void 0?'DD MMM YYYY':_ref$format,value=_ref.value,children=_ref.children,props=_objectWithoutProperties(_ref,_excluded);value=is(String,children)?children:value;return _jsx(Text,Object.assign({},props,{children:dayjs(value).format(format)}));}

package/dist/components/text/index.js

@@ -1 +1 @@
-export*from"./Text";export*from"./VerticalText";
+export*from"./Text";export*from"./VerticalText";export*from"./DateText";

package/dist/components/theme/ThemePicker.js

@@ -1 +1 @@
-var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/theme/ThemePicker.js";import{mapObjIndexed,mergeDeepRight,values,pipe,filter}from'ramda';import{DEFAULT_THEMES,useThemeHandler}from"../../theme";import{IconLabel}from"../presentation";import{Link}from"../actions";import{Picker}from"../inputs";import{ThemeThumb}from"./ThemeThumb";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export function ThemePicker(_ref){var _this=this;var _onChange=_ref.onChange,onlyKeys=_ref.onlyKeys,hideKeys=_ref.hideKeys;var _useThemeHandler=useThemeHandler(),activeThemeKey=_useThemeHandler.activeThemeKey,setActiveThemeKey=_useThemeHandler.setActiveThemeKey,themes=_useThemeHandler.themes,onChangeTheme=_useThemeHandler.onChangeTheme;var options=pipe(mergeDeepRight(DEFAULT_THEMES),mapObjIndexed(function(obj,key){return Object.assign({},obj,{value:key,key:key});}),values,filter(function(item){if(item.value==='_all')return false;if(onlyKeys&&onlyKeys.includes(item.value))return true;if(hideKeys&&hideKeys.includes(item.value))return false;return true;}))(themes);return _jsx(Picker,{colSpan:12,gap:"lg",value:activeThemeKey,onChange:function onChange(key){setActiveThemeKey(key);onChangeTheme==null?void 0:onChangeTheme(key);_onChange==null?void 0:_onChange(key);},options:options,renderOption:function renderOption(_ref2){var option=_ref2.option,selected=_ref2.selected,onChange=_ref2.onChange;return _jsxs(Link,{onPress:onChange,gap:"xs",children:[_jsx(ThemeThumb,{value:option.value}),_jsx(IconLabel,{center:true,label:option.label,icon:selected&&'checkbox-circle-fill',color:selected?'primary':'text3',strong:true})]});}});}
+var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/theme/ThemePicker.js";import{mapObjIndexed,mergeDeepRight,values,pipe,filter}from'ramda';import{DEFAULT_THEMES,useThemeHandler}from"../../theme";import{IconLabel}from"../presentation";import{Link}from"../actions";import{Picker}from"../inputs";import{ThemeThumb}from"./ThemeThumb";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export function ThemePicker(_ref){var _this=this;var _onChange=_ref.onChange,onlyKeys=_ref.onlyKeys,hideKeys=_ref.hideKeys;var _useThemeHandler=useThemeHandler(),activeThemeKey=_useThemeHandler.activeThemeKey,themes=_useThemeHandler.themes,onChangeTheme=_useThemeHandler.onChangeTheme;var options=pipe(mergeDeepRight(DEFAULT_THEMES),mapObjIndexed(function(obj,key){return Object.assign({},obj,{value:key,key:key});}),values,filter(function(item){if(item.value==='_all')return false;if(onlyKeys&&onlyKeys.includes(item.value))return true;if(hideKeys&&hideKeys.includes(item.value))return false;return true;}))(themes);return _jsx(Picker,{colSpan:12,gap:"lg",value:activeThemeKey,onChange:function onChange(key){onChangeTheme==null?void 0:onChangeTheme(key);_onChange==null?void 0:_onChange(key);},options:options,renderOption:function renderOption(_ref2){var option=_ref2.option,selected=_ref2.selected,onChange=_ref2.onChange;return _jsxs(Link,{onPress:onChange,gap:"xs",children:[_jsx(ThemeThumb,{value:option.value}),_jsx(IconLabel,{center:true,label:option.label,icon:selected&&'checkbox-circle-fill',color:selected?'primary':'text3',strong:true})]});}});}

package/dist/components/theme/ThemePickerDrawer.js

@@ -1 +1 @@
-var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/theme/ThemePickerDrawer.js";import{BottomDrawer}from"../structure";import{ScrollView}from"../list/ScrollView";import{ThemePicker}from"./ThemePicker";import{jsx as _jsx}from"react/jsx-runtime";export function ThemePickerDrawer(_ref){var open=_ref.open,onClose=_ref.onClose,onChange=_ref.onChange;return _jsx(BottomDrawer,{open:open,onClose:onClose,maxWidth:550,snapPoints:['50%','85%'],children:_jsx(ScrollView,{padding:"md",children:_jsx(ThemePicker,{onChange:onChange})})});}
+var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/components/theme/ThemePickerDrawer.js";import{BottomDrawer,DrawerScrollView}from"../modals/bottomDrawer";import{ThemePicker}from"./ThemePicker";import{jsx as _jsx}from"react/jsx-runtime";export function ThemePickerDrawer(_ref){var open=_ref.open,onClose=_ref.onClose,onChange=_ref.onChange;return _jsx(BottomDrawer,{open:open,onClose:onClose,maxWidth:550,snapPoints:['50%','85%'],children:_jsx(DrawerScrollView,{padding:"md",children:_jsx(ThemePicker,{onChange:onChange})})});}

package/dist/helpers/index.js

@@ -1 +1 @@
-export*from"./debounce";export*from"./string";export*from"./random";export*from"./storage";
+export*from"./debounce";export*from"./string";export*from"./random";export*from"./storage";export*from"./../abstractions/helpers/useSafeAreaInsets";

package/dist/helpers/storage.js

@@ -1 +1 @@
-import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import React from'react';import{AbsStorage}from"../abstractions/helpers/storage";function set(key,value){return AbsStorage.set(key,JSON.stringify(value));}function setAsync(key,value){return AbsStorage.setAsync(key,JSON.stringify(value));}function get(key){var value=AbsStorage.get(key);return formatStoragedValue(value);}function getAsync(key){return AbsStorage.setAsync(key).then(function(value){return formatStoragedValue(value);});}function formatStoragedValue(value){try{if(!value)return value;value=JSON.parse(value);if(value==='undefined')return undefined;if(value==='null')return undefined;return value;}catch(e){return value;}}function useState(key,defaultValue){var _React$useState=React.useState(get(key)||defaultValue),_React$useState2=_slicedToArray(_React$useState,2),value=_React$useState2[0],setValue=_React$useState2[1];var handleChange=function handleChange(newValue){set(key,newValue);setValue(newValue);};return[value,handleChange];}export var Storage=Object.assign({},AbsStorage,{set:set,setAsync:setAsync,get:get,getAsync:getAsync,useState:useState});
+import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import React from'react';import{AbsStorage}from"../abstractions/helpers/storage";var listeners={};function notify(key,value){if(listeners[key]){listeners[key].forEach(function(cb){return cb(value);});}}function subscribe(key,cb){if(!listeners[key])listeners[key]=[];listeners[key].push(cb);return function(){listeners[key]=listeners[key].filter(function(fn){return fn!==cb;});};}function set(key,value){AbsStorage.set(key,JSON.stringify(value));notify(key,value);}function setAsync(key,value){return AbsStorage.setAsync(key,JSON.stringify(value)).then(function(){notify(key,value);});}function get(key,defaultValue){var _formatStoragedValue;var value=AbsStorage.get(key);return(_formatStoragedValue=formatStoragedValue(value))!=null?_formatStoragedValue:defaultValue;}function getAsync(key,defaultValue){return AbsStorage.getAsync(key).then(function(value){var _formatStoragedValue2;return(_formatStoragedValue2=formatStoragedValue(value))!=null?_formatStoragedValue2:defaultValue;});}function formatStoragedValue(value){try{if(!value)return value;value=JSON.parse(value);if(value==='undefined')return undefined;if(value==='null')return undefined;return value;}catch(e){return value;}}function useState(key,defaultValue){var _React$useState=React.useState(function(){var _get;return(_get=get(key))!=null?_get:defaultValue;}),_React$useState2=_slicedToArray(_React$useState,2),value=_React$useState2[0],setValue=_React$useState2[1];React.useEffect(function(){return subscribe(key,setValue);},[key]);var handleChange=function handleChange(newValue){set(key,newValue);};return[value,handleChange];}export var Storage=Object.assign({},AbsStorage,{set:set,setAsync:setAsync,get:get,getAsync:getAsync,useState:useState});

package/dist/responsive/responsiveHooks.js

@@ -1 +1 @@
-import _toConsumableArray from"@babel/runtime/helpers/toConsumableArray";import{is}from'ramda';import React from'react';import{Platform}from"../abstractions/Platform";import{useBreakpoints}from"../theme/ThemeHandler";import{useResponsive}from"../responsive/ResponsiveHandler";export function useGetResponsiveValue(){var breakpoints=useBreakpoints();var _useResponsive=useResponsive(),width=_useResponsive.width,screen=_useResponsive.screen;return React.useCallback(function(value){var isNative=(value==null?void 0:value.native)!==undefined&&Platform.OS!=='web';if(isNative)return value==null?void 0:value.native;var isWeb=(value==null?void 0:value.web)!==undefined&&Platform.OS==='web';if(isWeb)return value==null?void 0:value.web;var isObj=is(Object,value);if(!isObj)return value;if(value[screen])return value[screen];var keys=Object.keys(value);var _loop=function _loop(){var match=k.match(/^(\w+)([du])$/);if(!match)return 0;var bpName=match[1];var mode=match[2];var bpIndex=breakpoints.findIndex(function(b){return b.name===bpName;});if(bpIndex===-1)return 0;if(mode==='u'){var lowerBound=bpIndex>0?breakpoints[bpIndex-1].value:0;if(width>=lowerBound)return{v:value[k]};}if(mode==='d'){if(width<breakpoints[bpIndex].value)return{v:value[k]};}},_ret;for(var k of keys){_ret=_loop();if(_ret===0)continue;if(_ret)return _ret.v;}return value==null?void 0:value.df;},[screen]);}export function useResponsiveValue(value){var getValue=useGetResponsiveValue();var isObj=is(Object,value);var valueWatch=isObj?Object.keys(value).map(function(k){return`${k}:${value[k]}`;}):[value];return React.useMemo(function(){return getValue(value);},[getValue].concat(_toConsumableArray(valueWatch)));}
+import _toConsumableArray from"@babel/runtime/helpers/toConsumableArray";import{is}from'ramda';import React from'react';import{Platform}from"../abstractions/Platform";import{useBreakpoints}from"../theme/ThemeHandler";import{useResponsive}from"../responsive/ResponsiveHandler";export function useGetResponsiveValue(){var breakpoints=useBreakpoints();var _useResponsive=useResponsive(),width=_useResponsive.width,screen=_useResponsive.screen;return React.useCallback(function(value){var isNative=(value==null?void 0:value.native)!==undefined&&Platform.OS!=='web';if(isNative)return value==null?void 0:value.native;var isWeb=(value==null?void 0:value.web)!==undefined&&Platform.OS==='web';if(isWeb)return value==null?void 0:value.web;var isIOS=(value==null?void 0:value.ios)!==undefined&&Platform.OS==='ios';if(isIOS)return value==null?void 0:value.ios;var isAndroid=(value==null?void 0:value.android)!==undefined&&Platform.OS==='android';if(isAndroid)return value==null?void 0:value.android;var isObj=is(Object,value);if(!isObj)return value;if(value[screen])return value[screen];var keys=Object.keys(value);var _loop=function _loop(){var match=k.match(/^(\w+)([du])$/);if(!match)return 0;var bpName=match[1];var mode=match[2];var bpIndex=breakpoints.findIndex(function(b){return b.name===bpName;});if(bpIndex===-1)return 0;if(mode==='u'){var lowerBound=bpIndex>0?breakpoints[bpIndex-1].value:0;if(width>=lowerBound)return{v:value[k]};}if(mode==='d'){if(width<breakpoints[bpIndex].value)return{v:value[k]};}},_ret;for(var k of keys){_ret=_loop();if(_ret===0)continue;if(_ret)return _ret.v;}return value==null?void 0:value.df;},[screen]);}export function useResponsiveValue(value){var getValue=useGetResponsiveValue();var isObj=is(Object,value);var valueWatch=isObj?Object.keys(value).map(function(k){return`${k}:${value[k]}`;}):[value];return React.useMemo(function(){return getValue(value);},[getValue].concat(_toConsumableArray(valueWatch)));}

package/dist/theme/ThemeHandler.js

@@ -1 +1 @@
-import _slicedToArray from"@babel/runtime/helpers/slicedToArray";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/theme/ThemeHandler.js";import{mergeDeepRight}from'ramda';import React from'react';import{DEFAULT_LIGHT_THEME}from"./default/lightTheme";import{getThemeValue}from"./helpers/relatedScales";import{useFormattedTheme}from"./format/formatTheme";import{jsx as _jsx}from"react/jsx-runtime";var DEFAULT_BREAKPOINTS=[{name:'sm',value:768},{name:'md',value:1024},{name:'lg',value:1440},{name:'xl',value:10000}];var ThemeContext=React.createContext(null);export var useThemeHandler=function useThemeHandler(){return React.useContext(ThemeContext)||{};};export var useBreakpoints=function useBreakpoints(){var _useThemeHandler;return((_useThemeHandler=useThemeHandler())==null?void 0:_useThemeHandler.breakpoints)||DEFAULT_BREAKPOINTS;};export var useTheme=function useTheme(groupKey){var theme=useThemeHandler().theme||DEFAULT_LIGHT_THEME;if(!groupKey)return theme;return(theme==null?void 0:theme[groupKey])||{};};export var useGetThemeValue=function useGetThemeValue(groupKey){var group=useTheme(groupKey);return function(key){return getThemeValue(group,key);};};export var useColors=function useColors(){return useTheme('colors');};export var useGetColor=function useGetColor(){return useGetThemeValue('colors');};export var useSpaces=function useSpaces(){return useTheme('spaces');};export var useGetSpace=function useGetSpace(){return useGetThemeValue('spaces');};export var useRadius=function useRadius(){return useTheme('radius');};export var useGetRadius=function useGetRadius(){return useGetThemeValue('radius');};export var useElementHeights=function useElementHeights(){return useTheme('elementHeights');};export var useGetElementHeight=function useGetElementHeight(){return useGetThemeValue('elementHeights');};export var useTexts=function useTexts(){return useTheme('texts');};export var useGetText=function useGetText(){return useGetThemeValue('text');};export var useThemeComponents=function useThemeComponents(){return useTheme('components');};export function useThemeComponent(name){var components=useThemeComponents();return components[name]||{};}export function useMergeThemeComponent(name,props){var themeProps=useThemeComponent(name);return mergeDeepRight(themeProps,props);}export function ThemeHandler(_ref){var breakpoints=_ref.breakpoints,themes=_ref.themes,initTheme=_ref.initTheme,onChangeTheme=_ref.onChangeTheme,children=_ref.children;var _React$useState=React.useState(false),_React$useState2=_slicedToArray(_React$useState,2),themePickerOpen=_React$useState2[0],setThemePickerOpen=_React$useState2[1];var openThemePicker=function openThemePicker(){return setThemePickerOpen(true);};var _React$useState3=React.useState(initTheme||'light'),_React$useState4=_slicedToArray(_React$useState3,2),activeThemeKey=_React$useState4[0],setActiveThemeKey=_React$useState4[1];var toggleTheme=function toggleTheme(){return setActiveThemeKey(activeThemeKey==='light'?'dark':'light');};var theme=useFormattedTheme(themes,activeThemeKey);var value={theme:theme,themes:themes,activeThemeKey:activeThemeKey,setActiveThemeKey:setActiveThemeKey,toggleTheme:toggleTheme,themePickerOpen:themePickerOpen,setThemePickerOpen:setThemePickerOpen,onChangeTheme:onChangeTheme,openThemePicker:openThemePicker,toggleTheme:toggleTheme,breakpoints:breakpoints||DEFAULT_BREAKPOINTS};return _jsx(ThemeContext.Provider,{value:value,children:children});}
+import _slicedToArray from"@babel/runtime/helpers/slicedToArray";var _jsxFileName="/Users/christianstorch/Apps/nekoapps/libs/neko-ui/src/theme/ThemeHandler.js";import{mergeDeepRight}from'ramda';import React from'react';import{DEFAULT_LIGHT_THEME}from"./default/lightTheme";import{getThemeValue}from"./helpers/relatedScales";import{useFormattedTheme}from"./format/formatTheme";import{jsx as _jsx}from"react/jsx-runtime";var DEFAULT_BREAKPOINTS=[{name:'sm',value:768},{name:'md',value:1024},{name:'lg',value:1440},{name:'xl',value:10000}];var ThemeContext=React.createContext(null);export var useThemeHandler=function useThemeHandler(){return React.useContext(ThemeContext)||{};};export var useBreakpoints=function useBreakpoints(){var _useThemeHandler;return((_useThemeHandler=useThemeHandler())==null?void 0:_useThemeHandler.breakpoints)||DEFAULT_BREAKPOINTS;};export var useTheme=function useTheme(groupKey){var theme=useThemeHandler().theme||DEFAULT_LIGHT_THEME;if(!groupKey)return theme;return(theme==null?void 0:theme[groupKey])||{};};export var useGetThemeValue=function useGetThemeValue(groupKey){var group=useTheme(groupKey);return function(key){return getThemeValue(group,key);};};export var useColors=function useColors(){return useTheme('colors');};export var useGetColor=function useGetColor(){return useGetThemeValue('colors');};export var useSpaces=function useSpaces(){return useTheme('spaces');};export var useGetSpace=function useGetSpace(){return useGetThemeValue('spaces');};export var useRadius=function useRadius(){return useTheme('radius');};export var useGetRadius=function useGetRadius(){return useGetThemeValue('radius');};export var useElementHeights=function useElementHeights(){return useTheme('elementHeights');};export var useGetElementHeight=function useGetElementHeight(){return useGetThemeValue('elementHeights');};export var useTexts=function useTexts(){return useTheme('texts');};export var useGetText=function useGetText(){return useGetThemeValue('text');};export var useThemeComponents=function useThemeComponents(){return useTheme('components');};export function useThemeComponent(name){var components=useThemeComponents();return components[name]||{};}export function useMergeThemeComponent(name,props){var themeProps=useThemeComponent(name);return mergeDeepRight(themeProps,props);}export function ThemeHandler(_ref){var breakpoints=_ref.breakpoints,themes=_ref.themes,initTheme=_ref.initTheme,onChangeTheme=_ref.onChangeTheme,children=_ref.children;var _React$useState=React.useState(false),_React$useState2=_slicedToArray(_React$useState,2),themePickerOpen=_React$useState2[0],setThemePickerOpen=_React$useState2[1];var openThemePicker=function openThemePicker(){return setThemePickerOpen(true);};var _React$useState3=React.useState(initTheme||'light'),_React$useState4=_slicedToArray(_React$useState3,2),activeThemeKey=_React$useState4[0],setActiveThemeKey=_React$useState4[1];var handleChangeTheme=function handleChangeTheme(key){setActiveThemeKey(key);onChangeTheme==null?void 0:onChangeTheme(key);};var toggleTheme=function toggleTheme(){return handleChangeTheme(activeThemeKey==='light'?'dark':'light');};var theme=useFormattedTheme(themes,activeThemeKey);var value={theme:theme,themes:themes,activeThemeKey:activeThemeKey,toggleTheme:toggleTheme,themePickerOpen:themePickerOpen,setThemePickerOpen:setThemePickerOpen,onChangeTheme:handleChangeTheme,openThemePicker:openThemePicker,toggleTheme:toggleTheme,breakpoints:breakpoints||DEFAULT_BREAKPOINTS};return _jsx(ThemeContext.Provider,{value:value,children:children});}

package/dist/theme/default/base.js

@@ -1 +1 @@
-export var BASE_THEME={spaces:{xxxs:1,xxs:3,xs:5,sm:10,md:15,lg:20,xl:30,xxl:40,xxxl:50},radius:{xxxs:4,xxs:5,xs:5,sm:7,md:8,lg:10,xl:12,xxl:15,xxxl:18},icons:{xxxs:10,xxs:12,xs:14,sm:16,md:18,lg:22,xl:26,xxl:28,xxxl:32},elementHeights:{xxxs:10,xxs:15,xs:20,sm:30,md:35,lg:40,xl:50,xxl:60,xxxl:70},texts:{h1:{fontSize:35,strong:true},h2:{fontSize:28,strong:true},h3:{fontSize:26,strong:true},h4:{fontSize:22,strong:true},h5:{fontSize:18,strong:true},h6:{fontSize:16,strong:true},p:{fontSize:14},sm:{fontSize:12},xs:{fontSize:10},xxs:{fontSize:8}}};
+export var BASE_THEME={spaces:{xxxs:1,xxs:3,xs:5,sm:10,md:15,lg:20,xl:30,xxl:40,xxxl:50},radius:{xxxs:4,xxs:5,xs:5,sm:7,md:8,lg:10,xl:12,xxl:15,xxxl:18},icons:{xxxs:10,xxs:12,xs:14,sm:16,md:18,lg:22,xl:26,xxl:28,xxxl:32},elementHeights:{xxxs:10,xxs:15,xs:25,sm:35,md:40,lg:45,xl:50,xxl:60,xxxl:70},texts:{h1:{fontSize:35,strong:true},h2:{fontSize:28,strong:true},h3:{fontSize:26,strong:true},h4:{fontSize:22,strong:true},h5:{fontSize:18,strong:true},h6:{fontSize:16,strong:true},p:{fontSize:14},sm:{fontSize:12},xs:{fontSize:10},xxs:{fontSize:8}}};

package/dist/theme/default/blackTheme.js

@@ -1 +1 @@
-import{mergeDeepRight}from'ramda';import{BASE_THEME}from"./base";export var DEFAULT_BLACK_THEME=mergeDeepRight(BASE_THEME,{label:'Pitch Black',colors:{primary:'#818DF9',text:'#FFFFFF',text2:'#E0E0E0',text3:'#B0B0B0',text4:'#8A8A8A',mainBG:'#0f0f0f',overlayBG:'#000000',backdrop:'#1f1f1f',shadow:'rgba(216, 210, 203, 0.1)',divider:'#383E44',blue:'#4DA3FF',yellow:'#FFD93B',green:'#4CAF50',purple:'#9B59B6',orange:'#FF7F50',cyan:'#00BCD4',red:'#E74C3C',navy:'#34495E',indigo:'#5C6BC0',gray:'#9E9E9E',brown:'#8D6E63',lylac:'#B39DDB',pink:'#F48FB1'}});
+import{mergeDeepRight}from'ramda';import{BASE_THEME}from"./base";export var DEFAULT_BLACK_THEME=mergeDeepRight(BASE_THEME,{label:'Pitch Black',colors:{primary:'#818DF9',text:'#F2F2F2',text2:'#CFCFCF',text3:'#A6A6A6',text4:'#737373',mainBG:'#0A0A0A',overlayBG:'#141414',backdrop:'#1f1f1f',shadow:'rgba(0, 0, 0, 0.7)',transparent:'rgba(0, 0, 0, 0)',divider:'#262626',blue:'#3A7BFF',yellow:'#FFC857',green:'#2ECC71',purple:'#9B5DE5',orange:'#FF8C42',cyan:'#00C2D1',red:'#FF4D4F',navy:'#1F2A44',indigo:'#5C6BC0',gray:'#8E8E93',brown:'#8B5E3C',lylac:'#C77DFF',pink:'#FF6FAE'}});

package/dist/theme/default/cyberpunkTheme.js

@@ -1 +1 @@
-import{mergeDeepRight}from'ramda';import{BASE_THEME}from"./base";export var CYBERPUNK_DARK_THEME=mergeDeepRight(BASE_THEME,{label:'Cyberpunk',colors:{primary:'#FCEE09',text:'#FFFFFF',text2:'#B3B3B3',text3:'#8C8C8C',text4:'#666666',mainBG:'#14141F',overlayBG:'#14141F',backdrop:'#0A0A0F',shadow:'rgba(39, 45, 52, 0.6)',divider:'rgba(255,255,255, 0.2)',blue:'#00E5FF',yellow:'#FFD600',green:'#00FF9D',purple:'#D500F9',orange:'#FF9100',cyan:'#00B8D4',red:'#FF1744',navy:'#1E2A38',indigo:'#651FFF',gray:'#757575',brown:'#6D4C41',lylac:'#B388FF',pink:'#FF80AB'}});
+import{mergeDeepRight}from'ramda';import{BASE_THEME}from"./base";export var CYBERPUNK_DARK_THEME=mergeDeepRight(BASE_THEME,{label:'Cyberpunk',colors:{primary:'#FF4FD8',text:'#F5EFFF',text2:'#D6C8FF',text3:'#A78BFA',text4:'#7C6BB3',mainBG:'#0A0614',overlayBG:'#140A26',backdrop:'#0A0A0F',shadow:'rgba(0, 0, 0, 0.7)',transparent:'rgba(0, 0, 0, 0)',divider:'#24123A',blue:'#00B3FF',yellow:'#FFD166',green:'#00F5A0',purple:'#9D4EDD',orange:'#FF7A18',cyan:'#00E5FF',red:'#FF3D6E',navy:'#1B1B3A',indigo:'#5A67FF',gray:'#8E8EAA',brown:'#8B5CF6',lylac:'#C77DFF',pink:'#FF4FD8'}});

package/dist/theme/default/darkTheme.js

@@ -1 +1 @@
-import{mergeDeepRight}from'ramda';import{BASE_THEME}from"./base";export var DEFAULT_DARK_THEME=mergeDeepRight(BASE_THEME,{label:'Dark',colors:{primary:'#818DF9',text:'#FFFFFF',text2:'#E0E0E0',text3:'#B0B0B0',text4:'#8A8A8A',mainBG:'#383E44',overlayBG:'#272D34',backdrop:'#383E44',shadow:'rgba(216, 210, 203, 0.1)',divider:'#383E44',blue:'#4DA3FF',yellow:'#FFD93B',green:'#4CAF50',purple:'#9B59B6',orange:'#FF7F50',cyan:'#00BCD4',red:'#E74C3C',navy:'#34495E',indigo:'#5C6BC0',gray:'#9E9E9E',brown:'#8D6E63',lylac:'#B39DDB',pink:'#F48FB1'}});
+import{mergeDeepRight}from'ramda';import{BASE_THEME}from"./base";export var DEFAULT_DARK_THEME=mergeDeepRight(BASE_THEME,{label:'Dark',colors:{primary:'#818DF9',text:'#FFFFFF',text2:'#E0E0E0',text3:'#B0B0B0',text4:'#8A8A8A',mainBG:'#383E44',overlayBG:'#272D34',backdrop:'#383E44',shadow:'rgba(216, 210, 203, 0.1)',transparent:'rgba(0, 0, 0, 0)',divider:'#383E44',blue:'#4DA3FF',yellow:'#FFD93B',green:'#4CAF50',purple:'#9B59B6',orange:'#FF7F50',cyan:'#00BCD4',red:'#E74C3C',navy:'#34495E',indigo:'#5C6BC0',gray:'#9E9E9E',brown:'#8D6E63',lylac:'#B39DDB',pink:'#F48FB1'}});

package/dist/theme/default/hackerTheme.js

@@ -1 +1 @@
-import{mergeDeepRight}from'ramda';import{BASE_THEME}from"./base";export var DEFAULT_MATRIX_THEME=mergeDeepRight(BASE_THEME,{label:'Hacker',colors:{primary:'#00FF41',text:'#00FF41',text2:'#00CC33',text3:'#009926',text4:'#00661A',mainBG:'#000000',overlayBG:'#0A0A0A',backdrop:'#000000',shadow:'rgba(0, 255, 65, 0.2)',divider:'rgba(0,255,65, 0.3)',blue:'#0087BD',yellow:'#AEBF00',green:'#00FF41',purple:'#7A1FA2',orange:'#FF6D00',cyan:'#00BFA5',red:'#D50000',navy:'#003366',indigo:'#303F9F',gray:'#4A4A4A',brown:'#5D4037',lylac:'#8E24AA',pink:'#C51162'},components:{Card:{border:1,br:5,borderColor:'divider'}}});
+import{mergeDeepRight}from'ramda';import{BASE_THEME}from"./base";export var DEFAULT_MATRIX_THEME=mergeDeepRight(BASE_THEME,{label:'Hacker',colors:{primary:'#00FF41',text:'#D2FFE9',text2:'#A6F5D0',text3:'#6EE7B7',text4:'#3FAF85',mainBG:'#000000',overlayBG:'#0A0A0A',backdrop:'#000000',shadow:'rgba(0, 255, 65, 0.2)',transparent:'rgba(0, 0, 0, 0)',divider:'rgba(0,255,65, 0.3)',blue:'#00B3FF',yellow:'#E6FF3F',green:'#00FF41',purple:'#9B5DE5',orange:'#FF9F1C',cyan:'#00FFE0',red:'#FF3B3B',navy:'#001F2F',indigo:'#4B6BFF',gray:'#2E2E2E',brown:'#5C4033',lylac:'#C084FC',pink:'#FF4FD8'},radius:{xxxs:0,xxs:1,xs:2,sm:3,md:4,lg:5,xl:6,xxl:7,xxxl:8},components:{Card:{border:true},Section:{border:true}}});

package/dist/theme/default/lightTheme.js

@@ -1 +1 @@
-import{mergeDeepRight}from'ramda';import{BASE_THEME}from"./base";export var DEFAULT_LIGHT_THEME=mergeDeepRight(BASE_THEME,{label:'Light',colors:{primary:'#818DF9',text:'#272D34',text2:'#4A5159',text3:'#6E7680',text4:'#9AA1AC',mainBG:'#F4F5FE',overlayBG:'#FFFFFF',backdrop:'#383E44',shadow:'rgba(39, 45, 52, 0.15)',divider:'#e0e0e0',blue:'#4DA3FF',yellow:'#FFD93B',green:'#4CAF50',purple:'#9B59B6',orange:'#FF7F50',cyan:'#00BCD4',red:'#E74C3C',navy:'#34495E',indigo:'#5C6BC0',gray:'#B0BEC5',brown:'#8D6E63',lylac:'#B39DDB',pink:'#F48FB1'}});
+import{mergeDeepRight}from'ramda';import{BASE_THEME}from"./base";export var DEFAULT_LIGHT_THEME=mergeDeepRight(BASE_THEME,{label:'Light',colors:{primary:'#818DF9',text:'#272D34',text2:'#4A5159',text3:'#6E7680',text4:'#9AA1AC',mainBG:'#F4F5FE',overlayBG:'#FFFFFF',backdrop:'#383E44',shadow:'rgba(39, 45, 52, 0.15)',transparent:'rgba(255, 255, 255, 0)',divider:'#e0e0e0',blue:'#4DA3FF',yellow:'#FFD93B',green:'#4CAF50',purple:'#9B59B6',orange:'#FF7F50',cyan:'#00BCD4',red:'#E74C3C',navy:'#34495E',indigo:'#5C6BC0',gray:'#B0BEC5',brown:'#8D6E63',lylac:'#B39DDB',pink:'#F48FB1'}});

package/dist/theme/default/paperTheme.js

@@ -1 +1 @@
-import{mergeDeepRight}from'ramda';import{BASE_THEME}from"./base";export var DEFAULT_PAPER_THEME=mergeDeepRight(BASE_THEME,{label:'Paper',colors:{primary:'#5A5A5A',text:'#000000',text2:'#333333',text3:'#555555',text4:'#777777',mainBG:'#F8F1E3',overlayBG:'#F8F1E3',backdrop:'#383E44',shadow:'rgba(0, 0, 0, 0.04)',divider:'#E3D9C9',blue:'#6B8EAE',yellow:'#EADCA6',green:'#88A288',purple:'#A391B8',orange:'#D9A066',cyan:'#9CC9C2',red:'#B85C5C',navy:'#4A4A4A',indigo:'#70788C',gray:'#B8B8B8',brown:'#8B7355',lylac:'#C7B7D4',pink:'#E4A1B2'}});
+import{mergeDeepRight}from'ramda';import{BASE_THEME}from"./base";export var DEFAULT_PAPER_THEME=mergeDeepRight(BASE_THEME,{label:'Paper',colors:{primary:'#5A5A5A',text:'#000000',text2:'#333333',text3:'#555555',text4:'#777777',mainBG:'#F8F1E3',overlayBG:'#F8F1E3',backdrop:'#383E44',shadow:'rgba(0, 0, 0, 0.04)',divider:'#E3D9C9',blue:'#6B8EAE',yellow:'#EADCA6',green:'#88A288',purple:'#A391B8',orange:'#D9A066',cyan:'#9CC9C2',red:'#B85C5C',navy:'#4A4A4A',indigo:'#70788C',gray:'#B8B8B8',brown:'#8B7355',lylac:'#C7B7D4',pink:'#E4A1B2'},components:{Card:{border:true},Section:{border:true},TopBar:{borderB:true}}});

package/dist/theme/default/themes.js

@@ -1 +1 @@
-import{CYBERPUNK_DARK_THEME}from"./cyberpunkTheme";import{DEFAULT_BLACK_THEME}from"./blackTheme";import{DEFAULT_DARK_THEME}from"./darkTheme";import{DEFAULT_LIGHT_THEME}from"./lightTheme";import{DEFAULT_MATRIX_THEME}from"./hackerTheme";import{DEFAULT_MSDOS_THEME}from"./msdosTheme";import{DEFAULT_PAPER_THEME}from"./paperTheme";import{MIDNIGHT_NEON_THEME}from"./midnightTheme";export var DEFAULT_THEMES={light:DEFAULT_LIGHT_THEME,dark:DEFAULT_DARK_THEME,paper:DEFAULT_PAPER_THEME,black:DEFAULT_BLACK_THEME,midnight:MIDNIGHT_NEON_THEME,cyberpunk:CYBERPUNK_DARK_THEME,hacker:DEFAULT_MATRIX_THEME,msdos:DEFAULT_MSDOS_THEME};
+import{CYBERPUNK_DARK_THEME}from"./cyberpunkTheme";import{DEFAULT_BLACK_THEME}from"./blackTheme";import{DEFAULT_DARK_THEME}from"./darkTheme";import{DEFAULT_LIGHT_THEME}from"./lightTheme";import{DEFAULT_MATRIX_THEME}from"./hackerTheme";import{DEFAULT_PAPER_THEME}from"./paperTheme";export var DEFAULT_THEMES={light:DEFAULT_LIGHT_THEME,dark:DEFAULT_DARK_THEME,paper:DEFAULT_PAPER_THEME,black:DEFAULT_BLACK_THEME,cyberpunk:CYBERPUNK_DARK_THEME,hacker:DEFAULT_MATRIX_THEME};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@neko-os/ui",
-  "version": "0.0.13",
+  "version": "0.2.0",
   "author": "Christian Storch <ccstorch@gmail.com>",
   "main": "dist/index.js",
   "module": "dist/index.js",

package/src/NekoUI.js

@@ -1,6 +1,6 @@
 import { DynamicStyleTag } from './DynamicStyleTag'
 import { I18nProvider } from './i18n'
-import { ModalsHandler } from './components/structure/modal/handler/ModalsHandler'
+import { ModalsHandler } from './components/modals/modal/handler/ModalsHandler'
 import { NotificationsHandler } from './components/feedback/notifications/NotificationsHandler'
 import { OverlayHandler } from './components/structure/overlay/OverlayHandler'
 import { PortalHandler } from './components/helpers/PortalHandler'

package/src/abstractions/FlatList.native.js

@@ -1,7 +1,7 @@
 import { FlatList } from 'react-native'
 
 export const AbsFlatList = ({
-  style: { height, width, ...style },
+  style: { height, width, flex, ...style },
   ItemSeparatorComponent,
   Separator,
   renderSeparator,
@@ -25,6 +25,7 @@ export const AbsFlatList = ({
     <FlatList
       height={height}
       width={width}
+      style={{ flex }}
       {...props}
       ItemSeparatorComponent={ItemSeparatorComponent}
       ListEmptyComponent={ListEmptyComponent}

package/src/abstractions/KeyboardAvoidingView.js

@@ -0,0 +1,3 @@
+import { AbsView } from './View'
+
+export const AbsKeyboardAvoidingView = AbsView

package/src/abstractions/KeyboardAvoidingView.native.js

@@ -0,0 +1,3 @@
+import { KeyboardAvoidingView } from 'react-native'
+
+export const AbsKeyboardAvoidingView = KeyboardAvoidingView

package/src/abstractions/ScrollView.native.js

@@ -1,5 +1,5 @@
 import { ScrollView } from 'react-native'
 
-export const AbsScrollView = ({ style: { height, width, ...style }, ...props }) => {
-  return <ScrollView height={height} width={width} {...props} contentContainerStyle={style} />
+export const AbsScrollView = ({ style: { height, width, flex, ...style }, ...props }) => {
+  return <ScrollView height={height} width={width} style={{ flex }} {...props} contentContainerStyle={style} />
 }

package/src/components/actions/ActionsDrawer.js

@@ -0,0 +1,68 @@
+import { pipe } from 'ramda'
+
+import { TopBar, View } from '../structure'
+import { BottomDrawer, DrawerScrollView } from '../modals/bottomDrawer'
+import { Menu } from './menu/Menu'
+import { Section } from '../sections'
+import { useDefaultModifier } from '../../modifiers/default'
+import { useThemeComponentModifier } from '../../modifiers/themeComponent'
+
+const DEFAULT_PROPS = {
+  useSafeArea: false,
+  bg: 'mainBG',
+  topBarProps: {
+    useSafeArea: false,
+  },
+  menuProps: {
+    vertical: true,
+    linkPaddingH: 'md',
+    linkMinHeight: 'xl',
+    withDivider: true,
+  },
+}
+
+function Content({ items, title, subtitle, onClose, onChange, topBarProps, menuProps }) {
+  const handleChange = (...params) => {
+    onChange?.(...params)
+    onClose()
+  }
+
+  return (
+    <>
+      <TopBar title={title} subtitle={subtitle} {...topBarProps} />
+
+      <View flex>
+        <DrawerScrollView>
+          {!title && <View paddingT="md" />}
+          <Section>
+            <Menu items={items} onChange={handleChange} {...menuProps} />
+          </Section>
+          <View height={100} />
+        </DrawerScrollView>
+      </View>
+    </>
+  )
+}
+
+export function ActionsDrawer({ items, onChange, title, subtitle, onClose, ...rootProps }) {
+  const [{}, formattedProps] = pipe(
+    useThemeComponentModifier('ActionsDrawer'), //
+    useDefaultModifier(DEFAULT_PROPS)
+  )([{}, rootProps])
+
+  const { topBarProps, menuProps, ...props } = formattedProps
+
+  return (
+    <BottomDrawer onClose={onClose} {...props}>
+      <Content
+        onClose={onClose}
+        topBarProps={topBarProps}
+        menuProps={menuProps}
+        title={title}
+        subtitle={subtitle}
+        onChange={onChange}
+        items={items}
+      />
+    </BottomDrawer>
+  )
+}

package/src/components/actions/Button.js

@@ -54,7 +54,7 @@ export function Button({ children, ...rootProps }) {
     useBorderModifier
   )([{}, rootProps])
 
-  const { label, icon, textProps, iconProps, gap, invert, size, ...props } = formattedProps
+  const { label, icon, textProps, iconProps, gap, invert, size, iconLabelProps, ...props } = formattedProps
 
   return (
     <AbsTouchableOpacity className="neko-button neko-wave-click-effect" type="button" {...props}>
@@ -70,6 +70,7 @@ export function Button({ children, ...rootProps }) {
           textProps={{ strong: true, ...textProps }}
           iconProps={iconProps}
           loading={loading}
+          {...iconLabelProps}
         />
       )}
     </AbsTouchableOpacity>

package/src/components/actions/FloatingMenu.js

@@ -0,0 +1,39 @@
+import { Icon } from '../presentation'
+import { Link } from './Link'
+import { Text } from '../text'
+import { View } from '../structure'
+import { moveScale } from '../../theme/helpers/sizeScale'
+import { useSafeAreaInsets } from '../../abstractions/helpers/useSafeAreaInsets'
+
+export function FloatingMenu({ fixed, onChange, items, activeIndex, size = 'md', WrapperView, ...props }) {
+  const insets = useSafeAreaInsets()
+  const height = moveScale(size, 2)
+
+  const bg = !WrapperView ? 'overlayBG' : null
+  WrapperView = WrapperView || View
+
+  return (
+    <View absolute={!fixed} fixed={fixed} left="md" right="md" centerH bottom={Math.max(insets.bottom, 16)}>
+      <WrapperView height={height} shadow round row paddingH="sm" bg={bg} {...props}>
+        {items.map((item, index) => {
+          const isActive = index === activeIndex
+
+          return (
+            <Link key={index} onPress={() => onChange(item, index)} center padding="xs" gap={3} width={height} round>
+              <Icon
+                name={isActive ? item.icon?.replace(/line(?=[^line]*$)/, 'fill') : item.icon}
+                size={height}
+                color={isActive ? 'primary' : 'text3'}
+              />
+              {!!item.label && (
+                <Text size="xxs" center color={isActive ? 'primary' : 'text3'} strong numberOfLines={1}>
+                  {item.label}
+                </Text>
+              )}
+            </Link>
+          )
+        })}
+      </WrapperView>
+    </View>
+  )
+}

package/src/components/actions/index.js

@@ -5,3 +5,5 @@ export * from './Pressable'
 export * from './Dropdown'
 export * from './Breadcrumb'
 export * from './menu/Menu'
+export * from './FloatingMenu'
+export * from './ActionsDrawer'

package/src/components/animations/AnimatedTopBar.js

@@ -0,0 +1,10 @@
+import { AnimatedView } from './AnimatedView'
+import { TopBar } from '../structure'
+
+export function AnimatedTopBar(props) {
+  return (
+    <AnimatedView style={{ position: 'absolute', top: 0, left: 0, right: 0, zIndex: 90 }} fade>
+      <TopBar {...props} />
+    </AnimatedView>
+  )
+}