@tenancy.nz/ui 1.0.4 → 1.0.6

package/dist/esm/components/ThemeProvider.js

@@ -1,7 +1,6 @@
 "use strict";
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
-import { jsx, jsxs } from 'react/jsx-runtime';
-import 'react';
+import React from 'react';
 import PropTypes from 'prop-types';
 import { ThemeProvider as ThemeProvider$2 } from '@emotion/react';
 import { ThemeProvider as ThemeProvider$1 } from 'styled-components';
@@ -20,19 +19,13 @@ function ThemeProvider(_ref) {
       cssVarPrefix: "tn"
     }
   }));
-  return /* @__PURE__ */jsx(StyledEngineProvider, {
-    children: /* @__PURE__ */jsx(ThemeProvider$1, {
-      theme: mergedTheme,
-      children: /* @__PURE__ */jsx(ThemeProvider$2, {
-        theme: mergedTheme,
-        children: /* @__PURE__ */jsxs(ThemeProvider$3, _objectSpread2(_objectSpread2({
-          theme: mergedTheme
-        }, rest), {}, {
-          children: [/* @__PURE__ */jsx(CssBaseline, {}), children]
-        }))
-      })
-    })
-  });
+  return /* @__PURE__ */React.createElement(StyledEngineProvider, null, /* @__PURE__ */React.createElement(ThemeProvider$1, {
+    theme: mergedTheme
+  }, /* @__PURE__ */React.createElement(ThemeProvider$2, {
+    theme: mergedTheme
+  }, /* @__PURE__ */React.createElement(ThemeProvider$3, _objectSpread2({
+    theme: mergedTheme
+  }, rest), /* @__PURE__ */React.createElement(CssBaseline, null), children))));
 }
 ThemeProvider.propTypes = {
   theme: PropTypes.shape({

package/dist/esm/components/TimeInput.js

@@ -1,7 +1,6 @@
 "use strict";
 import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, objectSpread2 as _objectSpread2, defineProperty as _defineProperty } from '../_virtual/_rollupPluginBabelHelpers.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { useRef, useState, useEffect } from 'react';
+import React, { useRef, useState, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import FormControl from './FormControl.js';
 import Select from './Select.js';
@@ -78,7 +77,7 @@ function TimeInput(_ref) {
     setValues(newValues);
     onChange(evt);
   };
-  return /* @__PURE__ */jsxs(FormControl, {
+  return /* @__PURE__ */React.createElement(FormControl, {
     fullWidth: fullWidth,
     name: name,
     label: label,
@@ -88,75 +87,68 @@ function TimeInput(_ref) {
     required: required,
     showError: showError,
     errorMessage: errorMessage,
-    edges: "normal",
-    children: [/* @__PURE__ */jsx("input", {
-      defaultValue: rest.defaultValue || value,
-      name: name,
-      ref: inputRef,
-      style: {
-        height: 0,
-        width: 0,
-        appearance: "none",
-        border: "none",
-        outline: "none",
-        margin: 0,
-        padding: 0
-      }
-    }), /* @__PURE__ */jsxs(StyledContainer, {
-      size: size,
-      children: [/* @__PURE__ */jsx(StyledSelect, {
-        required: required,
-        size: size,
-        value: inputRef.current ? inputRef.current.value : value,
-        children: /* @__PURE__ */jsx(Select, {
-          disabled: disabled,
-          name: "".concat(name, "_hours"),
-          placeholder: "HH",
-          required: required,
-          native: true,
-          options: hourOptions,
-          value: values.hour,
-          onChange: function onChange(e) {
-            handleChange(e, "hour");
-          }
-        })
-      }), /* @__PURE__ */jsx(StyledSpacer, {
-        children: ":"
-      }), /* @__PURE__ */jsx(StyledSelect, {
-        required: required,
-        size: size,
-        value: inputRef.current ? inputRef.current.value : value,
-        children: /* @__PURE__ */jsx(Select, {
-          disabled: disabled,
-          name: "".concat(name, "_minutes"),
-          placeholder: "MM",
-          required: required,
-          native: true,
-          options: minuteOptions,
-          value: values.minute,
-          onChange: function onChange(e) {
-            handleChange(e, "minute");
-          }
-        })
-      }), /* @__PURE__ */jsx(StyledSpacer, {}), /* @__PURE__ */jsx(StyledSelect, {
-        required: required,
-        size: size,
-        value: inputRef.current ? inputRef.current.value : value,
-        children: /* @__PURE__ */jsx(Select, {
-          disabled: disabled,
-          name: "".concat(name, "_meridian"),
-          placeholder: "AM",
-          required: required,
-          native: true,
-          options: meridianOptions,
-          value: values.meridian,
-          onChange: function onChange(e) {
-            handleChange(e, "meridian");
-          }
-        })
-      })]
-    })]
-  });
+    edges: "normal"
+  }, /* @__PURE__ */React.createElement("input", {
+    defaultValue: rest.defaultValue || value,
+    name: name,
+    ref: inputRef,
+    style: {
+      height: 0,
+      width: 0,
+      appearance: "none",
+      border: "none",
+      outline: "none",
+      margin: 0,
+      padding: 0
+    }
+  }), /* @__PURE__ */React.createElement(StyledContainer, {
+    size: size
+  }, /* @__PURE__ */React.createElement(StyledSelect, {
+    required: required,
+    size: size,
+    value: inputRef.current ? inputRef.current.value : value
+  }, /* @__PURE__ */React.createElement(Select, {
+    disabled: disabled,
+    name: "".concat(name, "_hours"),
+    placeholder: "HH",
+    required: required,
+    native: true,
+    options: hourOptions,
+    value: values.hour,
+    onChange: function onChange(e) {
+      handleChange(e, "hour");
+    }
+  })), /* @__PURE__ */React.createElement(StyledSpacer, null, ":"), /* @__PURE__ */React.createElement(StyledSelect, {
+    required: required,
+    size: size,
+    value: inputRef.current ? inputRef.current.value : value
+  }, /* @__PURE__ */React.createElement(Select, {
+    disabled: disabled,
+    name: "".concat(name, "_minutes"),
+    placeholder: "MM",
+    required: required,
+    native: true,
+    options: minuteOptions,
+    value: values.minute,
+    onChange: function onChange(e) {
+      handleChange(e, "minute");
+    }
+  })), /* @__PURE__ */React.createElement(StyledSpacer, null), /* @__PURE__ */React.createElement(StyledSelect, {
+    required: required,
+    size: size,
+    value: inputRef.current ? inputRef.current.value : value
+  }, /* @__PURE__ */React.createElement(Select, {
+    disabled: disabled,
+    name: "".concat(name, "_meridian"),
+    placeholder: "AM",
+    required: required,
+    native: true,
+    options: meridianOptions,
+    value: values.meridian,
+    onChange: function onChange(e) {
+      handleChange(e, "meridian");
+    }
+  }))));
 }
 TimeInput.propTypes = {
   /**

package/dist/esm/components/Tooltip.js

@@ -1,6 +1,5 @@
 "use strict";
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
-import { jsx } from 'react/jsx-runtime';
 import Box from './Box.js';
 import StyledTooltip from './Tooltip.styled.js';
 
@@ -40,17 +39,14 @@ function Tooltip(_ref) {
     leaveTouchDelay: leaveTouchDelay,
     placement: placement
   }, others);
-  return /* @__PURE__ */jsx(StyledTooltip, _objectSpread2(_objectSpread2({
+  return /* @__PURE__ */React.createElement(StyledTooltip, _objectSpread2({
     classes: {
       popper: className
     }
-  }, rest), {}, {
-    children: /* @__PURE__ */jsx(Box, {
-      display: "inline-flex",
-      sx: boxProps,
-      children: children
-    })
-  }));
+  }, rest), /* @__PURE__ */React.createElement(Box, {
+    display: "inline-flex",
+    sx: boxProps
+  }, children));
 }
 
 export { Tooltip as default };

package/dist/esm/index.js

@@ -19,7 +19,6 @@ export { default as CollapsedText } from './components/CollapsedText.js';
 export { default as Confirmation } from './components/Confirmation.js';
 export { default as CroppedImageInput } from './components/CroppedImageInput.js';
 export { default as DateInput } from './components/DateInput.js';
-export { default as DatePicker } from './components/DatePicker.js';
 export { default as Divider } from './components/Divider.js';
 export { default as DropZone } from './components/DropZone.js';
 export { default as Embed } from './components/Embed.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tenancy.nz/ui",
-  "version": "1.0.4",
+  "version": "1.0.6",
   "description": "Library of React UI components for tenancy.co.nz apps.",
   "author": "Tenancy.co.nz <monty@tenancy.co.nz>",
   "keywords": [

package/dist/cjs/components/DatePicker.cjs

@@ -1,167 +0,0 @@
-"use strict";
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var _rollupPluginBabelHelpers = require('../_virtual/_rollupPluginBabelHelpers.cjs');
-var jsxRuntime = require('react/jsx-runtime');
-var React = require('react');
-var PropTypes = require('prop-types');
-var InputAdornment = require('@mui/material/InputAdornment');
-var AdapterDayjs = require('@mui/x-date-pickers/AdapterDayjs');
-var EventIcon = require('@mui/icons-material/Event');
-var xDatePickers = require('@mui/x-date-pickers');
-var TextInput = require('./TextInput.cjs');
-var IconButton = require('./IconButton.cjs');
-var DatePicker_styled = require('./DatePicker.styled.cjs');
-
-var _excluded = ["disabled", "edges", "error", "showError", "errorMessage", "fullWidth", "helperText", "icon", "label", "required", "variant", "format", "value", "onChange", "name"];
-function DatePicker(_ref) {
-  var _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    _ref$edges = _ref.edges,
-    edges = _ref$edges === void 0 ? "normal" : _ref$edges,
-    _ref$error = _ref.error,
-    error = _ref$error === void 0 ? false : _ref$error,
-    _ref$showError = _ref.showError,
-    showError = _ref$showError === void 0 ? false : _ref$showError,
-    _ref$errorMessage = _ref.errorMessage,
-    errorMessage = _ref$errorMessage === void 0 ? "" : _ref$errorMessage,
-    _ref$fullWidth = _ref.fullWidth,
-    fullWidth = _ref$fullWidth === void 0 ? false : _ref$fullWidth,
-    _ref$helperText = _ref.helperText,
-    helperText = _ref$helperText === void 0 ? "" : _ref$helperText,
-    _ref$icon = _ref.icon,
-    icon = _ref$icon === void 0 ? void 0 : _ref$icon,
-    _ref$label = _ref.label,
-    label = _ref$label === void 0 ? "" : _ref$label,
-    _ref$required = _ref.required,
-    required = _ref$required === void 0 ? false : _ref$required,
-    _ref$variant = _ref.variant,
-    variant = _ref$variant === void 0 ? "outlined" : _ref$variant,
-    _ref$format = _ref.format,
-    format = _ref$format === void 0 ? "dd/MM/yyyy" : _ref$format,
-    _ref$value = _ref.value,
-    value = _ref$value === void 0 ? void 0 : _ref$value,
-    _ref$onChange = _ref.onChange,
-    onChange = _ref$onChange === void 0 ? null : _ref$onChange,
-    name = _ref.name,
-    others = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-  var rest = _rollupPluginBabelHelpers.objectSpread2({
-    error: error
-  }, others);
-  var _useState = React.useState(false),
-    _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2);
-    _useState2[0];
-    var setOpen = _useState2[1];
-  return /* @__PURE__ */jsxRuntime.jsx(DatePicker_styled.StyledWrapper, {
-    required: required,
-    hasValue: !!value,
-    children: /* @__PURE__ */jsxRuntime.jsx(xDatePickers.LocalizationProvider, {
-      dateAdapter: AdapterDayjs.AdapterDayjs,
-      children: /* @__PURE__ */jsxRuntime.jsx(xDatePickers.DatePicker, _rollupPluginBabelHelpers.objectSpread2({
-        clearable: true,
-        disableCloseOnSelect: false,
-        inputFormat: format,
-        value: value,
-        onChange: onChange,
-        onClose: function onClose() {
-          return setOpen(false);
-        },
-        renderInput: function renderInput(params) {
-          return /* @__PURE__ */jsxRuntime.jsx(TextInput.default, _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, params), {}, {
-            onClick: function onClick() {
-              return setOpen(true);
-            },
-            name: name,
-            fullWidth: fullWidth,
-            label: label,
-            helperText: helperText,
-            disabled: disabled,
-            required: required,
-            showError: showError,
-            message: errorMessage,
-            edges: edges,
-            variant: variant,
-            autoComplete: "off",
-            InputProps: {
-              endAdornment: /* @__PURE__ */jsxRuntime.jsx(InputAdornment, {
-                position: "end",
-                children: /* @__PURE__ */jsxRuntime.jsx(IconButton.default, {
-                  onClick: function onClick() {
-                    return setOpen(true);
-                  },
-                  children: icon || /* @__PURE__ */jsxRuntime.jsx(EventIcon, {})
-                })
-              })
-            }
-          }));
-        }
-      }, rest))
-    })
-  });
-}
-DatePicker.propTypes = {
-  /**
-   * If `true`, the `input` element will be disabled.
-   */
-  disabled: PropTypes.bool,
-  /**
-   * Make button edges rounded or square
-   */
-  edges: PropTypes.oneOf(["normal", "rounded", "sharp"]),
-  /**
-   * If `true`, the label will be displayed in an error state.
-   */
-  error: PropTypes.bool,
-  /**
-   * If `true`, the input will take up the full width of its container.
-   */
-  fullWidth: PropTypes.bool,
-  /**
-   * The helper text content.
-   */
-  helperText: PropTypes.string,
-  /**
-   * Input icon
-   */
-  icon: PropTypes.node,
-  /**
-   * The label content.
-   */
-  label: PropTypes.string,
-  /**
-   * The field name.
-   */
-  name: PropTypes.string.isRequired,
-  /**
-   * If `true`, the label is displayed as required and the `input` element` will be required.
-   */
-  required: PropTypes.bool,
-  /**
-   * The value of the `input` element, required for a controlled component.
-   */
-  value: PropTypes.any,
-  /**
-   * The variant to use.
-   */
-  variant: PropTypes.oneOf(["filled", "outlined"]),
-  /**
-   * Whether or not to display an error message (if there is a message to display).
-   */
-  showError: PropTypes.bool,
-  /**
-   * The error message to display if showError === true
-   */
-  errorMessage: PropTypes.string,
-  /**
-   * Date format. See: https://day.js.org/docs/en/display/format
-   */
-  format: PropTypes.string,
-  /**
-   * Handle Input change event
-   */
-  onChange: PropTypes.func
-};
-
-exports.default = DatePicker;

package/dist/cjs/components/DatePicker.styled.cjs

@@ -1,22 +0,0 @@
-"use strict";
-'use strict';
-
-var styles = require('@mui/material/styles');
-
-var StyledWrapper = styles.styled("span")(function (_ref) {
-  var required = _ref.required,
-    theme = _ref.theme,
-    hasValue = _ref.hasValue;
-  return {
-    "& input": {
-      "&::placeholder": {
-        textTransform: "uppercase"
-      }
-    },
-    "& .MuiOutlinedInput-notchedOutline, &:hover .MuiOutlinedInput-notchedOutline": {
-      borderColor: required && !hasValue ? theme.palette.secondary.main : theme.palette.grey.main
-    }
-  };
-});
-
-exports.StyledWrapper = StyledWrapper;

package/dist/esm/components/DatePicker.js

@@ -1,163 +0,0 @@
-"use strict";
-import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2, slicedToArray as _slicedToArray } from '../_virtual/_rollupPluginBabelHelpers.js';
-import { jsx } from 'react/jsx-runtime';
-import { useState } from 'react';
-import PropTypes from 'prop-types';
-import InputAdornment from '@mui/material/InputAdornment';
-import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
-import EventIcon from '@mui/icons-material/Event';
-import { LocalizationProvider, DatePicker as DatePicker$1 } from '@mui/x-date-pickers';
-import TextInput from './TextInput.js';
-import IconButton from './IconButton.js';
-import { StyledWrapper } from './DatePicker.styled.js';
-
-var _excluded = ["disabled", "edges", "error", "showError", "errorMessage", "fullWidth", "helperText", "icon", "label", "required", "variant", "format", "value", "onChange", "name"];
-function DatePicker(_ref) {
-  var _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    _ref$edges = _ref.edges,
-    edges = _ref$edges === void 0 ? "normal" : _ref$edges,
-    _ref$error = _ref.error,
-    error = _ref$error === void 0 ? false : _ref$error,
-    _ref$showError = _ref.showError,
-    showError = _ref$showError === void 0 ? false : _ref$showError,
-    _ref$errorMessage = _ref.errorMessage,
-    errorMessage = _ref$errorMessage === void 0 ? "" : _ref$errorMessage,
-    _ref$fullWidth = _ref.fullWidth,
-    fullWidth = _ref$fullWidth === void 0 ? false : _ref$fullWidth,
-    _ref$helperText = _ref.helperText,
-    helperText = _ref$helperText === void 0 ? "" : _ref$helperText,
-    _ref$icon = _ref.icon,
-    icon = _ref$icon === void 0 ? void 0 : _ref$icon,
-    _ref$label = _ref.label,
-    label = _ref$label === void 0 ? "" : _ref$label,
-    _ref$required = _ref.required,
-    required = _ref$required === void 0 ? false : _ref$required,
-    _ref$variant = _ref.variant,
-    variant = _ref$variant === void 0 ? "outlined" : _ref$variant,
-    _ref$format = _ref.format,
-    format = _ref$format === void 0 ? "dd/MM/yyyy" : _ref$format,
-    _ref$value = _ref.value,
-    value = _ref$value === void 0 ? void 0 : _ref$value,
-    _ref$onChange = _ref.onChange,
-    onChange = _ref$onChange === void 0 ? null : _ref$onChange,
-    name = _ref.name,
-    others = _objectWithoutProperties(_ref, _excluded);
-  var rest = _objectSpread2({
-    error: error
-  }, others);
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2);
-    _useState2[0];
-    var setOpen = _useState2[1];
-  return /* @__PURE__ */jsx(StyledWrapper, {
-    required: required,
-    hasValue: !!value,
-    children: /* @__PURE__ */jsx(LocalizationProvider, {
-      dateAdapter: AdapterDayjs,
-      children: /* @__PURE__ */jsx(DatePicker$1, _objectSpread2({
-        clearable: true,
-        disableCloseOnSelect: false,
-        inputFormat: format,
-        value: value,
-        onChange: onChange,
-        onClose: function onClose() {
-          return setOpen(false);
-        },
-        renderInput: function renderInput(params) {
-          return /* @__PURE__ */jsx(TextInput, _objectSpread2(_objectSpread2({}, params), {}, {
-            onClick: function onClick() {
-              return setOpen(true);
-            },
-            name: name,
-            fullWidth: fullWidth,
-            label: label,
-            helperText: helperText,
-            disabled: disabled,
-            required: required,
-            showError: showError,
-            message: errorMessage,
-            edges: edges,
-            variant: variant,
-            autoComplete: "off",
-            InputProps: {
-              endAdornment: /* @__PURE__ */jsx(InputAdornment, {
-                position: "end",
-                children: /* @__PURE__ */jsx(IconButton, {
-                  onClick: function onClick() {
-                    return setOpen(true);
-                  },
-                  children: icon || /* @__PURE__ */jsx(EventIcon, {})
-                })
-              })
-            }
-          }));
-        }
-      }, rest))
-    })
-  });
-}
-DatePicker.propTypes = {
-  /**
-   * If `true`, the `input` element will be disabled.
-   */
-  disabled: PropTypes.bool,
-  /**
-   * Make button edges rounded or square
-   */
-  edges: PropTypes.oneOf(["normal", "rounded", "sharp"]),
-  /**
-   * If `true`, the label will be displayed in an error state.
-   */
-  error: PropTypes.bool,
-  /**
-   * If `true`, the input will take up the full width of its container.
-   */
-  fullWidth: PropTypes.bool,
-  /**
-   * The helper text content.
-   */
-  helperText: PropTypes.string,
-  /**
-   * Input icon
-   */
-  icon: PropTypes.node,
-  /**
-   * The label content.
-   */
-  label: PropTypes.string,
-  /**
-   * The field name.
-   */
-  name: PropTypes.string.isRequired,
-  /**
-   * If `true`, the label is displayed as required and the `input` element` will be required.
-   */
-  required: PropTypes.bool,
-  /**
-   * The value of the `input` element, required for a controlled component.
-   */
-  value: PropTypes.any,
-  /**
-   * The variant to use.
-   */
-  variant: PropTypes.oneOf(["filled", "outlined"]),
-  /**
-   * Whether or not to display an error message (if there is a message to display).
-   */
-  showError: PropTypes.bool,
-  /**
-   * The error message to display if showError === true
-   */
-  errorMessage: PropTypes.string,
-  /**
-   * Date format. See: https://day.js.org/docs/en/display/format
-   */
-  format: PropTypes.string,
-  /**
-   * Handle Input change event
-   */
-  onChange: PropTypes.func
-};
-
-export { DatePicker as default };

package/dist/esm/components/DatePicker.styled.js

@@ -1,20 +0,0 @@
-"use strict";
-import { styled } from '@mui/material/styles';
-
-var StyledWrapper = styled("span")(function (_ref) {
-  var required = _ref.required,
-    theme = _ref.theme,
-    hasValue = _ref.hasValue;
-  return {
-    "& input": {
-      "&::placeholder": {
-        textTransform: "uppercase"
-      }
-    },
-    "& .MuiOutlinedInput-notchedOutline, &:hover .MuiOutlinedInput-notchedOutline": {
-      borderColor: required && !hasValue ? theme.palette.secondary.main : theme.palette.grey.main
-    }
-  };
-});
-
-export { StyledWrapper };