@aleodoni-common/tailwind-components - npm Package Compare versions

Comparing version 1.0.120 to 1.0.121

build/components/select.d.ts

 import React from 'react';
-export declare const MyComponent: React.FC;
+import { ISelect } from '../helpers/select';
+export declare const Select: React.FC<ISelect>;

build/index.js

@@ -6,3 +6,2 @@ function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
 var OutlineIcons = require('@heroicons/react/outline');
-var Select = _interopDefault(require('react-select'));
 var reactHookForm = require('react-hook-form');
@@ -200,29 +199,50 @@ var NumberFormat = _interopDefault(require('react-number-format'));
 
-var options = [{
-  value: 'chocolate',
-  label: 'Chocolate'
-}, {
-  value: 'strawberry',
-  label: 'Strawberry'
-}, {
-  value: 'vanilla',
-  label: 'Vanilla'
-}];
-var themeConfig = {
-  borderRadius: 7,
-  colors: {
-    primary: defaultTheme.input.ringColor
-  }
+var selectDefaults = {
+  ringcolor: defaultTheme.input.ringColor
 };
-var MyComponent = function MyComponent() {
-  return React.createElement(Select, {
-    options: options,
-    theme: function theme(_theme) {
-      return _extends({}, _theme, themeConfig, {
-        colors: _extends({}, _theme.colors, themeConfig.colors)
-      });
-    }
-  });
+var getPaddingHorizontal$1 = function getPaddingHorizontal() {
+  return 'px-3';
 };
+var getSelectClassName = function getSelectClassName(paddingHorizontal, ringColor, hasError) {
+  return "\n    w-full\n    " + paddingHorizontal + "\n    py-2\n    border\n    rounded-md\n    border-" + (hasError ? defaultTheme.errorColor : defaultTheme.input.borderColor) + "\n    placeholder-" + defaultTheme.input.placeholderColor + "\n    text-" + defaultTheme.input.textColor + "\n    focus:outline-none\n    focus:ring-2\n    focus:ring-" + ringColor + "\n  ";
+};
+var getDivSelectClassName = function getDivSelectClassName() {
+  return "\n    flex\n    flex-col\n    justify-center\n    text-" + defaultTheme.input.borderColor + "\n    focus-within:text-" + defaultTheme.focusWithin + "\n  ";
+};
+var getErrorTextClassName$1 = function getErrorTextClassName() {
+  return "\n    text-xs\n    text-" + defaultTheme.errorColor + "\n  ";
+};
+var getMainDivClassName$1 = function getMainDivClassName() {
+  return "\n    flex\n    flex-col\n  ";
+};
 
+var Select = React.forwardRef(function (_ref, ref) {
+  var props = _extends({}, _ref);
+
+  var _props$aleodoni_ringc = props.aleodoni_ringcolor,
+      aleodoni_ringcolor = _props$aleodoni_ringc === void 0 ? selectDefaults.ringcolor : _props$aleodoni_ringc,
+      _props$aleodoni_error = props.aleodoni_error,
+      aleodoni_error = _props$aleodoni_error === void 0 ? 'false' : _props$aleodoni_error,
+      aleodoni_errortext = props.aleodoni_errortext;
+  var hasError = !(aleodoni_error === 'false');
+  var pH = getPaddingHorizontal$1();
+  var selectClassName = getSelectClassName(pH, aleodoni_ringcolor, hasError);
+  var divClassName = getDivSelectClassName();
+  var errorTextClassName = getErrorTextClassName$1();
+  var mainDivClassName = getMainDivClassName$1();
+  return React.createElement("div", {
+    className: mainDivClassName
+  }, React.createElement("div", {
+    className: divClassName
+  }, React.createElement("select", Object.assign({
+    ref: ref,
+    className: selectClassName
+  }, props), React.createElement("option", {
+    value: "0"
+  }, "Please select..."))), hasError && React.createElement("span", {
+    className: errorTextClassName
+  }, aleodoni_errortext));
+});
+Select.displayName = 'Select';
+
 var LoginForm = function LoginForm(props) {
@@ -352,5 +372,5 @@ var _props$usernameplaceh = props.usernameplaceholder,
 exports.MaskInput = MaskInput;
-exports.MyComponent = MyComponent;
 exports.Screen = Screen;
+exports.Select = Select;
 exports.classNames = classNames;
 //# sourceMappingURL=index.js.map

build/index.modern.js

 import React from 'react';
 import * as SolidIcons from '@heroicons/react/solid';
 import * as OutlineIcons from '@heroicons/react/outline';
-import Select from 'react-select';
 import { useForm, Controller } from 'react-hook-form';
@@ -197,29 +196,50 @@ import NumberFormat from 'react-number-format';
 
-var options = [{
-  value: 'chocolate',
-  label: 'Chocolate'
-}, {
-  value: 'strawberry',
-  label: 'Strawberry'
-}, {
-  value: 'vanilla',
-  label: 'Vanilla'
-}];
-var themeConfig = {
-  borderRadius: 7,
-  colors: {
-    primary: defaultTheme.input.ringColor
-  }
+var selectDefaults = {
+  ringcolor: defaultTheme.input.ringColor
 };
-var MyComponent = function MyComponent() {
-  return React.createElement(Select, {
-    options: options,
-    theme: function theme(_theme) {
-      return _extends({}, _theme, themeConfig, {
-        colors: _extends({}, _theme.colors, themeConfig.colors)
-      });
-    }
-  });
+var getPaddingHorizontal$1 = function getPaddingHorizontal() {
+  return 'px-3';
 };
+var getSelectClassName = function getSelectClassName(paddingHorizontal, ringColor, hasError) {
+  return "\n    w-full\n    " + paddingHorizontal + "\n    py-2\n    border\n    rounded-md\n    border-" + (hasError ? defaultTheme.errorColor : defaultTheme.input.borderColor) + "\n    placeholder-" + defaultTheme.input.placeholderColor + "\n    text-" + defaultTheme.input.textColor + "\n    focus:outline-none\n    focus:ring-2\n    focus:ring-" + ringColor + "\n  ";
+};
+var getDivSelectClassName = function getDivSelectClassName() {
+  return "\n    flex\n    flex-col\n    justify-center\n    text-" + defaultTheme.input.borderColor + "\n    focus-within:text-" + defaultTheme.focusWithin + "\n  ";
+};
+var getErrorTextClassName$1 = function getErrorTextClassName() {
+  return "\n    text-xs\n    text-" + defaultTheme.errorColor + "\n  ";
+};
+var getMainDivClassName$1 = function getMainDivClassName() {
+  return "\n    flex\n    flex-col\n  ";
+};
 
+var Select = React.forwardRef(function (_ref, ref) {
+  var props = _extends({}, _ref);
+
+  var _props$aleodoni_ringc = props.aleodoni_ringcolor,
+      aleodoni_ringcolor = _props$aleodoni_ringc === void 0 ? selectDefaults.ringcolor : _props$aleodoni_ringc,
+      _props$aleodoni_error = props.aleodoni_error,
+      aleodoni_error = _props$aleodoni_error === void 0 ? 'false' : _props$aleodoni_error,
+      aleodoni_errortext = props.aleodoni_errortext;
+  var hasError = !(aleodoni_error === 'false');
+  var pH = getPaddingHorizontal$1();
+  var selectClassName = getSelectClassName(pH, aleodoni_ringcolor, hasError);
+  var divClassName = getDivSelectClassName();
+  var errorTextClassName = getErrorTextClassName$1();
+  var mainDivClassName = getMainDivClassName$1();
+  return React.createElement("div", {
+    className: mainDivClassName
+  }, React.createElement("div", {
+    className: divClassName
+  }, React.createElement("select", Object.assign({
+    ref: ref,
+    className: selectClassName
+  }, props), React.createElement("option", {
+    value: "0"
+  }, "Please select..."))), hasError && React.createElement("span", {
+    className: errorTextClassName
+  }, aleodoni_errortext));
+});
+Select.displayName = 'Select';
+
 var LoginForm = function LoginForm(props) {
@@ -343,3 +363,3 @@ var _props$usernameplaceh = props.usernameplaceholder,
 
-export { Button, Container, FormRow, Input, LoginForm, MaskInput, MyComponent, Screen, classNames };
+export { Button, Container, FormRow, Input, LoginForm, MaskInput, Screen, Select, classNames };
 //# sourceMappingURL=index.modern.js.map

package.json

 {
   "name": "@aleodoni-common/tailwind-components",
-  "version": "1.0.120",
+  "version": "1.0.121",
   "main": "./build/index.js",
@@ -5,0 +5,0 @@ "module": "build/index.modern.js",

No alert changes

Improved metrics

Total package byte prevSize

106434

increased by10.72%

Number of package files

22

increased by4.76%

Lines of code

1499

increased by3.67%

No dependency changes