@zonos/amino 5.1.62 → 5.1.63

package/components/filter/filter-select/FilterSelect.d.ts

@@ -6,7 +6,11 @@ export type FilterSelectProps<T extends string = string, O extends SelectOption<
     options: O[];
     selectProps?: CustomSelectProps<T, O> | ((editingValue: O | null) => CustomSelectProps<T, O>);
     value: O | null;
+    /**
+     * @default `is ${value.label}`
+     */
+    getFilterText?: (value: O) => string;
     onChange: (value: O | null) => void;
 };
-export declare const FilterSelect: <T extends string = string, O extends SelectOption<T> = SelectOption<T>>({ onChange, options, selectProps, value, ...props }: FilterSelectProps<T, O>) => import("react/jsx-runtime").JSX.Element;
+export declare const FilterSelect: <T extends string = string, O extends SelectOption<T> = SelectOption<T>>({ getFilterText, onChange, options, selectProps, value, ...props }: FilterSelectProps<T, O>) => import("react/jsx-runtime").JSX.Element;
 export {};

package/components/filter/filter-select/FilterSelect.js

@@ -1 +1 @@
-"use strict";var e=require("../../../_tslib-ccfac372.js"),r=require("react/jsx-runtime"),n=require("react"),i=require("../useFilterWrapper.js"),s=require("../../select/Select.js");require("styled-components"),require("../../button/Button.js"),require("../../button/RippleGroup.js"),require("framer-motion"),require("uuid"),require("../../button/_Ripple.js"),require("../../../styles/constants/theme.js"),require("../../button/useRipple.js"),require("../../spinner/Spinner.js"),require("../../../utils/getAminoColor.js"),require("../../text/Text.js"),require("../../../icons/ChevronDownIcon.js"),require("../../../icons/icon-base/_IconBase.js"),require("../../../icons/MinusCircleDuotoneIcon.js"),require("../../../icons/PlusCircleDuotoneIcon.js"),require("../../help-text/HelpText.js"),require("../../select/_StyledReactSelect.js"),require("react-select"),require("../../checkbox/Checkbox.js"),require("clsx"),require("../../../icons/CheckmarkIcon.js"),require("../../../utils/getTestId.js"),require("../../../icons/CheckCircleIcon.js"),require("../../../icons/DoubleChevronIcon.js"),require("../../../icons/RemoveCircleIcon.js"),require("../../../icons/RemoveIcon.js");exports.FilterSelect=function(o){var t=o.onChange,u=o.options,c=o.selectProps,l=o.value,a=e.__rest(o,["onChange","options","selectProps","value"]),q=e.__read(n.useState(l),2),p=q[0],j=q[1],C=e.__read(n.useState(!1),2),_=C[0],f=C[1],v=i.useFilterWrapper(e.__assign(e.__assign({},a),{filterExists:!!l,onApply:function(e){t(p),e("is ".concat((null==p?void 0:p.label)||""))},onClose:function(){j(l)},onRemove:function(){t(null),j(null)}})).renderWrapper,m=n.useMemo((function(){return"function"==typeof c?c(p):c}),[p,c]);return v(r.jsx(s.Select,e.__assign({isClearable:!1,onChange:j,onKeyDown:function(e){"Enter"===e.key&&_&&e.stopPropagation()},onMenuClose:function(){return f(!1)},onMenuOpen:function(){return f(!0)},options:u,size:"sm",value:u.filter((function(e){return e.value===(null==p?void 0:p.value)}))},m)))};
+"use strict";var e=require("../../../_tslib-ccfac372.js"),r=require("react/jsx-runtime"),n=require("react"),t=require("../useFilterWrapper.js"),i=require("../../select/Select.js");require("styled-components"),require("../../button/Button.js"),require("../../button/RippleGroup.js"),require("framer-motion"),require("uuid"),require("../../button/_Ripple.js"),require("../../../styles/constants/theme.js"),require("../../button/useRipple.js"),require("../../spinner/Spinner.js"),require("../../../utils/getAminoColor.js"),require("../../text/Text.js"),require("../../../icons/ChevronDownIcon.js"),require("../../../icons/icon-base/_IconBase.js"),require("../../../icons/MinusCircleDuotoneIcon.js"),require("../../../icons/PlusCircleDuotoneIcon.js"),require("../../help-text/HelpText.js"),require("../../select/_StyledReactSelect.js"),require("react-select"),require("../../checkbox/Checkbox.js"),require("clsx"),require("../../../icons/CheckmarkIcon.js"),require("../../../utils/getTestId.js"),require("../../../icons/CheckCircleIcon.js"),require("../../../icons/DoubleChevronIcon.js"),require("../../../icons/RemoveCircleIcon.js"),require("../../../icons/RemoveIcon.js");exports.FilterSelect=function(o){var s=o.getFilterText,u=void 0===s?function(e){return"is ".concat(e.label)}:s,c=o.onChange,l=o.options,a=o.selectProps,q=o.value,p=e.__rest(o,["getFilterText","onChange","options","selectProps","value"]),j=e.__read(n.useState(q),2),C=j[0],_=j[1],f=e.__read(n.useState(!1),2),v=f[0],x=f[1],m=t.useFilterWrapper(e.__assign(e.__assign({},p),{filterExists:!!q,onApply:function(e){(c(C),C)&&e(u(C))},onClose:function(){_(q)},onRemove:function(){c(null),_(null)}})).renderWrapper,b=n.useMemo((function(){return"function"==typeof a?a(C):a}),[C,a]);return m(r.jsx(i.Select,e.__assign({isClearable:!1,onChange:_,onKeyDown:function(e){"Enter"===e.key&&v&&e.stopPropagation()},onMenuClose:function(){return x(!1)},onMenuOpen:function(){return x(!0)},options:l,size:"sm",value:l.filter((function(e){return e.value===(null==C?void 0:C.value)}))},b)))};

