@canlooks/can-ui 0.0.10 → 0.0.12

package/dist/cjs/components/app/app.js

@@ -42,9 +42,12 @@ exports.App = (0, react_1.forwardRef)(({ component: Component = 'div', theme, ch
                             app_style_1.style,
                             (0, react_2.css) `
                                 font-size: ${themeValue.fontSize}px;
-                                font-family: ${themeValue.fontFamily};
                                 color: ${themeValue.text.primary};
                                 background-color: ${themeValue.background.body};
+
+                                * {
+                                    font-family: ${themeValue.fontFamily};
+                                }
                             `,
                             fullSize && (0, react_2.css) `
                                 width: 100%;

package/dist/cjs/components/dateTimePicker/dateTimePicker.style.js

@@ -23,13 +23,13 @@ exports.classes = (0, utils_1.defineClasses)('date-time-picker', [
     'calendarDays',
     'dateItem'
 ]);
-exports.style = (0, utils_1.defineCss)(({ text, fontFamily }) => (0, react_1.css) `
+exports.style = (0, utils_1.defineCss)(({ text }) => (0, react_1.css) `
     .${exports.classes.container} {
         display: flex;
         align-items: center;
 
         .${exports.classes.input} {
-            ${(0, input_style_1.commonNativeInputStyle)(fontFamily)}
+            ${input_style_1.commonNativeInputStyle}
         }
     
         .${exports.classes.dateTimeIcon} {

package/dist/cjs/components/input/input.style.d.ts

@@ -4,5 +4,5 @@ export declare const classes: {
 } & {
     root: string;
 };
-export declare const commonNativeInputStyle: (fontFamily: string) => import("@emotion/react").SerializedStyles;
-export declare const style: () => import("@emotion/react").SerializedStyles;
+export declare const commonNativeInputStyle: import("@emotion/react").SerializedStyles;
+export declare const style: import("@emotion/react").SerializedStyles;

package/dist/cjs/components/input/input.style.js

@@ -7,7 +7,7 @@ exports.classes = (0, utils_1.defineClasses)('input', [
     'input',
     'adaptable'
 ]);
-const commonNativeInputStyle = (fontFamily) => (0, react_1.css) `
+exports.commonNativeInputStyle = (0, react_1.css) `
     width: 100%;
     height: 22px;
     flex: 1;
@@ -16,24 +16,22 @@ const commonNativeInputStyle = (fontFamily) => (0, react_1.css) `
     padding: 0;
     background-color: transparent;
     font-size: 1em;
-    font-family: ${fontFamily};
 `;
-exports.commonNativeInputStyle = commonNativeInputStyle;
-exports.style = (0, utils_1.defineCss)(({ fontFamily }) => (0, react_1.css) `
+exports.style = (0, react_1.css) `
     position: relative;
 
     .${exports.classes.input} {
-        ${(0, exports.commonNativeInputStyle)(fontFamily)}
-
+        ${exports.commonNativeInputStyle}
+    
         &::-webkit-search-cancel-button {
             display: none;
         }
-
+    
         &::-ms-clear,
         &::-webkit-search-cancel-button {
             display: none;
         }
-
+    
         &::-webkit-inner-spin-button,
         &::-webkit-outer-spin-button {
             width: 12px;
@@ -52,4 +50,4 @@ exports.style = (0, utils_1.defineCss)(({ fontFamily }) => (0, react_1.css) `
         opacity: 0;
         pointer-events: none;
     }
-`);
+`;

package/dist/cjs/components/textarea/textarea.style.js

@@ -7,7 +7,7 @@ const inputBase_style_1 = require("../inputBase/inputBase.style");
 exports.classes = (0, utils_1.defineClasses)('textarea', [
     'textarea'
 ]);
-exports.style = (0, utils_1.defineCss)(({ spacing, fontFamily }) => (0, react_1.css) `
+exports.style = (0, utils_1.defineCss)(({ spacing }) => (0, react_1.css) `
     height: auto;
 
     &[data-size] {
@@ -22,7 +22,6 @@ exports.style = (0, utils_1.defineCss)(({ spacing, fontFamily }) => (0, react_1.
         font-size: 1em;
         padding: ${spacing[3]}px;
         display: block;
-        font-family: ${fontFamily};
     }
 
     &[data-full-width=true] {

package/dist/cjs/components/transportStyle/transportStyle.d.ts

@@ -16,15 +16,18 @@ export interface TransportStyleProps extends DIVProps {
     minHeight?: CSSProperties['minHeight'];
     maxHeight?: CSSProperties['maxHeight'];
     lineHeight?: CSSProperties['lineHeight'];
-    padding?: CSSProperties['padding'];
     paddingTop?: CSSProperties['paddingTop'];
     paddingRight?: CSSProperties['paddingRight'];
     paddingBottom?: CSSProperties['paddingBottom'];
     paddingLeft?: CSSProperties['paddingLeft'];
-    margin?: CSSProperties['margin'];
+    padding?: CSSProperties['padding'];
     marginTop?: CSSProperties['marginTop'];
     marginRight?: CSSProperties['marginRight'];
     marginBottom?: CSSProperties['marginBottom'];
     marginLeft?: CSSProperties['marginLeft'];
+    margin?: CSSProperties['margin'];
+    overflowX?: CSSProperties['overflowX'];
+    overflowY?: CSSProperties['overflowY'];
+    overflow?: CSSProperties['overflow'];
 }
 export declare const TransportStyle: import("react").ForwardRefExoticComponent<Omit<TransportStyleProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/cjs/components/transportStyle/transportStyle.js

@@ -3,12 +3,13 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.TransportStyle = void 0;
 const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
 const react_1 = require("react");
-exports.TransportStyle = (0, react_1.forwardRef)(({ alignItems, justifyContent, alignSelf, justifySelf, flex, width, minWidth, maxWidth, height, minHeight, maxHeight, lineHeight, padding, paddingTop, paddingRight, paddingBottom, paddingLeft, margin, marginTop, marginRight, marginBottom, marginLeft, ...props }, ref) => {
+exports.TransportStyle = (0, react_1.forwardRef)(({ alignItems, justifyContent, alignSelf, justifySelf, flex, width, minWidth, maxWidth, height, minHeight, maxHeight, lineHeight, paddingTop, paddingRight, paddingBottom, paddingLeft, padding, marginTop, marginRight, marginBottom, marginLeft, margin, overflowX, overflowY, overflow, ...props }, ref) => {
     return ((0, jsx_runtime_1.jsx)("div", { ...props, ref: ref, style: {
             alignItems, justifyContent, alignSelf, justifySelf, flex,
             width, minWidth, maxWidth, height, minHeight, maxHeight, lineHeight,
             paddingTop, paddingRight, paddingBottom, paddingLeft, padding,
             marginTop, marginRight, marginBottom, marginLeft, margin,
+            overflowX, overflowY, overflow,
             ...props.style
         } }));
 });

package/dist/esm/components/app/app.js

@@ -38,9 +38,12 @@ export const App = forwardRef(({ component: Component = 'div', theme, children,
                             style,
                             css `
                                 font-size: ${themeValue.fontSize}px;
-                                font-family: ${themeValue.fontFamily};
                                 color: ${themeValue.text.primary};
                                 background-color: ${themeValue.background.body};
+
+                                * {
+                                    font-family: ${themeValue.fontFamily};
+                                }
                             `,
                             fullSize && css `
                                 width: 100%;

package/dist/esm/components/dateTimePicker/dateTimePicker.style.js

@@ -20,13 +20,13 @@ export const classes = defineClasses('date-time-picker', [
     'calendarDays',
     'dateItem'
 ]);
-export const style = defineCss(({ text, fontFamily }) => css `
+export const style = defineCss(({ text }) => css `
     .${classes.container} {
         display: flex;
         align-items: center;
 
         .${classes.input} {
-            ${commonNativeInputStyle(fontFamily)}
+            ${commonNativeInputStyle}
         }
     
         .${classes.dateTimeIcon} {

package/dist/esm/components/input/input.style.d.ts

@@ -4,5 +4,5 @@ export declare const classes: {
 } & {
     root: string;
 };
-export declare const commonNativeInputStyle: (fontFamily: string) => import("@emotion/react").SerializedStyles;
-export declare const style: () => import("@emotion/react").SerializedStyles;
+export declare const commonNativeInputStyle: import("@emotion/react").SerializedStyles;
+export declare const style: import("@emotion/react").SerializedStyles;

package/dist/esm/components/input/input.style.js

@@ -1,10 +1,10 @@
 import { css } from '@emotion/react';
-import { defineClasses, defineCss } from '../../utils';
+import { defineClasses } from '../../utils';
 export const classes = defineClasses('input', [
     'input',
     'adaptable'
 ]);
-export const commonNativeInputStyle = (fontFamily) => css `
+export const commonNativeInputStyle = css `
     width: 100%;
     height: 22px;
     flex: 1;
@@ -13,23 +13,22 @@ export const commonNativeInputStyle = (fontFamily) => css `
     padding: 0;
     background-color: transparent;
     font-size: 1em;
-    font-family: ${fontFamily};
 `;
-export const style = defineCss(({ fontFamily }) => css `
+export const style = css `
     position: relative;
 
     .${classes.input} {
-        ${commonNativeInputStyle(fontFamily)}
-
+        ${commonNativeInputStyle}
+    
         &::-webkit-search-cancel-button {
             display: none;
         }
-
+    
         &::-ms-clear,
         &::-webkit-search-cancel-button {
             display: none;
         }
-
+    
         &::-webkit-inner-spin-button,
         &::-webkit-outer-spin-button {
             width: 12px;
@@ -48,4 +47,4 @@ export const style = defineCss(({ fontFamily }) => css `
         opacity: 0;
         pointer-events: none;
     }
-`);
+`;

package/dist/esm/components/textarea/textarea.style.js

@@ -4,7 +4,7 @@ import { classes as inputBaseClasses } from '../inputBase/inputBase.style';
 export const classes = defineClasses('textarea', [
     'textarea'
 ]);
-export const style = defineCss(({ spacing, fontFamily }) => css `
+export const style = defineCss(({ spacing }) => css `
     height: auto;
 
     &[data-size] {
@@ -19,7 +19,6 @@ export const style = defineCss(({ spacing, fontFamily }) => css `
         font-size: 1em;
         padding: ${spacing[3]}px;
         display: block;
-        font-family: ${fontFamily};
     }
 
     &[data-full-width=true] {

package/dist/esm/components/transportStyle/transportStyle.d.ts

@@ -16,15 +16,18 @@ export interface TransportStyleProps extends DIVProps {
     minHeight?: CSSProperties['minHeight'];
     maxHeight?: CSSProperties['maxHeight'];
     lineHeight?: CSSProperties['lineHeight'];
-    padding?: CSSProperties['padding'];
     paddingTop?: CSSProperties['paddingTop'];
     paddingRight?: CSSProperties['paddingRight'];
     paddingBottom?: CSSProperties['paddingBottom'];
     paddingLeft?: CSSProperties['paddingLeft'];
-    margin?: CSSProperties['margin'];
+    padding?: CSSProperties['padding'];
     marginTop?: CSSProperties['marginTop'];
     marginRight?: CSSProperties['marginRight'];
     marginBottom?: CSSProperties['marginBottom'];
     marginLeft?: CSSProperties['marginLeft'];
+    margin?: CSSProperties['margin'];
+    overflowX?: CSSProperties['overflowX'];
+    overflowY?: CSSProperties['overflowY'];
+    overflow?: CSSProperties['overflow'];
 }
 export declare const TransportStyle: import("react").ForwardRefExoticComponent<Omit<TransportStyleProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/esm/components/transportStyle/transportStyle.js

@@ -1,11 +1,12 @@
 import { jsx as _jsx } from "@emotion/react/jsx-runtime";
 import { forwardRef } from 'react';
-export const TransportStyle = forwardRef(({ alignItems, justifyContent, alignSelf, justifySelf, flex, width, minWidth, maxWidth, height, minHeight, maxHeight, lineHeight, padding, paddingTop, paddingRight, paddingBottom, paddingLeft, margin, marginTop, marginRight, marginBottom, marginLeft, ...props }, ref) => {
+export const TransportStyle = forwardRef(({ alignItems, justifyContent, alignSelf, justifySelf, flex, width, minWidth, maxWidth, height, minHeight, maxHeight, lineHeight, paddingTop, paddingRight, paddingBottom, paddingLeft, padding, marginTop, marginRight, marginBottom, marginLeft, margin, overflowX, overflowY, overflow, ...props }, ref) => {
     return (_jsx("div", { ...props, ref: ref, style: {
             alignItems, justifyContent, alignSelf, justifySelf, flex,
             width, minWidth, maxWidth, height, minHeight, maxHeight, lineHeight,
             paddingTop, paddingRight, paddingBottom, paddingLeft, padding,
             marginTop, marginRight, marginBottom, marginLeft, margin,
+            overflowX, overflowY, overflow,
             ...props.style
         } }));
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@canlooks/can-ui",
-  "version": "0.0.10",
+  "version": "0.0.12",
   "author": "C.CanLiang <canlooks@gmail.com>",
   "description": "My ui framework",
   "license": "MIT",