@neko-os/ui 0.0.9 → 0.0.11

package/src/index.css

@@ -62,6 +62,10 @@ button {
   opacity: 0.95;
 }
 
+/* ::placeholder { */
+/* color: rgba(127, 127, 127, 0.4); */
+/* } */
+
 @keyframes wave-effect {
   0% {
     opacity: 1;

package/src/index.js

@@ -2,6 +2,7 @@ export * from './helpers'
 export * from './components'
 export * from './theme'
 export * from './responsive'
+export * from './i18n'
 export * from './NekoUI'
 
 export const version = 41

package/src/modifiers/animations/fadeEffect.web.js

@@ -0,0 +1,3 @@
+import { useFadeEffect as useFadeEffectNative } from './fadeEffect.native'
+
+export const useFadeEffect = useFadeEffectNative

package/src/modifiers/animations/scrollEffect.web.js

@@ -0,0 +1,3 @@
+import { useScrollEffect as useScrollEffectNative } from './scrollEffect.native'
+
+export const useScrollEffect = useScrollEffectNative

package/src/modifiers/animations/slideEffect.web.js

@@ -0,0 +1,3 @@
+import { useSlideEffect as useSlideEffectNative } from './slideEffect.native'
+
+export const useSlideEffect = useSlideEffectNative

package/src/modifiers/fullColor.js

@@ -3,7 +3,10 @@ import tinycolor from 'tinycolor2'
 import { getContrastColor } from '../theme/helpers/contrastColor'
 import { useGetColor } from '../theme/ThemeHandler'
 
-export function useFullColorModifier([{ color, ...values }, { outline, contrastTolerance, fill, ...props }]) {
+export function useFullColorModifier([
+  { color, ...values },
+  { outline, contrastTolerance, fill, bg: forcedBG, ...props },
+]) {
   const getColor = useGetColor()
 
   let bg = color
@@ -22,7 +25,7 @@ export function useFullColorModifier([{ color, ...values }, { outline, contrastT
     { ...values, fontColor },
     {
       ...props,
-      bg,
+      bg: forcedBG || bg,
       borderColor,
     },
   ]

package/src/modifiers/overflow.js

@@ -1,12 +1,17 @@
 import { clearProps } from './_helpers'
 
 export function useOverflowModifier([values, props]) {
-  let { hiddenOverflow, scroll, scrollY, scrollX, overflow, overflowY, overflowX, ...restProps } = props
+  let { hiddenOverflow, scroll, noScroll, scrollY, scrollX, overflow, overflowY, overflowX, ...restProps } = props
 
   if (hiddenOverflow) overflow = 'hidden'
   if (scroll) overflow = 'scroll'
   if (scrollY) overflowY = 'scroll'
   if (scrollX) overflowX = 'scroll'
+  if (noScroll) {
+    if (overflow === 'scroll') overflow = undefined
+    if (overflowY === 'scroll') overflowY = undefined
+    if (overflowX === 'scroll') overflowX = undefined
+  }
 
   const style = clearProps({ overflow, overflowY, overflowX })
 

package/src/modifiers/position.js

@@ -1,7 +1,9 @@
 import { Platform } from '../abstractions/Platform'
 import { clearProps } from './_helpers'
+import { useGetSpace } from '../theme'
 
 export function usePositionModifier([values, props]) {
+  const getSpace = useGetSpace()
   let {
     position,
     absolute,
@@ -24,6 +26,11 @@ export function usePositionModifier([values, props]) {
   if (fixed || fixedFill) position = 'fixed'
   if (sticky) position = 'sticky'
 
+  top = getSpace(top)
+  bottom = getSpace(bottom)
+  right = getSpace(right)
+  left = getSpace(left)
+
   if (absoluteFill || fixedFill) {
     top = 0
     bottom = 0

package/src/theme/default/base.js

@@ -37,11 +37,15 @@ export const BASE_THEME = {
 
   // Buttons, inputs, etc.
   elementHeights: {
+    xxxs: 10,
+    xxs: 15,
     xs: 20,
     sm: 30,
     md: 35,
-    lg: 50,
-    xl: 60,
+    lg: 40,
+    xl: 50,
+    xxl: 60,
+    xxxl: 70,
   },
 
   texts: {