package/components/simple-table/SimpleTable.d.ts

@@ -72,6 +72,10 @@ export type SimpleTableProps<T extends object> = BaseProps & {
          */
         renderCustomRowCheckbox?: (item: T, index: number) => ReactNode;
     };
+    /**
+     * Will make the whole row (each td) an anchor tag so native link functionality exists. If clicking just navigates, use this over onRowClick.
+     */
+    getRowLink?: (item: T) => string;
     /** Adding unique list keys */
     keyExtractor: (item: T) => string;
     /**
@@ -90,5 +94,5 @@ export type SimpleTableProps<T extends object> = BaseProps & {
  * - 'row-hover-show': Shows only when the row is hovered
  * - 'cell-hover-show': Shows only when the cell is hovered
  */
-export declare const SimpleTable: <T extends object>({ className, headers, items, keyExtractor, loading, loadingItems, noHoverBackground, onRowClick, onRowHover, renderFooter, selectable, }: SimpleTableProps<T>) => import("react/jsx-runtime").JSX.Element;
+export declare const SimpleTable: <T extends object>({ className, getRowLink, headers, items, keyExtractor, loading, loadingItems, noHoverBackground, onRowClick, onRowHover, renderFooter, selectable, }: SimpleTableProps<T>) => import("react/jsx-runtime").JSX.Element;
 export {};

package/components/simple-table/SimpleTable.js

