@loadsmart/loadsmart-ui - npm Package Compare versions

Comparing version 0.11.0 to 0.12.0

dist/index.d.ts

@@ -7,1 +7,3 @@ export { Button, SelectorButton, IconButton } from './components/Button';
 export type { RadioProps } from './components/Radio';
+export { TextField, useTextField } from './components/TextField';
+export type { TextFieldProps } from './components/TextField';

dist/theming/index.js

@@ -1,2 +0,2 @@
-export { e as ThemeAlice, f as ThemeLoadsmart, g as default } from '../index-be321949.js';
+export { e as ThemeAlice, f as ThemeLoadsmart, g as default } from '../index-2bc2d7c1.js';
 //# sourceMappingURL=index.js.map

dist/theming/themes/alice.theme.d.ts

@@ -176,2 +176,36 @@ export declare const OPACITIES: {
     'tooltip-shadow': string | number;
+    'text-field-border-radius': string | number;
+    'text-field-color': string | number;
+    'text-field-font-size': string | number;
+    'text-field-font-weight': string | number;
+    'text-field-font-height': string | number;
+    'text-field-height': string;
+    'text-field-padding-x': string | number;
+    'text-field-padding-y': string | number;
+    'text-field-outline': string | number;
+    'text-field-small-height': string;
+    'text-field-small-padding-x': string | number;
+    'text-field-small-padding-y': string | number;
+    'text-field-small-font-size': string | number;
+    'text-field-large-height': string;
+    'text-field-large-padding-x': string | number;
+    'text-field-large-padding-y': string;
+    'text-field-large-font-size': string | number;
+    'text-field-background': string | number;
+    'text-field-background--hover': string | number;
+    'text-field-background--focus': string | number;
+    'text-field-background--disabled': string | number;
+    'text-field-border-color': string | number;
+    'text-field-border-color--hover': string | number;
+    'text-field-border-color--focus': string | number;
+    'text-field-border-color--disabled': string | number;
+    'text-field-dark-color': string | number;
+    'text-field-dark-background': string | number;
+    'text-field-dark-border-color': string | number;
+    'text-field-dark-border-color--hover': string | number;
+    'text-field-dark-border-color--focus': string | number;
+    'text-field-dark-border-color--disabled': string | number;
+    'text-field-success-border-color': string | number;
+    'text-field-danger-border-color': string | number;
+    'text-field-dark-outline': string | number;
     'space-none': number;
@@ -178,0 +212,0 @@ 'space-2xs': string;

dist/theming/themes/loadsmart.theme.d.ts

@@ -243,2 +243,36 @@ export declare const COLORS: {
     'tooltip-shadow': string | number;
+    'text-field-border-radius': string | number;
+    'text-field-color': string | number;
+    'text-field-font-size': string | number;
+    'text-field-font-weight': string | number;
+    'text-field-font-height': string | number;
+    'text-field-height': string;
+    'text-field-padding-x': string | number;
+    'text-field-padding-y': string | number;
+    'text-field-outline': string | number;
+    'text-field-small-height': string;
+    'text-field-small-padding-x': string | number;
+    'text-field-small-padding-y': string | number;
+    'text-field-small-font-size': string | number;
+    'text-field-large-height': string;
+    'text-field-large-padding-x': string | number;
+    'text-field-large-padding-y': string;
+    'text-field-large-font-size': string | number;
+    'text-field-background': string | number;
+    'text-field-background--hover': string | number;
+    'text-field-background--focus': string | number;
+    'text-field-background--disabled': string | number;
+    'text-field-border-color': string | number;
+    'text-field-border-color--hover': string | number;
+    'text-field-border-color--focus': string | number;
+    'text-field-border-color--disabled': string | number;
+    'text-field-dark-color': string | number;
+    'text-field-dark-background': string | number;
+    'text-field-dark-border-color': string | number;
+    'text-field-dark-border-color--hover': string | number;
+    'text-field-dark-border-color--focus': string | number;
+    'text-field-dark-border-color--disabled': string | number;
+    'text-field-success-border-color': string | number;
+    'text-field-danger-border-color': string | number;
+    'text-field-dark-outline': string | number;
     'space-none': number;
@@ -245,0 +279,0 @@ 'space-2xs': string;

dist/tools/index.js

@@ -1,3 +0,3 @@
-export { c as conditional, p as prop } from '../conditional-844d67a9.js';
-import '../index-be321949.js';
+export { c as conditional, p as prop } from '../conditional-6d45ae80.js';
+import '../index-2bc2d7c1.js';
 //# sourceMappingURL=index.js.map

package.json

 {
   "name": "@loadsmart/loadsmart-ui",
-  "version": "0.11.0",
+  "version": "0.12.0",
   "description": "Loadsmart UI",
@@ -5,0 +5,0 @@ "main": "dist",

src/theming/themes/alice.theme.ts

@@ -348,4 +348,50 @@ import {
   'tooltip-shadow': shadow('droplist'),
+
+  // text-field
+  'text-field-border-radius': border.radius('s'),
+  'text-field-color': color('neutral-darker'),
+  'text-field-font-size': font.size('4'),
+  'text-field-font-weight': font.weight('medium'),
+  'text-field-font-height': font.height('3'),
+  'text-field-height': rem('36px'),
+  'text-field-padding-x': spacing('s'),
+  'text-field-padding-y': spacing('s'),
+
+  'text-field-outline': shadow('glow-primary'),
+
+  'text-field-small-height': rem('24px'),
+  'text-field-small-padding-x': spacing('s'),
+  'text-field-small-padding-y': spacing('xs'),
+  'text-field-small-font-size': font.size('5'),
+
+  'text-field-large-height': rem('45px'),
+  'text-field-large-padding-x': spacing('s'),
+  'text-field-large-padding-y': rem('12px'),
+  'text-field-large-font-size': font.size('4'),
+
+  'text-field-background': color('neutral-lightest'),
+  'text-field-background--hover': color('neutral-lightest'),
+  'text-field-background--focus': color('neutral-lightest'),
+  'text-field-background--disabled': color('neutral-light'),
+
+  'text-field-border-color': color('neutral-darker'),
+  'text-field-border-color--hover': color('accent'),
+  'text-field-border-color--focus': color('accent'),
+  'text-field-border-color--disabled': color('neutral-darker'),
+
+  // text-field dark
+  'text-field-dark-color': color('neutral-lighter'),
+
+  'text-field-dark-background': color('neutral-darker'),
+  'text-field-dark-border-color': color('neutral-lighter'),
+  'text-field-dark-border-color--hover': color('accent'),
+  'text-field-dark-border-color--focus': color('accent'),
+  'text-field-dark-border-color--disabled': color('neutral-lighter'),
+
+  'text-field-success-border-color': color('accent'),
+  'text-field-danger-border-color': color('danger'),
+
+  'text-field-dark-outline': color('neutral', 0.4),
 }
 
 export default alice

src/theming/themes/loadsmart.theme.ts

@@ -344,4 +344,50 @@ import {
   'tooltip-shadow': shadow('droplist'),
+
+  // text-field
+  'text-field-border-radius': border.radius('s'),
+  'text-field-color': color('neutral-darker'),
+  'text-field-font-size': font.size('4'),
+  'text-field-font-weight': font.weight('medium'),
+  'text-field-font-height': font.height('3'),
+  'text-field-height': rem('36px'),
+  'text-field-padding-x': spacing('s'),
+  'text-field-padding-y': spacing('s'),
+
+  'text-field-outline': shadow('glow-primary'),
+
+  'text-field-small-height': rem('24px'),
+  'text-field-small-padding-x': spacing('s'),
+  'text-field-small-padding-y': spacing('xs'),
+  'text-field-small-font-size': font.size('5'),
+
+  'text-field-large-height': rem('45px'),
+  'text-field-large-padding-x': spacing('s'),
+  'text-field-large-padding-y': rem('12px'),
+  'text-field-large-font-size': font.size('4'),
+
+  'text-field-background': color('neutral-lightest'),
+  'text-field-background--hover': color('neutral-lightest'),
+  'text-field-background--focus': color('neutral-lightest'),
+  'text-field-background--disabled': color('neutral-light'),
+
+  'text-field-border-color': color('neutral-darker'),
+  'text-field-border-color--hover': color('accent'),
+  'text-field-border-color--focus': color('accent'),
+  'text-field-border-color--disabled': color('neutral-darker'),
+
+  // text-field dark
+  'text-field-dark-color': color('neutral-lighter'),
+
+  'text-field-dark-background': color('neutral-darker'),
+  'text-field-dark-border-color': color('neutral-lighter'),
+  'text-field-dark-border-color--hover': color('accent'),
+  'text-field-dark-border-color--focus': color('accent'),
+  'text-field-dark-border-color--disabled': color('neutral-lighter'),
+
+  'text-field-success-border-color': color('accent'),
+  'text-field-danger-border-color': color('danger'),
+
+  'text-field-dark-outline': color('neutral', 0.4),
 }
 
 export default loadsmart

src/tools/conditional.test.ts

@@ -24,2 +24,5 @@ import conditional, { prop } from './conditional'
       expect(prop({ c: 3 })(props)).toBe(true)
+
+      expect(prop({ a: (value: number) => value === 1 })(props)).toBe(true)
+      expect(prop({ b: (value: number) => value !== 1 })(props)).toBe(true)
     })
@@ -130,3 +133,3 @@
           'value-c': prop([{ a: 1 }, { c: 'any value' }]),
-          'value-d': prop({ a: 1 }) && props.b === 2,
+          'value-d': prop({ a: 1, b: (value: number) => value === 2 }),
         })(props)
@@ -133,0 +136,0 @@ ).toBe('value-b value-c value-d')

src/tools/conditional.ts

@@ -40,2 +40,4 @@ /* eslint-disable */
           temp = temp && toArray(condition[key]).includes(value)
+        } else if (isFunction(condition[key])) {
+          temp = temp && Boolean(condition[key](value))
         } else {
@@ -42,0 +44,0 @@ temp = temp && condition[key] === value

No alert changes

Improved metrics

Total package byte prevSize

576887

7.22%

Number of package files

116

7.41%

Lines of code

8808

7.8%

No dependency changes