@trackunit/react-components 0.1.3 → 0.1.7

package/index.css

@@ -17,9 +17,8 @@
     cursor-pointer
     flex-none
     py-1.5
-    px-2.5
+    component-button-padding
     component-button-height
-    component-button-width
     focus:ring
     focus:ring-offset-1
     focus:outline-none

package/index.js

@@ -3631,9 +3631,11 @@ const Search = ({
   name,
   onClear,
   dataTestId,
-  autoComplete = "on"
+  autoComplete = "on",
+  ref
 }) => {
   return jsx(StyledTextInput, {
+    ref: ref,
     dataTestId: dataTestId,
     name: name,
     className: className,
@@ -3682,19 +3684,19 @@ const StyledTextInput = twx(TextInput)`
  */
 const Spacer = ({
   minHeight,
-  border,
+  border = false,
   dataTestId
 }) => {
   return jsx(Space, {
     "data-testid": dataTestId,
-    minHeight: minHeight,
-    border: border
+    "$minHeight": minHeight,
+    "$border": border
   });
 };
 const GetSpacerHeight = () => ({
-  minHeight
+  $minHeight
 }) => {
-  switch (minHeight) {
+  switch ($minHeight) {
     case "normal":
       return tws`tu-spacer--normal`;
     case "large":
@@ -3704,7 +3706,7 @@ const GetSpacerHeight = () => ({
   }
 };
 const Space = tw.div`
-  ${p => `${p.border ? `tu-spacer--border` : null}`}
+  ${p => `${p.$border ? `tu-spacer--border` : null}`}
   ${GetSpacerHeight()}
 `;
 
@@ -4508,9 +4510,12 @@ const CreatableSelect = props => {
  * @returns {JSX.Element} Select component
  */
 const Select = props => {
+  const {
+      className
+    } = props,
+    propsNoClassName = __rest(props, ["className"]);
   const {
     id,
-    className,
     dataTestId = "select",
     prefix,
     async,
@@ -4580,10 +4585,10 @@ const Select = props => {
       ref: refPrefix
     }, {
       children: prefix
-    })), async ? jsx(ReactAsyncSelect, Object.assign({}, props, selectProps, async, {
+    })), async ? jsx(ReactAsyncSelect, Object.assign({}, propsNoClassName, selectProps, async, {
       onMenuOpen: openMenuHandler,
       onMenuClose: closeMenuHandler
-    })) : jsx(ReactSelect, Object.assign({}, props, selectProps, {
+    })) : jsx(ReactSelect, Object.assign({}, propsNoClassName, selectProps, {
       options: filterOption ? orderedOptions : options,
       hideSelectedOptions: false,
       isMulti: isMulti,
@@ -5411,10 +5416,13 @@ const Layout$2 = tw.span`
  * @returns {JSX.Element} TitleNavContentLayout component
  */
 const TitleNavContentLayout = ({
-  children
-}) => jsx(Layout$1, {
+  children,
+  className
+}) => jsx(Layout$1, Object.assign({
+  className: className
+}, {
   children: children
-});
+}));
 const Layout$1 = tw.div`
   tu-layout-TitleNavContentLayout
 `;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/react-components",
-  "version": "0.1.3",
+  "version": "0.1.7",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "dependencies": {

package/src/components/Search/Search.d.ts

@@ -50,6 +50,7 @@ export interface SearchProps extends CommonProps {
      * Event that search box is cleared.
      */
     onClear?: () => void;
+    ref?: React.Ref<HTMLInputElement | undefined>;
 }
 /**
  * The Search component is used to render a search input field.
@@ -57,4 +58,4 @@ export interface SearchProps extends CommonProps {
  * @param {SearchProps} props - The props for the Search component
  * @returns {JSX.Element} Search component
  */
-export declare const Search: ({ className, placeholder, value, widenInputOnFocus, showBorderWhenNotInFocus, disabled, onKeyUp, onChange, onFocus, onBlur, name, onClear, dataTestId, autoComplete, }: SearchProps) => JSX.Element;
+export declare const Search: ({ className, placeholder, value, widenInputOnFocus, showBorderWhenNotInFocus, disabled, onKeyUp, onChange, onFocus, onBlur, name, onClear, dataTestId, autoComplete, ref, }: SearchProps) => JSX.Element;

package/src/layout/responsive/TitleNavContentLayout.d.ts

@@ -1,5 +1,6 @@
 /// <reference types="react" />
-interface TitleNavContentLayoutProps {
+import { CommonProps } from "../../common";
+interface TitleNavContentLayoutProps extends CommonProps {
     children: React.ReactNode;
 }
 /**
@@ -8,5 +9,5 @@ interface TitleNavContentLayoutProps {
  * @param {TitleNavContentLayoutProps} props - The props for the TitleNavContentLayout component
  * @returns {JSX.Element} TitleNavContentLayout component
  */
-export declare const TitleNavContentLayout: ({ children }: TitleNavContentLayoutProps) => JSX.Element;
+export declare const TitleNavContentLayout: ({ children, className }: TitleNavContentLayoutProps) => JSX.Element;
 export {};