@@ -1 +1 @@
-"use strict";var e=require("../../_tslib-ccfac372.js"),n=require("react/jsx-runtime"),t=require("styled-components"),o=require("../checkbox/Checkbox.js"),r=require("../skeleton/Skeleton.js"),i=require("../text/Text.js"),a=require("../../styles/constants/theme.js");function l(e){return e&&e.__esModule?e:{default:e}}require("react"),require("clsx"),require("framer-motion"),require("../../icons/CheckmarkIcon.js"),require("../../icons/icon-base/_IconBase.js"),require("../../utils/getTestId.js");var d,c,s,h,u,x,b,g=l(t),m=g.default.table(d||(d=e.__makeTemplateObject(["\n  width: 100%;\n"],["\n  width: 100%;\n"]))),k=g.default.thead(c||(c=e.__makeTemplateObject(["\n  text-transform: uppercase;\n"],["\n  text-transform: uppercase;\n"]))),p=g.default.tr(s||(s=e.__makeTemplateObject(["\n  border-bottom: ",";\n  height: 56px;\n"],["\n  border-bottom: ",";\n  height: 56px;\n"])),a.theme.border),v=g.default.th(h||(h=e.__makeTemplateObject(["\n  padding: ",";\n  white-space: nowrap;\n  text-align: ",";\n"],["\n  padding: ",";\n  white-space: nowrap;\n  text-align: ",";\n"])),a.theme.space16,(function(e){return e.$textAlign})),j=g.default.tr(u||(u=e.__makeTemplateObject(["\n  height: 48px;\n  cursor: ",";\n  & {\n    border-bottom: ",";\n  }\n\n  &.with-hover:hover {\n    background-color: ",";\n  }\n\n  &:not(:hover) {\n    .row-hover-show {\n      visibility: collapse;\n    }\n  }\n"],["\n  height: 48px;\n  cursor: ",";\n  & {\n    border-bottom: ",";\n  }\n\n  &.with-hover:hover {\n    background-color: ",";\n  }\n\n  &:not(:hover) {\n    .row-hover-show {\n      visibility: collapse;\n    }\n  }\n"])),(function(e){return e.$clickable?"pointer":"auto"}),a.theme.border,a.theme.gray50),C=g.default.td(x||(x=e.__makeTemplateObject(["\n  padding: ",";\n  text-align: ",";\n\n  &:not(:hover) {\n    .cell-hover-show {\n      visibility: collapse;\n    }\n  }\n"],["\n  padding: ",";\n  text-align: ",";\n\n  &:not(:hover) {\n    .cell-hover-show {\n      visibility: collapse;\n    }\n  }\n"])),(function(e){return e.$noPadding?void 0:a.theme.space12}),(function(e){return e.$textAlign})),f=g.default(o.Checkbox)(b||(b=e.__makeTemplateObject(["\n  padding: ",";\n  display: inline-flex;\n"],["\n  padding: ",";\n  display: inline-flex;\n"])),a.theme.space12);exports.SimpleTable=function(t){var o=t.className,a=t.headers,l=t.items,d=t.keyExtractor,c=t.loading,s=void 0!==c&&c,h=t.loadingItems,u=void 0===h?10:h,x=t.noHoverBackground,b=void 0!==x&&x,g=t.onRowClick,w=t.onRowHover,y=t.renderFooter,_=t.selectable,q=void 0===_?{enabled:!1}:_;return n.jsxs(m,{className:o,children:[n.jsxs("colgroup",{children:[!!q.onHeaderCheckboxChange&&n.jsx("col",{width:0}),a.map((function(e){return n.jsx("col",{width:void 0!==e.width?"".concat(e.width,"%"):void 0},e.key)}))]}),n.jsx(k,{children:n.jsxs(p,{children:[!!q.onHeaderCheckboxChange&&n.jsx("th",{children:q.renderCustomHeaderCheckbox||n.jsx(f,{checked:!s&&q.headerCheckboxValue||!1,disabled:s,onChange:q.onHeaderCheckboxChange})}),a.map((function(e){return n.jsx(v,{$textAlign:e.align||"start",children:n.jsx(i.Text,{color:"gray800",type:"small-header",children:e.name})},e.key)}))]})}),n.jsx("tbody",{children:s?e.__spreadArray([],e.__read(Array(u+1).keys()),!1).map((function(e){return n.jsxs(j,{$clickable:!1,children:[q.enabled&&n.jsx("td",{children:n.jsx(r.Skeleton,{height:30},e)}),a.map((function(t){return n.jsx(C,{$noPadding:!!t.noPadding,$textAlign:"center",children:n.jsx(r.Skeleton,{height:30},e)},t.key)}))]},e)})):l.map((function(e,t){var o,r,i;return n.jsxs(j,{$clickable:!!g||!!q.anySelected&&!!q.onRowCheckboxChange,className:b?"":"with-hover",onClick:function(){var n,o,r;q.anySelected?(null===(n=q.isRowCheckboxDisabled)||void 0===n?void 0:n.call(q,e,t))||null===(o=q.onRowCheckboxChange)||void 0===o||o.call(q,!(null===(r=q.isRowChecked)||void 0===r?void 0:r.call(q,e,t)),e,t):null==g||g(e)},onMouseEnter:function(){return null==w?void 0:w(e)},children:[q.enabled&&n.jsx("td",{children:(null===(o=q.renderCustomRowCheckbox)||void 0===o?void 0:o.call(q,e,t))||n.jsx(f,{checked:(null===(r=q.isRowChecked)||void 0===r?void 0:r.call(q,e,t))||!1,disabled:(null===(i=q.isRowCheckboxDisabled)||void 0===i?void 0:i.call(q,e,t))||!1,onChange:function(n){var o;return null===(o=q.onRowCheckboxChange)||void 0===o?void 0:o.call(q,n,e,t)}})}),a.map((function(t){return function(e,t){var o=t[e.key];return e.renderCustom?n.jsx(C,{$noPadding:e.noPadding||!1,$textAlign:e.align||"start",children:e.renderCustom(o,t)},e.key):n.jsx(C,{$noPadding:e.noPadding||!1,$textAlign:e.align||"start",children:String(o)},e.key)}(t,e)}))]},d(e))}))}),y]})};
+"use strict";var n=require("../../_tslib-ccfac372.js"),e=require("react/jsx-runtime"),o=require("clsx"),i=require("styled-components"),r=require("../checkbox/Checkbox.js"),t=require("../skeleton/Skeleton.js"),d=require("../text/Text.js"),a=require("../../styles/constants/theme.js");function l(n){return n&&n.__esModule?n:{default:n}}require("react"),require("framer-motion"),require("../../icons/CheckmarkIcon.js"),require("../../icons/icon-base/_IconBase.js"),require("../../utils/getTestId.js");var s,c,h=l(o),u=l(i),g=u.default.table(s||(s=n.__makeTemplateObject(["\n  width: 100%;\n\n  > thead {\n    text-transform: uppercase;\n\n    > tr {\n      border-bottom: ",";\n      height: 56px;\n\n      > th {\n        padding: ",";\n        white-space: nowrap;\n\n        &.noPadding {\n          padding: 0;\n        }\n      }\n    }\n  }\n\n  > tbody {\n    > tr {\n      height: 48px;\n\n      & {\n        border-bottom: ",";\n      }\n\n      &.withHover:hover {\n        background-color: ",";\n      }\n\n      &.clickable {\n        cursor: pointer;\n      }\n\n      &:not(:hover) {\n        .row-hover-show {\n          visibility: collapse;\n        }\n      }\n\n      > td {\n        padding: ",";\n\n        &.noPadding {\n          padding: 0;\n        }\n\n        &.loading {\n          text-align: center;\n        }\n\n        &:not(:hover) {\n          .cell-hover-show {\n            visibility: collapse;\n          }\n        }\n\n        &.cellLink {\n          padding: 0;\n\n          > a {\n            display: block;\n            width: 100%;\n            height: 100%;\n            padding: ",";\n\n            &.noPadding {\n              padding: 0;\n            }\n          }\n        }\n      }\n    }\n  }\n"],["\n  width: 100%;\n\n  > thead {\n    text-transform: uppercase;\n\n    > tr {\n      border-bottom: ",";\n      height: 56px;\n\n      > th {\n        padding: ",";\n        white-space: nowrap;\n\n        &.noPadding {\n          padding: 0;\n        }\n      }\n    }\n  }\n\n  > tbody {\n    > tr {\n      height: 48px;\n\n      & {\n        border-bottom: ",";\n      }\n\n      &.withHover:hover {\n        background-color: ",";\n      }\n\n      &.clickable {\n        cursor: pointer;\n      }\n\n      &:not(:hover) {\n        .row-hover-show {\n          visibility: collapse;\n        }\n      }\n\n      > td {\n        padding: ",";\n\n        &.noPadding {\n          padding: 0;\n        }\n\n        &.loading {\n          text-align: center;\n        }\n\n        &:not(:hover) {\n          .cell-hover-show {\n            visibility: collapse;\n          }\n        }\n\n        &.cellLink {\n          padding: 0;\n\n          > a {\n            display: block;\n            width: 100%;\n            height: 100%;\n            padding: ",";\n\n            &.noPadding {\n              padding: 0;\n            }\n          }\n        }\n      }\n    }\n  }\n"])),a.theme.border,a.theme.space16,a.theme.border,a.theme.gray50,a.theme.space12,a.theme.space12),x=u.default(r.Checkbox)(c||(c=n.__makeTemplateObject(["\n  padding: ",";\n  display: inline-flex;\n"],["\n  padding: ",";\n  display: inline-flex;\n"])),a.theme.space12);exports.SimpleTable=function(o){var i=o.className,r=o.getRowLink,a=o.headers,l=o.items,s=o.keyExtractor,c=o.loading,u=void 0!==c&&c,p=o.loadingItems,b=void 0===p?10:p,m=o.noHoverBackground,k=void 0!==m&&m,v=o.onRowClick,j=o.onRowHover,w=o.renderFooter,y=o.selectable,C=void 0===y?{enabled:!1}:y;return e.jsxs(g,{className:i,children:[e.jsxs("colgroup",{children:[!!C.onHeaderCheckboxChange&&e.jsx("col",{width:0}),a.map((function(n){return e.jsx("col",{width:void 0!==n.width?"".concat(n.width,"%"):void 0},n.key)}))]}),e.jsx("thead",{children:e.jsxs("tr",{children:[!!C.onHeaderCheckboxChange&&e.jsx("th",{className:"noPadding",children:C.renderCustomHeaderCheckbox||e.jsx(x,{checked:!u&&C.headerCheckboxValue||!1,disabled:u,onChange:C.onHeaderCheckboxChange})}),a.map((function(n){return e.jsx("th",{style:{textAlign:n.align||"start"},children:e.jsx(d.Text,{color:"gray800",type:"small-header",children:n.name})},n.key)}))]})}),e.jsx("tbody",{children:u?n.__spreadArray([],n.__read(Array(b+1).keys()),!1).map((function(n){return e.jsxs("tr",{children:[C.enabled&&e.jsx("td",{children:e.jsx(t.Skeleton,{height:30},n)}),a.map((function(o){return e.jsx("td",{className:h.default({loading:!0,noPadding:o.noPadding}),children:e.jsx(t.Skeleton,{height:30},n)},o.key)}))]},n)})):l.map((function(n,o){var i,t,d,l=!!v||!!C.anySelected&&!!C.onRowCheckboxChange;return e.jsxs("tr",{className:h.default({clickable:l,withHover:!k}),onClick:function(){var e,i,r;C.anySelected?(null===(e=C.isRowCheckboxDisabled)||void 0===e?void 0:e.call(C,n,o))||null===(i=C.onRowCheckboxChange)||void 0===i||i.call(C,!(null===(r=C.isRowChecked)||void 0===r?void 0:r.call(C,n,o)),n,o):null==v||v(n)},onMouseEnter:function(){return null==j?void 0:j(n)},children:[C.enabled&&e.jsx("td",{className:"noPadding",children:(null===(i=C.renderCustomRowCheckbox)||void 0===i?void 0:i.call(C,n,o))||e.jsx(x,{checked:(null===(t=C.isRowChecked)||void 0===t?void 0:t.call(C,n,o))||!1,disabled:(null===(d=C.isRowCheckboxDisabled)||void 0===d?void 0:d.call(C,n,o))||!1,onChange:function(e){var i;return null===(i=C.onRowCheckboxChange)||void 0===i?void 0:i.call(C,e,n,o)}})}),a.map((function(o){return function(n,o){var i=o[n.key],t=function(i){return r?e.jsx("td",{className:"cellLink",children:e.jsx("a",{className:h.default({noPadding:n.noPadding}),href:r(o),style:{textAlign:n.align||"start"},children:i})},n.key):e.jsx("td",{className:h.default({noPadding:n.noPadding}),style:{textAlign:n.align||"start"},children:i},n.key)};return n.renderCustom?e.jsx(e.Fragment,{children:t(n.renderCustom(i,o))}):e.jsx(e.Fragment,{children:t(String(i))})}(o,n)}))]},s(n))}))}),w]})};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zonos/amino",
-  "version": "5.1.62",
+  "version": "5.1.63",
   "description": "Core UI components for Amino",
   "repository": "git@github.com:Zonos/amino.git",
   "license": "MIT",