@economic/taco 2.34.0 → 2.35.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (95) hide show
  1. package/dist/components/Drawer/Context.d.ts +1 -0
  2. package/dist/components/Drawer/Drawer.d.ts +6 -0
  3. package/dist/components/Icon/components/DocumentSigned.d.ts +3 -0
  4. package/dist/components/Icon/components/Home2.d.ts +3 -0
  5. package/dist/components/Icon/components/Id.d.ts +3 -0
  6. package/dist/components/Icon/components/MastercardOs.d.ts +3 -0
  7. package/dist/components/Icon/components/NovemberFirst.d.ts +3 -0
  8. package/dist/components/Icon/components/index.d.ts +1 -1
  9. package/dist/components/Input/Input.d.ts +1 -1
  10. package/dist/components/Menu/components/Item.d.ts +1 -1
  11. package/dist/components/Menu/components/Link.d.ts +1 -1
  12. package/dist/components/Navigation2/components/Link.d.ts +1 -1
  13. package/dist/components/Provider/Localization.d.ts +1 -0
  14. package/dist/components/Select2/Select2.d.ts +25 -4
  15. package/dist/components/Select2/components/Option.d.ts +2 -2
  16. package/dist/components/Select2/components/Search.d.ts +1 -1
  17. package/dist/components/Table3/components/Columns/Internal/EditingActionsMenu.d.ts +1 -0
  18. package/dist/components/Table3/features/useTableEditing.d.ts +0 -1
  19. package/dist/components/Table3/listeners/useTableEditingListener.d.ts +3 -1
  20. package/dist/components/Tag/Tag.d.ts +1 -1
  21. package/dist/esm/index.css +4 -0
  22. package/dist/esm/packages/taco/src/components/Datepicker/Datepicker.js +13 -3
  23. package/dist/esm/packages/taco/src/components/Datepicker/Datepicker.js.map +1 -1
  24. package/dist/esm/packages/taco/src/components/Drawer/Context.js +1 -0
  25. package/dist/esm/packages/taco/src/components/Drawer/Context.js.map +1 -1
  26. package/dist/esm/packages/taco/src/components/Drawer/Drawer.js +3 -1
  27. package/dist/esm/packages/taco/src/components/Drawer/Drawer.js.map +1 -1
  28. package/dist/esm/packages/taco/src/components/Drawer/components/Content.js +41 -8
  29. package/dist/esm/packages/taco/src/components/Drawer/components/Content.js.map +1 -1
  30. package/dist/esm/packages/taco/src/components/Drawer/util.js +1 -1
  31. package/dist/esm/packages/taco/src/components/Drawer/util.js.map +1 -1
  32. package/dist/esm/packages/taco/src/components/Icon/components/DocumentSigned.js +19 -0
  33. package/dist/esm/packages/taco/src/components/Icon/components/DocumentSigned.js.map +1 -0
  34. package/dist/esm/packages/taco/src/components/Icon/components/Home2.js +19 -0
  35. package/dist/esm/packages/taco/src/components/Icon/components/Home2.js.map +1 -0
  36. package/dist/esm/packages/taco/src/components/Icon/components/Id.js +19 -0
  37. package/dist/esm/packages/taco/src/components/Icon/components/Id.js.map +1 -0
  38. package/dist/esm/packages/taco/src/components/Icon/components/MastercardOs.js +23 -0
  39. package/dist/esm/packages/taco/src/components/Icon/components/MastercardOs.js.map +1 -0
  40. package/dist/esm/packages/taco/src/components/Icon/components/NovemberFirst.js +20 -0
  41. package/dist/esm/packages/taco/src/components/Icon/components/NovemberFirst.js.map +1 -0
  42. package/dist/esm/packages/taco/src/components/Icon/components/index.js +10 -0
  43. package/dist/esm/packages/taco/src/components/Icon/components/index.js.map +1 -1
  44. package/dist/esm/packages/taco/src/components/Input/Input.js +5 -0
  45. package/dist/esm/packages/taco/src/components/Input/Input.js.map +1 -1
  46. package/dist/esm/packages/taco/src/components/List/components/Toggle.js +26 -15
  47. package/dist/esm/packages/taco/src/components/List/components/Toggle.js.map +1 -1
  48. package/dist/esm/packages/taco/src/components/Provider/Localization.js +2 -1
  49. package/dist/esm/packages/taco/src/components/Provider/Localization.js.map +1 -1
  50. package/dist/esm/packages/taco/src/components/Select2/Select2.js +48 -10
  51. package/dist/esm/packages/taco/src/components/Select2/Select2.js.map +1 -1
  52. package/dist/esm/packages/taco/src/components/Table3/Table3.js +1 -7
  53. package/dist/esm/packages/taco/src/components/Table3/Table3.js.map +1 -1
  54. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/Editing/RowMoveIndicator.js +1 -1
  55. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/Editing/RowMoveIndicator.js.map +1 -1
  56. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/EditingControlCell.js +1 -0
  57. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/EditingControlCell.js.map +1 -1
  58. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/util.js +2 -1
  59. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/util.js.map +1 -1
  60. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Internal/EditingActionsMenu.js +9 -1
  61. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Internal/EditingActionsMenu.js.map +1 -1
  62. package/dist/esm/packages/taco/src/components/Table3/components/Row/Row.js +1 -1
  63. package/dist/esm/packages/taco/src/components/Table3/components/Row/Row.js.map +1 -1
  64. package/dist/esm/packages/taco/src/components/Table3/features/useTableEditing.js +1 -12
  65. package/dist/esm/packages/taco/src/components/Table3/features/useTableEditing.js.map +1 -1
  66. package/dist/esm/packages/taco/src/components/Table3/listeners/useTableEditingListener.js +16 -1
  67. package/dist/esm/packages/taco/src/components/Table3/listeners/useTableEditingListener.js.map +1 -1
  68. package/dist/esm/packages/taco/src/components/Table3/useTable3.js +3 -2
  69. package/dist/esm/packages/taco/src/components/Table3/useTable3.js.map +1 -1
  70. package/dist/esm/packages/taco/src/primitives/Table/Core/Table.js +1 -1
  71. package/dist/esm/packages/taco/src/primitives/Table/Core/Table.js.map +1 -1
  72. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Body/Body.js +2 -2
  73. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Body/Body.js.map +1 -1
  74. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Body/util.js +12 -5
  75. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Body/util.js.map +1 -1
  76. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Header/components/Menu.js +9 -1
  77. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Header/components/Menu.js.map +1 -1
  78. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Row/BuiltIns/DisplayRow.js +1 -2
  79. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Row/BuiltIns/DisplayRow.js.map +1 -1
  80. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterColumn.js +3 -4
  81. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterColumn.js.map +1 -1
  82. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterComparator.js +3 -4
  83. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterComparator.js.map +1 -1
  84. package/dist/esm/packages/taco/src/primitives/Table/useTableDataLoader.js +0 -4
  85. package/dist/esm/packages/taco/src/primitives/Table/useTableDataLoader.js.map +1 -1
  86. package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/search.js +3 -2
  87. package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/search.js.map +1 -1
  88. package/dist/index.css +4 -0
  89. package/dist/primitives/Table/Core/components/Body/util.d.ts +2 -2
  90. package/dist/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterColumn.d.ts +1 -1
  91. package/dist/taco.cjs.development.js +287 -87
  92. package/dist/taco.cjs.development.js.map +1 -1
  93. package/dist/taco.cjs.production.min.js +1 -1
  94. package/dist/taco.cjs.production.min.js.map +1 -1
  95. package/package.json +2 -2
@@ -5,6 +5,7 @@ declare type EditingActionMenuProps = {
5
5
  onClear: () => void;
6
6
  onExit: () => void;
7
7
  onSave: () => Promise<void>;
8
+ isLastRow: boolean;
8
9
  };
9
10
  export declare function EditingActionMenu(props: EditingActionMenuProps): JSX.Element;
10
11
  export {};
@@ -3,7 +3,6 @@ import { Cell as ReactTableCell, Table as ReactTable } from '@tanstack/react-tab
3
3
  import { Table3EditingSaveHandler, Table3EditingValidatorFn } from '../types';
4
4
  import { TableRef } from '../../../primitives/Table/types';
5
5
  export declare function useTableEditing<TType = unknown>(isEnabled: boolean | undefined, handleSave: Table3EditingSaveHandler<TType> | undefined, validator: Table3EditingValidatorFn<TType> | undefined): {
6
- handleBlur: (event: React.FocusEvent<HTMLTableElement>) => void;
7
6
  getCellValue: <T extends TType>(cell: ReactTableCell<T, unknown>) => unknown;
8
7
  getCellError: <T_1 extends TType>(cell: ReactTableCell<T_1, unknown>) => string | undefined;
9
8
  setCellValue: <T_2 extends TType>(cell: ReactTableCell<T_2, unknown>, change: unknown, rowIndex: number) => void;
@@ -1,2 +1,4 @@
1
+ import React from 'react';
1
2
  import { Table as ReactTable } from '@tanstack/react-table';
2
- export declare function useTableEditingListener<TType = unknown>(table: ReactTable<TType>): void;
3
+ import { TableRef } from '../../../primitives/Table/types';
4
+ export declare function useTableEditingListener<TType = unknown>(table: ReactTable<TType>, tableRef: React.RefObject<TableRef>): void;
@@ -13,7 +13,7 @@ export declare const Tag: React.ForwardRefExoticComponent<Pick<React.HTMLAttribu
13
13
  children: string;
14
14
  color?: "green" | "yellow" | "red" | "blue" | "purple" | "brown" | "pink" | "orange" | "grey" | "transparent" | undefined;
15
15
  disabled?: boolean | undefined;
16
- icon?: React.ReactElement<IconProps, string | ((props: any) => React.ReactElement<any, any> | null) | (new (props: any) => React.Component<any, any, any>)> | "account-preview" | "accounting-year-cancel" | "accounting-year" | "accounting" | "ai-chat-solid" | "ai-stars" | "arrow-bottom" | "arrow-down" | "arrow-end" | "arrow-left" | "arrow-right" | "arrow-start" | "arrow-top" | "arrow-up" | "attach-auto" | "attach-cancel" | "attach-warning" | "attach" | "autotext-insert" | "autotext" | "basic-tabs" | "basic" | "bell-solid" | "book" | "booking" | "budget" | "calendar" | "cash-account" | "cash-reports" | "chart-area" | "chart-bar" | "chart-line" | "chart-pie" | "chart-table" | "chat-solid" | "chat" | "chevron-down-double" | "chevron-down-solid" | "chevron-down" | "chevron-left-double" | "chevron-left-solid" | "chevron-left" | "chevron-right-double" | "chevron-right-solid" | "chevron-right" | "chevron-up-double" | "chevron-up-solid" | "chevron-up" | "circle-close" | "circle-information" | "circle-minus" | "circle-plus" | "circle-questionmark" | "circle-tick" | "circle-warning" | "clamp-open" | "clamp" | "close" | "column-freeze" | "column-unfreeze" | "columns" | "connection-enable" | "connection-revoke" | "contacts" | "copy" | "courses" | "credit" | "delete-permanently" | "delete" | "depecriate" | "developer" | "distribution-template" | "document-approve" | "document-create-entry" | "document-cut" | "document-error" | "document-isolate-page" | "document-merge" | "document-move" | "document-preview" | "document-received" | "document-rejected-request" | "document-split" | "document-time" | "document" | "download" | "drag" | "e-copedia" | "e-signature" | "edit-simple" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "entries-on-account" | "entries-open" | "entries-warning" | "entry-type-customer-invoice" | "entry-type-customer-payment" | "entry-type-journal-entry" | "entry-type-manual-customer-invoice" | "entry-type-supplier-invoice" | "entry-type-supplier-payment" | "envelope-approved" | "envelope-solid" | "envelope" | "expand-view" | "expenses" | "export-to-excel" | "export-to-pdf" | "export" | "eye-off" | "eye-on" | "filter-solid" | "filter" | "font-size" | "graph-solid" | "hash" | "height-extra-tall" | "height-medium" | "height-short" | "height-tall" | "home" | "images" | "import" | "inbox-einvoicing" | "inbox-scanning" | "inbox-smart" | "inbox" | "info" | "inventory-matrix" | "inventory" | "journal-pro" | "layout-both" | "layout-first" | "layout-last" | "layout-none" | "layout" | "ledger-card-customer-reminder" | "ledger-card-manual-customer-invoice" | "ledger-card-obsolete-stock" | "ledger-card-opening-entry" | "ledger-card-reserved-entry" | "ledger-card-shrinkage-pilferage" | "ledger-card-stock-adjustment" | "ledger-card-transferred-opening-entry" | "ledger-card" | "lightbulb" | "line" | "link-external" | "list-bulleted" | "list-search" | "list" | "location" | "lock-open" | "lock" | "log-out" | "log" | "market" | "match-amount" | "match-entries" | "menu" | "mileage" | "modal-resize" | "modal-shrink" | "more-solid" | "more" | "move" | "navigation-list" | "note-follow-up" | "note-read" | "note" | "numbers" | "partner-api" | "payment-paid" | "payment-unpaid" | "period" | "person-change" | "person-minus" | "person-plus" | "person-tick" | "phone-solid" | "phone" | "play" | "plus-minus" | "print" | "process-payment" | "product-ledger-card" | "profile" | "project-cards" | "projects" | "question-mark-bold" | "question-mark" | "quicklinks" | "rating-bankruptcy" | "rating-payment-problems" | "reconciled" | "refresh" | "report-solid" | "report" | "restore" | "rotate-left" | "rotate-right" | "sales" | "search-bold" | "search" | "secure-tick" | "secure" | "settings-solid" | "settings" | "shortcuts" | "show-all" | "show-less" | "show-more" | "show-template" | "sliders" | "smartpay" | "sort-by" | "star-solid" | "star" | "subscriptions" | "system-entries" | "tag" | "template-override" | "templates" | "thumb-both" | "thumb-down-solid" | "thumb-down" | "thumb-up-solid" | "thumb-up" | "tick-bold" | "tick" | "time" | "transfer-cancel" | "transfer-locked" | "transfer" | "undo" | "undock" | "unreconciled" | "warning" | "webshop" | "website" | "workflow-template-basic" | "workflow" | "zoom" | undefined;
16
+ icon?: "id" | React.ReactElement<IconProps, string | ((props: any) => React.ReactElement<any, any> | null) | (new (props: any) => React.Component<any, any, any>)> | "account-preview" | "accounting-year-cancel" | "accounting-year" | "accounting" | "ai-chat-solid" | "ai-stars" | "arrow-bottom" | "arrow-down" | "arrow-end" | "arrow-left" | "arrow-right" | "arrow-start" | "arrow-top" | "arrow-up" | "attach-auto" | "attach-cancel" | "attach-warning" | "attach" | "autotext-insert" | "autotext" | "basic-tabs" | "basic" | "bell-solid" | "book" | "booking" | "budget" | "calendar" | "cash-account" | "cash-reports" | "chart-area" | "chart-bar" | "chart-line" | "chart-pie" | "chart-table" | "chat-solid" | "chat" | "chevron-down-double" | "chevron-down-solid" | "chevron-down" | "chevron-left-double" | "chevron-left-solid" | "chevron-left" | "chevron-right-double" | "chevron-right-solid" | "chevron-right" | "chevron-up-double" | "chevron-up-solid" | "chevron-up" | "circle-close" | "circle-information" | "circle-minus" | "circle-plus" | "circle-questionmark" | "circle-tick" | "circle-warning" | "clamp-open" | "clamp" | "close" | "column-freeze" | "column-unfreeze" | "columns" | "connection-enable" | "connection-revoke" | "contacts" | "copy" | "courses" | "credit" | "delete-permanently" | "delete" | "depecriate" | "developer" | "distribution-template" | "document-approve" | "document-create-entry" | "document-cut" | "document-error" | "document-isolate-page" | "document-merge" | "document-move" | "document-preview" | "document-received" | "document-rejected-request" | "document-signed" | "document-split" | "document-time" | "document" | "download" | "drag" | "e-copedia" | "e-signature" | "edit-simple" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "entries-on-account" | "entries-open" | "entries-warning" | "entry-type-customer-invoice" | "entry-type-customer-payment" | "entry-type-journal-entry" | "entry-type-manual-customer-invoice" | "entry-type-supplier-invoice" | "entry-type-supplier-payment" | "envelope-approved" | "envelope-solid" | "envelope" | "expand-view" | "expenses" | "export-to-excel" | "export-to-pdf" | "export" | "eye-off" | "eye-on" | "filter-solid" | "filter" | "font-size" | "graph-solid" | "hash" | "height-extra-tall" | "height-medium" | "height-short" | "height-tall" | "home2" | "home" | "images" | "import" | "inbox-einvoicing" | "inbox-scanning" | "inbox-smart" | "inbox" | "info" | "inventory-matrix" | "inventory" | "journal-pro" | "layout-both" | "layout-first" | "layout-last" | "layout-none" | "layout" | "ledger-card-customer-reminder" | "ledger-card-manual-customer-invoice" | "ledger-card-obsolete-stock" | "ledger-card-opening-entry" | "ledger-card-reserved-entry" | "ledger-card-shrinkage-pilferage" | "ledger-card-stock-adjustment" | "ledger-card-transferred-opening-entry" | "ledger-card" | "lightbulb" | "line" | "link-external" | "list-bulleted" | "list-search" | "list" | "location" | "lock-open" | "lock" | "log-out" | "log" | "market" | "mastercard-os" | "match-amount" | "match-entries" | "menu" | "mileage" | "modal-resize" | "modal-shrink" | "more-solid" | "more" | "move" | "navigation-list" | "note-follow-up" | "note-read" | "note" | "november-first" | "numbers" | "partner-api" | "payment-paid" | "payment-unpaid" | "period" | "person-change" | "person-minus" | "person-plus" | "person-tick" | "phone-solid" | "phone" | "play" | "plus-minus" | "print" | "process-payment" | "product-ledger-card" | "profile" | "project-cards" | "projects" | "question-mark-bold" | "question-mark" | "quicklinks" | "rating-bankruptcy" | "rating-payment-problems" | "reconciled" | "refresh" | "report-solid" | "report" | "restore" | "rotate-left" | "rotate-right" | "sales" | "search-bold" | "search" | "secure-tick" | "secure" | "settings-solid" | "settings" | "shortcuts" | "show-all" | "show-less" | "show-more" | "show-template" | "sliders" | "smartpay" | "sort-by" | "star-solid" | "star" | "subscriptions" | "system-entries" | "tag" | "template-override" | "templates" | "thumb-both" | "thumb-down-solid" | "thumb-down" | "thumb-up-solid" | "thumb-up" | "tick-bold" | "tick" | "time" | "transfer-cancel" | "transfer-locked" | "transfer" | "undo" | "undock" | "unreconciled" | "warning" | "webshop" | "website" | "workflow-template-basic" | "workflow" | "zoom" | undefined;
17
17
  readOnly?: boolean | undefined;
18
18
  onDelete?: ((event: React.MouseEvent<SVGSVGElement>) => void) | undefined;
19
19
  } & React.RefAttributes<HTMLSpanElement>>;
@@ -1216,6 +1216,10 @@ table[data-taco='table3'][data-table-editing-mode='detailed'] td [data-taco='tex
1216
1216
  @apply yt-focus-dark;
1217
1217
  }
1218
1218
 
1219
+ table[data-taco='table3'] td:focus {
1220
+ @apply rounded-sm ring-2 ring-inset ring-[#4573D2];
1221
+ }
1222
+
1219
1223
  table[data-taco='table3'][data-table-editing-mode] tbody tr:not([data-row-active='true']):hover td [data-taco='input'],
1220
1224
  table[data-taco='table3'][data-table-editing-mode] tbody tr:not([data-row-active='true']):hover td [data-taco='textarea'],
1221
1225
  table[data-taco='table3'][data-table-editing-mode] tbody tr:not([data-row-active='true']):hover td [data-taco='Select2'] {
@@ -1,4 +1,4 @@
1
- import { forwardRef, createElement } from 'react';
1
+ import { forwardRef, useRef, useCallback, createElement } from 'react';
2
2
  import cn from 'clsx';
3
3
  import { IconButton } from '../IconButton/IconButton.js';
4
4
  import { useLocalization } from '../Provider/Localization.js';
@@ -24,6 +24,13 @@ const Datepicker = /*#__PURE__*/forwardRef(function Datepicker(props, ref) {
24
24
  texts
25
25
  } = useLocalization();
26
26
  const className = cn('inline-flex w-full text-black font-normal', externalClassName);
27
+ const popoverContentRef = useRef(null);
28
+ const handleOpenAutofocus = useCallback(e => {
29
+ var _popoverContentRef$cu, _popoverContentRef$cu2;
30
+ e.preventDefault();
31
+ const currentDay = (_popoverContentRef$cu = popoverContentRef === null || popoverContentRef === void 0 ? void 0 : (_popoverContentRef$cu2 = popoverContentRef.current) === null || _popoverContentRef$cu2 === void 0 ? void 0 : _popoverContentRef$cu2.querySelector('table button[name="day"][aria-selected="true"]')) !== null && _popoverContentRef$cu !== void 0 ? _popoverContentRef$cu : null;
32
+ currentDay === null || currentDay === void 0 ? void 0 : currentDay.focus();
33
+ }, [popoverContentRef]);
27
34
  return /*#__PURE__*/createElement("span", {
28
35
  className: className,
29
36
  "data-taco": "datepicker",
@@ -34,10 +41,13 @@ const Datepicker = /*#__PURE__*/forwardRef(function Datepicker(props, ref) {
34
41
  disabled: input.disabled || input.readOnly,
35
42
  icon: "calendar",
36
43
  tabIndex: -1,
37
- popover: props => ( /*#__PURE__*/createElement(Popover, Object.assign({}, props), /*#__PURE__*/createElement(Popover.Content, null, ({
44
+ popover: props => ( /*#__PURE__*/createElement(Popover, Object.assign({}, props), /*#__PURE__*/createElement(Popover.Content, {
45
+ onOpenAutoFocus: handleOpenAutofocus
46
+ }, ({
38
47
  close
39
48
  }) => ( /*#__PURE__*/createElement("div", {
40
- className: "-m-3 flex"
49
+ className: '[&_button[name="day"]:focus]:yt-focus -m-3 flex',
50
+ ref: popoverContentRef
41
51
  }, /*#__PURE__*/createElement(Calendar, Object.assign({}, calendar, {
42
52
  onChange: (date, event) => {
43
53
  calendar.onChange(date, event);
@@ -1 +1 @@
1
- {"version":3,"file":"Datepicker.js","sources":["../../../../../../../src/components/Datepicker/Datepicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport { Calendar, CalendarProps } from '../Calendar/Calendar';\nimport { Input, InputProps } from '../Input/Input';\nimport { useLocalization } from '../Provider/Localization';\nimport { useDatepicker } from './useDatepicker';\nimport { IconButton } from '../IconButton/IconButton';\nimport { Popover } from '../Popover/Popover';\n\nexport type DatepickerTexts = {\n /** Aria-label for calendar */\n calendar: string;\n /** Clear button text */\n clear: string;\n /**\n * Aria-label for calendar icon button in the input.\n * Calendar will open when user clicks this icon button.\n */\n expand: string;\n /** Shortcut heading text */\n shortcuts: string;\n};\n\nexport type DatePickerShortcut = {\n onClick: (event: React.MouseEvent) => void;\n text: string;\n};\n\nexport type DatepickerProps = Omit<InputProps, 'value'> & {\n /** [Calendar](component:calendar) component associated with the DatePicker */\n calendar?: CalendarProps;\n /** List of shortcuts */\n shortcuts?: DatePickerShortcut[];\n /** Title for the shortcuts panel */\n shortcutsText?: string;\n /** Handler to be called when the clear button is clicked */\n onReset?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n /**\n * Date value of the calendar.\n * This will be displayed in DatePicker's input in the format given to the [Provider](component:provider) component\n */\n value?: Date;\n};\n\nexport const Datepicker = React.forwardRef(function Datepicker(props: DatepickerProps, ref: React.Ref<HTMLInputElement>) {\n const { className: externalClassName, onReset: handleReset, style, shortcuts, shortcutsText, ...otherProps } = props;\n const { calendar, input } = useDatepicker(otherProps, ref);\n const { texts } = useLocalization();\n const className = cn('inline-flex w-full text-black font-normal', externalClassName);\n\n return (\n <span className={className} data-taco=\"datepicker\" style={style}>\n <Input\n {...input}\n button={\n input.readOnly ? undefined : (\n <IconButton\n aria-label={texts.datepicker.expand}\n disabled={input.disabled || input.readOnly}\n icon=\"calendar\"\n tabIndex={-1}\n popover={props => (\n <Popover {...props}>\n <Popover.Content>\n {({ close }) => (\n <div className=\"-m-3 flex\">\n <Calendar\n {...calendar}\n onChange={(date: Date, event?: React.MouseEvent<Element>) => {\n calendar.onChange(date, event);\n close();\n }}\n />\n {shortcuts && (\n <div className=\"border-grey-300 flex flex-col border-l\">\n <span className=\"m-4 mb-3 flex h-8 w-32 items-center text-xs font-semibold\">\n {shortcutsText ?? texts.datepicker.shortcuts}\n </span>\n <ul>\n {shortcuts.map(shortcut => (\n <li key={shortcut.text}>\n <button\n type=\"button\"\n className=\"hover:wcag-grey-200 flex w-full items-start px-4 py-1 text-xs\"\n onClick={event => {\n event.persist();\n shortcut.onClick(event);\n close();\n }}>\n {shortcut.text}\n </button>\n </li>\n ))}\n </ul>\n {handleReset && (\n <button\n type=\"button\"\n className=\"mx-auto my-4 mt-auto inline-flex cursor-pointer border-none bg-transparent text-xs text-blue-500 hover:text-blue-300\"\n onClick={event => {\n event.persist();\n handleReset(event);\n close();\n }}>\n {texts.datepicker.clear}\n </button>\n )}\n </div>\n )}\n </div>\n )}\n </Popover.Content>\n </Popover>\n )}\n tooltip={texts.datepicker.calendar}\n />\n )\n }\n />\n </span>\n );\n});\nDatepicker.displayName = 'Datepicker';\n"],"names":["Datepicker","React","props","ref","className","externalClassName","onReset","handleReset","style","shortcuts","shortcutsText","otherProps","calendar","input","useDatepicker","texts","useLocalization","cn","Input","button","readOnly","undefined","IconButton","datepicker","expand","disabled","icon","tabIndex","popover","Popover","Content","close","Calendar","onChange","date","event","map","shortcut","key","text","type","onClick","persist","clear","tooltip","displayName"],"mappings":";;;;;;;;;MA4CaA,UAAU,gBAAGC,UAAgB,CAAC,SAASD,UAAUA,CAACE,KAAsB,EAAEC,GAAgC;EACnH,MAAM;IAAEC,SAAS,EAAEC,iBAAiB;IAAEC,OAAO,EAAEC,WAAW;IAAEC,KAAK;IAAEC,SAAS;IAAEC,aAAa;IAAE,GAAGC;GAAY,GAAGT,KAAK;EACpH,MAAM;IAAEU,QAAQ;IAAEC;GAAO,GAAGC,aAAa,CAACH,UAAU,EAAER,GAAG,CAAC;EAC1D,MAAM;IAAEY;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAMZ,SAAS,GAAGa,EAAE,CAAC,2CAA2C,EAAEZ,iBAAiB,CAAC;EAEpF,oBACIJ;IAAMG,SAAS,EAAEA,SAAS;iBAAY,YAAY;IAACI,KAAK,EAAEA;kBACtDP,cAACiB,KAAK,oBACEL,KAAK;IACTM,MAAM,EACFN,KAAK,CAACO,QAAQ,GAAGC,SAAS,kBACtBpB,cAACqB,UAAU;oBACKP,KAAK,CAACQ,UAAU,CAACC,MAAM;MACnCC,QAAQ,EAAEZ,KAAK,CAACY,QAAQ,IAAIZ,KAAK,CAACO,QAAQ;MAC1CM,IAAI,EAAC,UAAU;MACfC,QAAQ,EAAE,CAAC,CAAC;MACZC,OAAO,EAAE1B,KAAK,mBACVD,cAAC4B,OAAO,oBAAK3B,KAAK,gBACdD,cAAC4B,OAAO,CAACC,OAAO,QACX,CAAC;QAAEC;OAAO,oBACP9B;QAAKG,SAAS,EAAC;sBACXH,cAAC+B,QAAQ,oBACDpB,QAAQ;QACZqB,QAAQ,EAAEA,CAACC,IAAU,EAAEC,KAAiC;UACpDvB,QAAQ,CAACqB,QAAQ,CAACC,IAAI,EAAEC,KAAK,CAAC;UAC9BJ,KAAK,EAAE;;SAEb,EACDtB,SAAS,mBACNR;QAAKG,SAAS,EAAC;sBACXH;QAAMG,SAAS,EAAC;SACXM,aAAa,aAAbA,aAAa,cAAbA,aAAa,GAAIK,KAAK,CAACQ,UAAU,CAACd,SAAS,CACzC,eACPR,0BACKQ,SAAS,CAAC2B,GAAG,CAACC,QAAQ,mBACnBpC;QAAIqC,GAAG,EAAED,QAAQ,CAACE;sBACdtC;QACIuC,IAAI,EAAC,QAAQ;QACbpC,SAAS,EAAC,+DAA+D;QACzEqC,OAAO,EAAEN,KAAK;UACVA,KAAK,CAACO,OAAO,EAAE;UACfL,QAAQ,CAACI,OAAO,CAACN,KAAK,CAAC;UACvBJ,KAAK,EAAE;;SAEVM,QAAQ,CAACE,IAAI,CACT,CACR,CACR,CAAC,CACD,EACJhC,WAAW,mBACRN;QACIuC,IAAI,EAAC,QAAQ;QACbpC,SAAS,EAAC,sHAAsH;QAChIqC,OAAO,EAAEN,KAAK;UACVA,KAAK,CAACO,OAAO,EAAE;UACfnC,WAAW,CAAC4B,KAAK,CAAC;UAClBJ,KAAK,EAAE;;SAEVhB,KAAK,CAACQ,UAAU,CAACoB,KAAK,CAClB,CACZ,CACC,CACT,CACC,CACT,CACa,CACZ,CACb;MACDC,OAAO,EAAE7B,KAAK,CAACQ,UAAU,CAACX;MAC5B;KAGZ,CACC;AAEf,CAAC;AACDZ,UAAU,CAAC6C,WAAW,GAAG,YAAY;;;;"}
1
+ {"version":3,"file":"Datepicker.js","sources":["../../../../../../../src/components/Datepicker/Datepicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport { Calendar, CalendarProps } from '../Calendar/Calendar';\nimport { Input, InputProps } from '../Input/Input';\nimport { useLocalization } from '../Provider/Localization';\nimport { useDatepicker } from './useDatepicker';\nimport { IconButton } from '../IconButton/IconButton';\nimport { Popover } from '../Popover/Popover';\n\nexport type DatepickerTexts = {\n /** Aria-label for calendar */\n calendar: string;\n /** Clear button text */\n clear: string;\n /**\n * Aria-label for calendar icon button in the input.\n * Calendar will open when user clicks this icon button.\n */\n expand: string;\n /** Shortcut heading text */\n shortcuts: string;\n};\n\nexport type DatePickerShortcut = {\n onClick: (event: React.MouseEvent) => void;\n text: string;\n};\n\nexport type DatepickerProps = Omit<InputProps, 'value'> & {\n /** [Calendar](component:calendar) component associated with the DatePicker */\n calendar?: CalendarProps;\n /** List of shortcuts */\n shortcuts?: DatePickerShortcut[];\n /** Title for the shortcuts panel */\n shortcutsText?: string;\n /** Handler to be called when the clear button is clicked */\n onReset?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n /**\n * Date value of the calendar.\n * This will be displayed in DatePicker's input in the format given to the [Provider](component:provider) component\n */\n value?: Date;\n};\n\nexport const Datepicker = React.forwardRef(function Datepicker(props: DatepickerProps, ref: React.Ref<HTMLInputElement>) {\n const { className: externalClassName, onReset: handleReset, style, shortcuts, shortcutsText, ...otherProps } = props;\n const { calendar, input } = useDatepicker(otherProps, ref);\n const { texts } = useLocalization();\n const className = cn('inline-flex w-full text-black font-normal', externalClassName);\n\n const popoverContentRef = React.useRef<HTMLDivElement>(null);\n const handleOpenAutofocus = React.useCallback(\n (e: Event) => {\n e.preventDefault();\n\n const currentDay: HTMLButtonElement | null =\n popoverContentRef?.current?.querySelector('table button[name=\"day\"][aria-selected=\"true\"]') ?? null;\n currentDay?.focus();\n },\n [popoverContentRef]\n );\n\n return (\n <span className={className} data-taco=\"datepicker\" style={style}>\n <Input\n {...input}\n button={\n input.readOnly ? undefined : (\n <IconButton\n aria-label={texts.datepicker.expand}\n disabled={input.disabled || input.readOnly}\n icon=\"calendar\"\n tabIndex={-1}\n popover={props => (\n <Popover {...props}>\n <Popover.Content onOpenAutoFocus={handleOpenAutofocus}>\n {({ close }) => (\n <div\n className='[&_button[name=\"day\"]:focus]:yt-focus -m-3 flex'\n ref={popoverContentRef}>\n <Calendar\n {...calendar}\n onChange={(date: Date, event?: React.MouseEvent<Element>) => {\n calendar.onChange(date, event);\n close();\n }}\n />\n {shortcuts && (\n <div className=\"border-grey-300 flex flex-col border-l\">\n <span className=\"m-4 mb-3 flex h-8 w-32 items-center text-xs font-semibold\">\n {shortcutsText ?? texts.datepicker.shortcuts}\n </span>\n <ul>\n {shortcuts.map(shortcut => (\n <li key={shortcut.text}>\n <button\n type=\"button\"\n className=\"hover:wcag-grey-200 flex w-full items-start px-4 py-1 text-xs\"\n onClick={event => {\n event.persist();\n shortcut.onClick(event);\n close();\n }}>\n {shortcut.text}\n </button>\n </li>\n ))}\n </ul>\n {handleReset && (\n <button\n type=\"button\"\n className=\"mx-auto my-4 mt-auto inline-flex cursor-pointer border-none bg-transparent text-xs text-blue-500 hover:text-blue-300\"\n onClick={event => {\n event.persist();\n handleReset(event);\n close();\n }}>\n {texts.datepicker.clear}\n </button>\n )}\n </div>\n )}\n </div>\n )}\n </Popover.Content>\n </Popover>\n )}\n tooltip={texts.datepicker.calendar}\n />\n )\n }\n />\n </span>\n );\n});\nDatepicker.displayName = 'Datepicker';\n"],"names":["Datepicker","React","props","ref","className","externalClassName","onReset","handleReset","style","shortcuts","shortcutsText","otherProps","calendar","input","useDatepicker","texts","useLocalization","cn","popoverContentRef","handleOpenAutofocus","e","preventDefault","currentDay","_popoverContentRef$cu","_popoverContentRef$cu2","current","querySelector","focus","Input","button","readOnly","undefined","IconButton","datepicker","expand","disabled","icon","tabIndex","popover","Popover","Content","onOpenAutoFocus","close","Calendar","onChange","date","event","map","shortcut","key","text","type","onClick","persist","clear","tooltip","displayName"],"mappings":"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"}
@@ -4,6 +4,7 @@ import { createContext, useContext } from 'react';
4
4
  const DrawerContext = /*#__PURE__*/createContext({
5
5
  closeOnEscape: true,
6
6
  showCloseButton: true,
7
+ onClickBack: () => {},
7
8
  onClose: () => {},
8
9
  onResize: () => {},
9
10
  props: {},
@@ -1 +1 @@
1
- {"version":3,"file":"Context.js","sources":["../../../../../../../src/components/Drawer/Context.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-empty-function */\nimport * as React from 'react';\nimport { DrawerSize, DrawerVariant } from './types';\n\nexport type DrawerContext = {\n closeOnEscape: boolean;\n showCloseButton: boolean;\n onClose?: () => void;\n onResize?: (delta: number) => void;\n props: {};\n ref: React.Ref<HTMLElement>;\n size: DrawerSize;\n open?: boolean;\n setOpen?: (open: boolean) => void;\n variant: DrawerVariant;\n focusTrap?: boolean;\n outlet?: HTMLElement;\n};\n\nexport const DrawerContext = React.createContext<DrawerContext>({\n closeOnEscape: true,\n showCloseButton: true,\n onClose: () => {},\n onResize: () => {},\n props: {},\n ref: null,\n size: 'md',\n variant: 'embedded',\n});\n\nexport const useCurrentDrawer = () => {\n return React.useContext(DrawerContext);\n};\n"],"names":["DrawerContext","React","closeOnEscape","showCloseButton","onClose","onResize","props","ref","size","variant","useCurrentDrawer"],"mappings":";;AAAA;MAmBaA,aAAa,gBAAGC,aAAmB,CAAgB;EAC5DC,aAAa,EAAE,IAAI;EACnBC,eAAe,EAAE,IAAI;EACrBC,OAAO,EAAEA,QAAQ;EACjBC,QAAQ,EAAEA,QAAQ;EAClBC,KAAK,EAAE,EAAE;EACTC,GAAG,EAAE,IAAI;EACTC,IAAI,EAAE,IAAI;EACVC,OAAO,EAAE;CACZ;MAEYC,gBAAgB,GAAGA;EAC5B,OAAOT,UAAgB,CAACD,aAAa,CAAC;AAC1C;;;;"}
1
+ {"version":3,"file":"Context.js","sources":["../../../../../../../src/components/Drawer/Context.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-empty-function */\nimport * as React from 'react';\nimport { DrawerSize, DrawerVariant } from './types';\n\nexport type DrawerContext = {\n closeOnEscape: boolean;\n showCloseButton: boolean;\n onClickBack?: () => void;\n onClose?: () => void;\n onResize?: (delta: number) => void;\n props: {};\n ref: React.Ref<HTMLElement>;\n size: DrawerSize;\n open?: boolean;\n setOpen?: (open: boolean) => void;\n variant: DrawerVariant;\n focusTrap?: boolean;\n outlet?: HTMLElement;\n};\n\nexport const DrawerContext = React.createContext<DrawerContext>({\n closeOnEscape: true,\n showCloseButton: true,\n onClickBack: () => {},\n onClose: () => {},\n onResize: () => {},\n props: {},\n ref: null,\n size: 'md',\n variant: 'embedded',\n});\n\nexport const useCurrentDrawer = () => {\n return React.useContext(DrawerContext);\n};\n"],"names":["DrawerContext","React","closeOnEscape","showCloseButton","onClickBack","onClose","onResize","props","ref","size","variant","useCurrentDrawer"],"mappings":";;AAAA;MAoBaA,aAAa,gBAAGC,aAAmB,CAAgB;EAC5DC,aAAa,EAAE,IAAI;EACnBC,eAAe,EAAE,IAAI;EACrBC,WAAW,EAAEA,QAAQ;EACrBC,OAAO,EAAEA,QAAQ;EACjBC,QAAQ,EAAEA,QAAQ;EAClBC,KAAK,EAAE,EAAE;EACTC,GAAG,EAAE,IAAI;EACTC,IAAI,EAAE,IAAI;EACVC,OAAO,EAAE;CACZ;MAEYC,gBAAgB,GAAGA;EAC5B,OAAOV,UAAgB,CAACD,aAAa,CAAC;AAC1C;;;;"}
@@ -32,6 +32,7 @@ const Drawer = /*#__PURE__*/forwardRef(function Drawer(props, ref) {
32
32
  closeOnEscape = true,
33
33
  onResize,
34
34
  onClose,
35
+ onClickBack,
35
36
  size = 'md',
36
37
  trigger,
37
38
  children,
@@ -48,6 +49,7 @@ const Drawer = /*#__PURE__*/forwardRef(function Drawer(props, ref) {
48
49
  const [outlet, setOutlet] = useState();
49
50
  const context = useMemo(() => ({
50
51
  closeOnEscape,
52
+ onClickBack,
51
53
  onClose,
52
54
  onResize,
53
55
  props: otherProps,
@@ -59,7 +61,7 @@ const Drawer = /*#__PURE__*/forwardRef(function Drawer(props, ref) {
59
61
  focusTrap,
60
62
  showCloseButton,
61
63
  outlet
62
- }), [closeOnEscape, open, setOpen, otherProps, variant, onResize, onClose, size, focusTrap, showCloseButton, outlet]);
64
+ }), [closeOnEscape, open, setOpen, otherProps, variant, onResize, onClose, size, focusTrap, showCloseButton, outlet, onClickBack]);
63
65
  // this prevents two drawers being open at once and used when one drawer getting opened before another one got closed.
64
66
  const close = useCallback(() => {
65
67
  setOpen(false);
@@ -1 +1 @@
1
- {"version":3,"file":"Drawer.js","sources":["../../../../../../../src/components/Drawer/Drawer.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n Actions,\n Footer,\n InnerContent,\n DrawerInnerContentProps,\n DrawerFooterProps,\n DrawerTitleProps,\n Title,\n Close,\n Content,\n DrawerContentProps,\n DrawerCloseProps,\n} from './components/Content';\nimport { GroupProps } from '../Group/Group';\nimport { DialogProps } from '../Dialog/Dialog';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport cn from 'clsx';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { DrawerTriggerProps, Trigger } from './components/Trigger';\nimport { DrawerContext } from './Context';\nimport { DrawerSize, DrawerVariant } from './types';\n\nexport type DrawerTexts = {\n /**\n * Aria-label for close icon button in drawer.\n */\n close: string;\n};\n\nexport type DrawerProps = Omit<DialogProps, 'draggable' | 'size'> & {\n children: React.ReactNode | React.ReactNode[];\n /** Size of the drawer. This is the recommended way to set a size for drawer component. */\n size?: DrawerSize;\n /** When `true`, pressing escape will close the drawer */\n closeOnEscape?: boolean;\n /** Set whether the drawer is open by default or not, use when not providing a trigger */\n defaultOpen?: boolean;\n /** Handler called when drawer closes by user interaction */\n onClose?: () => void;\n /** Called when the drawer opens or closes, must be used in conjunction with open */\n onChange?: (open: boolean | undefined) => void;\n /** Control the open state of the drawer from outside the component */\n open?: boolean;\n /** A trigger to be used for the drawer, should not be set if `children` already contains a trigger */\n trigger?: JSX.Element;\n /** Triggers when resizing, can be throttled or debounced for better performances */\n onResize?: (delta: number) => void;\n /** Rendering variant of the drawer */\n variant?: DrawerVariant;\n /** className for children container, needed for embedded version, in cases where we might need to control children height */\n className?: string;\n /** When 'true' preventing focus from leaving drawer content */\n focusTrap?: boolean;\n /** When 'true' renders close button in topr right cornenr of drawer content */\n showCloseButton?: boolean;\n /** Target specific named outlet allowing you to render a drawer to a specific outlet */\n outletName?: string;\n};\n\nexport type OutletProps = React.HTMLAttributes<HTMLDivElement> & {\n name?: string;\n};\n\nconst DEFAULT_OUTLET_NAME = 'default';\n\nconst Outlet = React.forwardRef(function Outlet(props: OutletProps, ref: React.Ref<HTMLDivElement>) {\n const className = cn('h-full ml-auto overflow-hidden flex-shrink-0', props.className);\n return (\n <div\n {...props}\n className={className}\n data-taco=\"drawer-outlet\"\n data-taco-outlet-name={props.name ?? DEFAULT_OUTLET_NAME}\n ref={ref}\n />\n );\n});\n\n// drawerStack getting set by previous drawer instance, to be able to close previous instance, when new instance getting opened.\nlet drawerStack: undefined | (() => void);\n\nexport type ForwardedDrawerWithStatics = React.ForwardRefExoticComponent<DrawerProps & React.RefAttributes<HTMLElement>> & {\n Trigger: React.ForwardRefExoticComponent<DrawerTriggerProps & React.RefAttributes<HTMLButtonElement>>;\n Content: React.ForwardRefExoticComponent<DrawerContentProps & React.RefAttributes<HTMLDivElement>>;\n InnerContent: React.ForwardRefExoticComponent<DrawerInnerContentProps & React.RefAttributes<HTMLDivElement>>;\n Title: React.ForwardRefExoticComponent<DrawerTitleProps & React.RefAttributes<HTMLHeadingElement>>;\n Footer: React.ForwardRefExoticComponent<DrawerFooterProps & React.RefAttributes<HTMLDivElement>>;\n Close: React.ForwardRefExoticComponent<DrawerCloseProps & React.RefAttributes<HTMLButtonElement>>;\n Actions: React.ForwardRefExoticComponent<GroupProps & React.RefAttributes<HTMLDivElement>>;\n Outlet: React.ForwardRefExoticComponent<OutletProps & React.RefAttributes<HTMLDivElement>>;\n};\n\nexport const Drawer = React.forwardRef(function Drawer(props: DrawerProps, ref: React.Ref<HTMLElement>) {\n const {\n open: openProp,\n defaultOpen: defaultOpenProp,\n // if onChange is not provided, then replace it with empty function, needed for useControllableState\n onChange = () => {\n // do nothing.\n },\n variant = 'embedded',\n className,\n closeOnEscape = true,\n onResize,\n onClose,\n size = 'md',\n trigger,\n children,\n focusTrap = props.focusTrap === undefined && props.variant === 'overlay' ? true : props.focusTrap,\n showCloseButton = true,\n outletName,\n ...otherProps\n } = props;\n\n const [open, setOpen] = useControllableState<boolean | undefined>({\n prop: openProp,\n defaultProp: defaultOpenProp,\n onChange,\n });\n\n const [outlet, setOutlet] = React.useState<HTMLElement>();\n\n const context = React.useMemo(\n () => ({\n closeOnEscape,\n onClose,\n onResize,\n props: otherProps,\n size,\n ref,\n open,\n setOpen,\n variant,\n focusTrap,\n showCloseButton,\n outlet,\n }),\n [closeOnEscape, open, setOpen, otherProps, variant, onResize, onClose, size, focusTrap, showCloseButton, outlet]\n );\n\n // this prevents two drawers being open at once and used when one drawer getting opened before another one got closed.\n const close = React.useCallback(() => {\n setOpen(false);\n onClose && onClose();\n }, []);\n\n React.useEffect(() => {\n const outletSelector = `[data-taco=\"drawer-outlet\"][data-taco-outlet-name=\"${outletName ?? DEFAULT_OUTLET_NAME}\"]`;\n const outletElement = document.querySelector<HTMLElement>(outletSelector) ?? document.body;\n setOutlet(outletElement);\n }, [outletName]);\n\n React.useEffect(() => {\n if (open) {\n // if drawerStack is defined, this means that another drawer was opened before\n if (drawerStack) {\n drawerStack();\n }\n drawerStack = close;\n } else {\n // if drawerStack is equal to current close callback,\n // this means that drawer getting closed completely instead of getting closed on re-open\n if (drawerStack === close) {\n drawerStack = undefined;\n }\n }\n }, [open]);\n\n return (\n <DrawerContext.Provider value={context}>\n <DialogPrimitive.Root modal={variant === 'overlay' ? true : false} open={open} onOpenChange={setOpen}>\n {trigger && <Trigger>{trigger}</Trigger>}\n {children}\n </DialogPrimitive.Root>\n </DrawerContext.Provider>\n );\n}) as ForwardedDrawerWithStatics;\n\nDrawer.Trigger = Trigger;\nDrawer.Content = Content;\nDrawer.InnerContent = InnerContent;\nDrawer.Title = Title;\nDrawer.Footer = Footer;\nDrawer.Close = Close;\nDrawer.Actions = Actions;\nDrawer.Outlet = Outlet;\n"],"names":["DEFAULT_OUTLET_NAME","Outlet","React","props","ref","className","cn","name","_props$name","drawerStack","Drawer","open","openProp","defaultOpen","defaultOpenProp","onChange","variant","closeOnEscape","onResize","onClose","size","trigger","children","focusTrap","undefined","showCloseButton","outletName","otherProps","setOpen","useControllableState","prop","defaultProp","outlet","setOutlet","context","close","outletSelector","outletElement","_document$querySelect","document","querySelector","body","DrawerContext","Provider","value","DialogPrimitive","modal","onOpenChange","Trigger","Content","InnerContent","Title","Footer","Close","Actions"],"mappings":"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"}
1
+ {"version":3,"file":"Drawer.js","sources":["../../../../../../../src/components/Drawer/Drawer.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n Actions,\n Footer,\n InnerContent,\n DrawerInnerContentProps,\n DrawerFooterProps,\n DrawerTitleProps,\n Title,\n Close,\n Content,\n DrawerContentProps,\n DrawerCloseProps,\n} from './components/Content';\nimport { GroupProps } from '../Group/Group';\nimport { DialogProps } from '../Dialog/Dialog';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport cn from 'clsx';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { DrawerTriggerProps, Trigger } from './components/Trigger';\nimport { DrawerContext } from './Context';\nimport { DrawerSize, DrawerVariant } from './types';\n\nexport type DrawerTexts = {\n /**\n * Aria-label for back icon button in drawer.\n */\n back: string;\n /**\n * Aria-label for close icon button in drawer.\n */\n close: string;\n};\n\nexport type DrawerProps = Omit<DialogProps, 'draggable' | 'size'> & {\n children: React.ReactNode | React.ReactNode[];\n /** Size of the drawer. This is the recommended way to set a size for drawer component. */\n size?: DrawerSize;\n /** When `true`, pressing escape will close the drawer */\n closeOnEscape?: boolean;\n /** Set whether the drawer is open by default or not, use when not providing a trigger */\n defaultOpen?: boolean;\n /** Handles the back button click and determines its visibility */\n onClickBack?: () => void;\n /** Handler called when drawer closes by user interaction */\n onClose?: () => void;\n /** Called when the drawer opens or closes, must be used in conjunction with open */\n onChange?: (open: boolean | undefined) => void;\n /** Control the open state of the drawer from outside the component */\n open?: boolean;\n /** A trigger to be used for the drawer, should not be set if `children` already contains a trigger */\n trigger?: JSX.Element;\n /** Triggers when resizing, can be throttled or debounced for better performances */\n onResize?: (delta: number) => void;\n /** Rendering variant of the drawer */\n variant?: DrawerVariant;\n /** className for children container, needed for embedded version, in cases where we might need to control children height */\n className?: string;\n /** When 'true' preventing focus from leaving drawer content */\n focusTrap?: boolean;\n /** When 'true' renders close button in topr right cornenr of drawer content */\n showCloseButton?: boolean;\n /** Target specific named outlet allowing you to render a drawer to a specific outlet */\n outletName?: string;\n};\n\nexport type OutletProps = React.HTMLAttributes<HTMLDivElement> & {\n name?: string;\n};\n\nconst DEFAULT_OUTLET_NAME = 'default';\n\nconst Outlet = React.forwardRef(function Outlet(props: OutletProps, ref: React.Ref<HTMLDivElement>) {\n const className = cn('h-full ml-auto overflow-hidden flex-shrink-0', props.className);\n return (\n <div\n {...props}\n className={className}\n data-taco=\"drawer-outlet\"\n data-taco-outlet-name={props.name ?? DEFAULT_OUTLET_NAME}\n ref={ref}\n />\n );\n});\n\n// drawerStack getting set by previous drawer instance, to be able to close previous instance, when new instance getting opened.\nlet drawerStack: undefined | (() => void);\n\nexport type ForwardedDrawerWithStatics = React.ForwardRefExoticComponent<DrawerProps & React.RefAttributes<HTMLElement>> & {\n Trigger: React.ForwardRefExoticComponent<DrawerTriggerProps & React.RefAttributes<HTMLButtonElement>>;\n Content: React.ForwardRefExoticComponent<DrawerContentProps & React.RefAttributes<HTMLDivElement>>;\n InnerContent: React.ForwardRefExoticComponent<DrawerInnerContentProps & React.RefAttributes<HTMLDivElement>>;\n Title: React.ForwardRefExoticComponent<DrawerTitleProps & React.RefAttributes<HTMLHeadingElement>>;\n Footer: React.ForwardRefExoticComponent<DrawerFooterProps & React.RefAttributes<HTMLDivElement>>;\n Close: React.ForwardRefExoticComponent<DrawerCloseProps & React.RefAttributes<HTMLButtonElement>>;\n Actions: React.ForwardRefExoticComponent<GroupProps & React.RefAttributes<HTMLDivElement>>;\n Outlet: React.ForwardRefExoticComponent<OutletProps & React.RefAttributes<HTMLDivElement>>;\n};\n\nexport const Drawer = React.forwardRef(function Drawer(props: DrawerProps, ref: React.Ref<HTMLElement>) {\n const {\n open: openProp,\n defaultOpen: defaultOpenProp,\n // if onChange is not provided, then replace it with empty function, needed for useControllableState\n onChange = () => {\n // do nothing.\n },\n variant = 'embedded',\n className,\n closeOnEscape = true,\n onResize,\n onClose,\n onClickBack,\n size = 'md',\n trigger,\n children,\n focusTrap = props.focusTrap === undefined && props.variant === 'overlay' ? true : props.focusTrap,\n showCloseButton = true,\n outletName,\n ...otherProps\n } = props;\n\n const [open, setOpen] = useControllableState<boolean | undefined>({\n prop: openProp,\n defaultProp: defaultOpenProp,\n onChange,\n });\n\n const [outlet, setOutlet] = React.useState<HTMLElement>();\n\n const context = React.useMemo(\n () => ({\n closeOnEscape,\n onClickBack,\n onClose,\n onResize,\n props: otherProps,\n size,\n ref,\n open,\n setOpen,\n variant,\n focusTrap,\n showCloseButton,\n outlet,\n }),\n [\n closeOnEscape,\n open,\n setOpen,\n otherProps,\n variant,\n onResize,\n onClose,\n size,\n focusTrap,\n showCloseButton,\n outlet,\n onClickBack,\n ]\n );\n\n // this prevents two drawers being open at once and used when one drawer getting opened before another one got closed.\n const close = React.useCallback(() => {\n setOpen(false);\n onClose && onClose();\n }, []);\n\n React.useEffect(() => {\n const outletSelector = `[data-taco=\"drawer-outlet\"][data-taco-outlet-name=\"${outletName ?? DEFAULT_OUTLET_NAME}\"]`;\n const outletElement = document.querySelector<HTMLElement>(outletSelector) ?? document.body;\n setOutlet(outletElement);\n }, [outletName]);\n\n React.useEffect(() => {\n if (open) {\n // if drawerStack is defined, this means that another drawer was opened before\n if (drawerStack) {\n drawerStack();\n }\n drawerStack = close;\n } else {\n // if drawerStack is equal to current close callback,\n // this means that drawer getting closed completely instead of getting closed on re-open\n if (drawerStack === close) {\n drawerStack = undefined;\n }\n }\n }, [open]);\n\n return (\n <DrawerContext.Provider value={context}>\n <DialogPrimitive.Root modal={variant === 'overlay' ? true : false} open={open} onOpenChange={setOpen}>\n {trigger && <Trigger>{trigger}</Trigger>}\n {children}\n </DialogPrimitive.Root>\n </DrawerContext.Provider>\n );\n}) as ForwardedDrawerWithStatics;\n\nDrawer.Trigger = Trigger;\nDrawer.Content = Content;\nDrawer.InnerContent = InnerContent;\nDrawer.Title = Title;\nDrawer.Footer = Footer;\nDrawer.Close = Close;\nDrawer.Actions = Actions;\nDrawer.Outlet = Outlet;\n"],"names":["DEFAULT_OUTLET_NAME","Outlet","React","props","ref","className","cn","name","_props$name","drawerStack","Drawer","open","openProp","defaultOpen","defaultOpenProp","onChange","variant","closeOnEscape","onResize","onClose","onClickBack","size","trigger","children","focusTrap","undefined","showCloseButton","outletName","otherProps","setOpen","useControllableState","prop","defaultProp","outlet","setOutlet","context","close","outletSelector","outletElement","_document$querySelect","document","querySelector","body","DrawerContext","Provider","value","DialogPrimitive","modal","onOpenChange","Trigger","Content","InnerContent","Title","Footer","Close","Actions"],"mappings":"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"}
@@ -35,24 +35,55 @@ const RenderPropWrapper = /*#__PURE__*/React__default.forwardRef(function Render
35
35
  ...renderProps
36
36
  });
37
37
  });
38
- const Title = /*#__PURE__*/React__default.forwardRef(function DrawerTitle(props, ref) {
38
+ const Title = /*#__PURE__*/React__default.forwardRef(function DrawerTitle(props, externalRef) {
39
39
  const {
40
40
  className,
41
41
  children,
42
42
  ...otherProps
43
43
  } = props;
44
+ const ref = useMergedRef(externalRef);
45
+ const [style, setStyle] = React__default.useState({});
46
+ const {
47
+ texts
48
+ } = useLocalization();
49
+ const {
50
+ onClickBack
51
+ } = useCurrentDrawer();
44
52
  /**
45
53
  * By design in default drawer version Title has grey separator, but we might have exceptions like Drawer + Tabs scenario,
46
- * where we might want to hide the grey separator. For this reason separator was rendedr with using of classNames,
47
- * so it can be easily overriden in exceptional scenarious.
54
+ * where we might want to hide the grey separator. For this reason separator was rendered with using of classNames,
55
+ * so it can be easily overriden in exceptional scenarios.
48
56
  * */
49
- const cName = cn('grow-0 py-4 pl-4 justify-self-start mb-0 border-b-[1px] border-grey-300 flex items-center', className);
57
+ const cName = cn('grow-0 py-4 px-4 justify-self-start mb-0 border-b-[1px] border-grey-300 flex items-start', className);
58
+ React__default.useEffect(() => {
59
+ var _ref$current, _drawer$querySelector, _closeButton$offsetWi, _drawer$querySelector2, _actionsWrapper$offse;
60
+ const drawer = ref === null || ref === void 0 ? void 0 : (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.closest('[data-taco="drawer"]');
61
+ // This is the margin amount that we need to deduct from the margins to align with the design
62
+ const marginAdjust = 4;
63
+ const closeButton = (_drawer$querySelector = drawer === null || drawer === void 0 ? void 0 : drawer.querySelector(`[aria-label="${texts.drawer.close}"]`)) !== null && _drawer$querySelector !== void 0 ? _drawer$querySelector : null;
64
+ const closeButtonWidth = (_closeButton$offsetWi = closeButton === null || closeButton === void 0 ? void 0 : closeButton.offsetWidth) !== null && _closeButton$offsetWi !== void 0 ? _closeButton$offsetWi : 0;
65
+ const closeButtonRightMargin = 8;
66
+ const actionsWrapper = (_drawer$querySelector2 = drawer === null || drawer === void 0 ? void 0 : drawer.querySelector(`#taco-drawer-actions[data-taco="group"]`)) !== null && _drawer$querySelector2 !== void 0 ? _drawer$querySelector2 : null;
67
+ const actionsWrapperWidth = (_actionsWrapper$offse = actionsWrapper === null || actionsWrapper === void 0 ? void 0 : actionsWrapper.offsetWidth) !== null && _actionsWrapper$offse !== void 0 ? _actionsWrapper$offse : 0;
68
+ const actionsWrapperRightMargin = 8;
69
+ const marginRight = closeButtonWidth + actionsWrapperWidth + closeButtonRightMargin + actionsWrapperRightMargin - marginAdjust;
70
+ setStyle({
71
+ marginRight
72
+ });
73
+ }, [ref, texts.drawer.close]);
50
74
  return /*#__PURE__*/React__default.createElement(Title$1, Object.assign({
51
75
  className: cName
52
76
  }, otherProps, {
53
77
  ref: ref
54
- }), /*#__PURE__*/React__default.createElement("span", {
55
- className: "line-clamp-2 inline-block w-4/6 overflow-y-hidden"
78
+ }), onClickBack ? ( /*#__PURE__*/React__default.createElement(IconButton, {
79
+ appearance: "discrete",
80
+ "aria-label": texts.drawer.back,
81
+ className: "mr-3 text-base",
82
+ icon: "chevron-left",
83
+ onClick: onClickBack
84
+ })) : null, /*#__PURE__*/React__default.createElement("span", {
85
+ className: "line-clamp-2 inline-block overflow-y-hidden",
86
+ style: style
56
87
  }, children));
57
88
  });
58
89
  const Footer = /*#__PURE__*/React__default.forwardRef(function DrawerFooter(props, ref) {
@@ -75,8 +106,10 @@ const Actions = /*#__PURE__*/React__default.forwardRef(function Actions(props, r
75
106
  ...otherProps
76
107
  } = props;
77
108
  const cName = cn('absolute top-0 right-10 mr-[8px] mt-4', className);
109
+ // Id is added to identify the actions wrapper inside a useEffect in Dialog.Title
78
110
  return /*#__PURE__*/React__default.createElement(Group, Object.assign({}, otherProps, {
79
111
  className: cName,
112
+ id: "taco-drawer-actions",
80
113
  ref: ref
81
114
  }));
82
115
  });
@@ -190,8 +223,8 @@ const DrawerContent = /*#__PURE__*/React__default.forwardRef(function Content(pr
190
223
  };
191
224
  }, [size, variant, open]);
192
225
  const handleEscapeKeyDown = event => {
193
- var _ref$current;
194
- const isTargetInsideDrawerContent = (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.contains(event.target);
226
+ var _ref$current2;
227
+ const isTargetInsideDrawerContent = (_ref$current2 = ref.current) === null || _ref$current2 === void 0 ? void 0 : _ref$current2.contains(event.target);
195
228
  if (isTargetInsideDrawerContent) {
196
229
  if (!closeOnEscape) {
197
230
  event.preventDefault();
@@ -1 +1 @@
1
- {"version":3,"file":"Content.js","sources":["../../../../../../../../src/components/Drawer/components/Content.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { Group, GroupProps } from '../../Group/Group';\nimport { IconButton } from '../../IconButton/IconButton';\nimport { useLocalization } from '../../Provider/Localization';\nimport { Backdrop } from '../../Backdrop/Backdrop';\nimport { useCurrentMenu } from '../../Menu/Context';\nimport { useCurrentDrawer } from '../Context';\nimport {\n getBackdropClassNames,\n getDrawerContainerClassNames,\n getDrawerContentClassNames,\n getDrawerDragHandlerClassNames,\n} from '../util';\nimport { useDraggable } from '../../../utils/hooks/useDraggable';\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport { FocusScope } from '@react-aria/focus';\nimport { ScrollArea } from '../../ScrollArea/ScrollArea';\nimport { useGlobalKeyDown } from '../../../hooks/useGlobalKeyDown';\n\nconst RESIZE_MIN = 360;\nconst RESIZE_MAX = 1000;\n\nexport type DrawerContentRenderProps = {\n close: () => void;\n};\n\nexport enum DrawerAnimationDefinition {\n Visible = 'visible',\n Hidden = 'hidden',\n}\n\nconst RenderPropWrapper = React.forwardRef(function RenderPropWrapper({ children, onClick, renderProps }: any, ref) {\n const close = () => {\n onClick(new CustomEvent('close'));\n };\n\n return children({ close, ref, ...renderProps });\n});\n\nexport type DrawerTitleProps = React.HTMLAttributes<HTMLHeadingElement>;\nexport const Title = React.forwardRef(function DrawerTitle(props: DrawerTitleProps, ref: React.Ref<HTMLHeadingElement>) {\n const { className, children, ...otherProps } = props;\n /**\n * By design in default drawer version Title has grey separator, but we might have exceptions like Drawer + Tabs scenario,\n * where we might want to hide the grey separator. For this reason separator was rendedr with using of classNames,\n * so it can be easily overriden in exceptional scenarious.\n * */\n const cName = cn('grow-0 py-4 pl-4 justify-self-start mb-0 border-b-[1px] border-grey-300 flex items-center', className);\n return (\n <DialogPrimitive.Title className={cName} {...otherProps} ref={ref}>\n <span className=\"line-clamp-2 inline-block w-4/6 overflow-y-hidden\">{children}</span>\n </DialogPrimitive.Title>\n );\n});\n\nexport type DrawerFooterProps = React.HTMLAttributes<HTMLDivElement>;\nexport const Footer = React.forwardRef(function DrawerFooter(props: DrawerFooterProps, ref: React.Ref<HTMLDivElement>) {\n const { className, ...otherProps } = props;\n /**\n * The same scenario as Title, grey separator rendered using classNames to have posibility to override it.\n */\n const cName = cn('mt-auto flex justify-end grow-0 p-4 border-t-[1px] border-grey-300', props.className);\n return <div {...otherProps} className={cName} ref={ref} />;\n});\n\nexport const Actions = React.forwardRef(function Actions(props: GroupProps, ref: React.Ref<HTMLDivElement>) {\n const { className, ...otherProps } = props;\n const cName = cn('absolute top-0 right-10 mr-[8px] mt-4', className);\n return <Group {...otherProps} className={cName} ref={ref} />;\n});\n\nexport type DrawerCloseProps = React.HTMLAttributes<HTMLButtonElement>;\nexport const Close = React.forwardRef(function DrawerClose(props: DrawerCloseProps, ref: React.Ref<HTMLButtonElement>) {\n const { onClose } = useCurrentDrawer();\n\n return <DialogPrimitive.Close {...props} onClick={onClose} ref={ref} asChild />;\n});\n\n/**\n * It is container component, needed to provide default scrolling behaviour and padding, to simplyfy usage, requested by feature devs.\n * It is optional to use InnerContent component, if consumer need to implement custom behaviour or paddings for inner content,\n * then it's simply enough to render children and wrap them in custom implementation.\n */\nexport type DrawerInnerContentProps = React.HTMLAttributes<HTMLDivElement> & {\n /**\n * Consumer might want to use innerContent component to apply default paddings, but want to implement custom scrolling behaviour,\n * default value - true\n */\n isScrollable?: boolean;\n};\nexport const InnerContent = React.forwardRef(function InnerContent(\n props: DrawerInnerContentProps,\n ref: React.Ref<HTMLDivElement>\n) {\n const { className, isScrollable = true, children, ...otherProps } = props;\n const cName = cn(\n 'grow flex flex-col',\n {\n 'overflow-y-hidden': isScrollable,\n 'p-4': !isScrollable,\n },\n className\n );\n return (\n <div {...otherProps} className={cName} ref={ref}>\n {isScrollable ? <ScrollArea className=\"w-full gap-y-0.5 p-4\">{children}</ScrollArea> : children}\n </div>\n );\n});\n\nconst Portal = (props: DialogPrimitive.DialogPortalProps) => {\n const { children, ...otherProps } = props;\n const { open = false, variant, outlet } = useCurrentDrawer();\n\n const backdropClassNames = React.useMemo(() => {\n return getBackdropClassNames(open);\n }, [open]);\n\n if (!outlet) {\n return null;\n }\n\n return (\n <DialogPrimitive.Portal {...otherProps} container={outlet ?? undefined}>\n {variant === 'overlay' ? (\n <DialogPrimitive.Overlay forceMount>\n {/* Animate backdrop appearance for overlay version of Drawer */}\n <Backdrop className={backdropClassNames} />\n </DialogPrimitive.Overlay>\n ) : null}\n {children}\n </DialogPrimitive.Portal>\n );\n};\n\ntype UntrappedFocusDrawerContentProps = React.HTMLAttributes<HTMLDivElement> & {\n onEscape: (event: KeyboardEvent) => void;\n};\nconst UntrappedFocusDrawerContent = React.forwardRef(function EmbeddedDrawerContent(\n props: UntrappedFocusDrawerContentProps,\n ref: React.Ref<HTMLDivElement>\n) {\n const { onEscape, children, ...otherProps } = props;\n\n useGlobalKeyDown('Escape', onEscape);\n\n return (\n <div {...otherProps} ref={ref}>\n <FocusScope autoFocus={true} restoreFocus={true}>\n {children}\n </FocusScope>\n </div>\n );\n});\n\nexport type DrawerContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> & {\n /** An accessible label to be announced when the side drawer is opened */\n 'aria-label': string;\n children: Omit<React.ReactNode, 'Function'> | ((props: DrawerContentRenderProps) => JSX.Element);\n};\nexport const DrawerContent = React.forwardRef(function Content(\n props: DrawerContentProps,\n externalRef: React.Ref<HTMLDivElement>\n) {\n const {\n size,\n onClose,\n onResize,\n open = false,\n closeOnEscape,\n variant,\n focusTrap,\n showCloseButton,\n setOpen,\n } = useCurrentDrawer();\n const { className, style, children, ...otherProps } = props;\n const { texts } = useLocalization();\n const ref = useMergedRef<HTMLDivElement>(externalRef);\n\n // if the drawer was opened by a menu, we need to close the menu when the drawer closes\n // the menu is still open (and mounted) because it is the trigger for the drawer\n const menu = useCurrentMenu();\n let handleCloseAutoFocus: DialogPrimitive.DialogContentProps['onCloseAutoFocus'];\n\n if (menu) {\n handleCloseAutoFocus = () => {\n menu.close();\n };\n }\n\n const containerClassName: string = React.useMemo(() => cn(getDrawerContainerClassNames(variant), className), [className]);\n\n const { contentClassName, dragHandlerClassName } = React.useMemo(() => {\n const contentClassName = getDrawerContentClassNames(size, variant, open);\n const dragHandlerClassName: string = getDrawerDragHandlerClassNames();\n return { contentClassName, dragHandlerClassName };\n }, [size, variant, open]);\n\n const handleEscapeKeyDown = (event: KeyboardEvent) => {\n const isTargetInsideDrawerContent = ref.current?.contains(event.target as HTMLElement);\n if (isTargetInsideDrawerContent) {\n if (!closeOnEscape) {\n event.preventDefault();\n } else {\n setOpen && setOpen(false);\n if (onClose) {\n onClose();\n }\n }\n }\n };\n\n const [containerWidth, setContainerWidth] = React.useState<number>();\n\n const dragHandlerRef = React.useRef<HTMLDivElement>(null);\n const {\n position,\n dragging,\n handleProps: dragHandleProps,\n resetPosition,\n } = useDraggable(useMergedRef<HTMLDivElement>(dragHandlerRef));\n\n const contentRef = React.useRef<HTMLDivElement>(null);\n\n React.useEffect(() => {\n if (onResize) {\n onResize(position.x);\n }\n }, [position]);\n\n React.useEffect(() => {\n setContainerWidth(contentRef.current?.offsetWidth);\n }, [contentRef, open]);\n\n const resizedWidth = React.useMemo((): number | undefined => {\n if (containerWidth) {\n return Math.min(RESIZE_MAX, Math.max(RESIZE_MIN, containerWidth - position.x || 0));\n }\n return;\n }, [containerWidth, position]);\n\n React.useEffect(() => {\n if (!dragging && resizedWidth) {\n setContainerWidth(resizedWidth);\n resetPosition();\n }\n }, [dragging]);\n\n let output;\n\n if (typeof children === 'function') {\n output = (\n <Close>\n <RenderPropWrapper>{children}</RenderPropWrapper>\n </Close>\n );\n } else {\n output = children;\n }\n\n const content = (\n <div ref={contentRef} data-taco=\"drawer\" className={containerClassName}>\n {output}\n <div className={dragHandlerClassName} {...dragHandleProps} data-testid=\"resize-handler\" ref={dragHandlerRef}>\n {dragging ? <div data-testid=\"resize-hit-area\" className=\"fixed bottom-0 left-0 right-0 top-0\" /> : null}\n </div>\n {showCloseButton ? (\n <Close>\n <IconButton\n appearance=\"discrete\"\n aria-label={texts.drawer.close}\n className=\"absolute right-0 top-0 mr-2 mt-4\"\n icon=\"close\"\n />\n </Close>\n ) : null}\n </div>\n );\n\n const styleProp = {\n ...style,\n ...{ width: resizedWidth },\n };\n\n return focusTrap ? (\n <DialogPrimitive.Content\n forceMount\n {...otherProps}\n className={contentClassName}\n onEscapeKeyDown={handleEscapeKeyDown}\n onInteractOutside={variant === 'overlay' ? undefined : event => event.preventDefault()}\n onCloseAutoFocus={handleCloseAutoFocus}\n ref={ref}\n style={styleProp}>\n {content}\n </DialogPrimitive.Content>\n ) : (\n <UntrappedFocusDrawerContent onEscape={handleEscapeKeyDown} className={contentClassName} style={styleProp} ref={ref}>\n {content}\n </UntrappedFocusDrawerContent>\n );\n});\n\nexport const Content = React.forwardRef(function Content(props: DrawerContentProps, externalRef: React.Ref<HTMLDivElement>) {\n const { children } = props;\n\n return (\n <Portal>\n <DrawerContent {...props} ref={externalRef}>\n {children}\n </DrawerContent>\n </Portal>\n );\n});\n"],"names":["RESIZE_MIN","RESIZE_MAX","DrawerAnimationDefinition","RenderPropWrapper","React","forwardRef","children","onClick","renderProps","ref","close","CustomEvent","Title","DrawerTitle","props","className","otherProps","cName","cn","DialogPrimitive","Footer","DrawerFooter","Actions","Group","Close","DrawerClose","onClose","useCurrentDrawer","asChild","InnerContent","isScrollable","ScrollArea","Portal","open","variant","outlet","backdropClassNames","useMemo","getBackdropClassNames","container","undefined","forceMount","Backdrop","UntrappedFocusDrawerContent","EmbeddedDrawerContent","onEscape","useGlobalKeyDown","FocusScope","autoFocus","restoreFocus","DrawerContent","Content","externalRef","size","onResize","closeOnEscape","focusTrap","showCloseButton","setOpen","style","texts","useLocalization","useMergedRef","menu","useCurrentMenu","handleCloseAutoFocus","containerClassName","getDrawerContainerClassNames","contentClassName","dragHandlerClassName","getDrawerContentClassNames","getDrawerDragHandlerClassNames","handleEscapeKeyDown","event","isTargetInsideDrawerContent","_ref$current","current","contains","target","preventDefault","containerWidth","setContainerWidth","useState","dragHandlerRef","useRef","position","dragging","handleProps","dragHandleProps","resetPosition","useDraggable","contentRef","useEffect","x","_contentRef$current","offsetWidth","resizedWidth","Math","min","max","output","content","IconButton","appearance","drawer","icon","styleProp","width","onEscapeKeyDown","onInteractOutside","onCloseAutoFocus"],"mappings":"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"}
1
+ {"version":3,"file":"Content.js","sources":["../../../../../../../../src/components/Drawer/components/Content.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { Group, GroupProps } from '../../Group/Group';\nimport { IconButton } from '../../IconButton/IconButton';\nimport { useLocalization } from '../../Provider/Localization';\nimport { Backdrop } from '../../Backdrop/Backdrop';\nimport { useCurrentMenu } from '../../Menu/Context';\nimport { useCurrentDrawer } from '../Context';\nimport {\n getBackdropClassNames,\n getDrawerContainerClassNames,\n getDrawerContentClassNames,\n getDrawerDragHandlerClassNames,\n} from '../util';\nimport { useDraggable } from '../../../utils/hooks/useDraggable';\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport { FocusScope } from '@react-aria/focus';\nimport { ScrollArea } from '../../ScrollArea/ScrollArea';\nimport { useGlobalKeyDown } from '../../../hooks/useGlobalKeyDown';\n\nconst RESIZE_MIN = 360;\nconst RESIZE_MAX = 1000;\n\nexport type DrawerContentRenderProps = {\n close: () => void;\n};\n\nexport enum DrawerAnimationDefinition {\n Visible = 'visible',\n Hidden = 'hidden',\n}\n\nconst RenderPropWrapper = React.forwardRef(function RenderPropWrapper({ children, onClick, renderProps }: any, ref) {\n const close = () => {\n onClick(new CustomEvent('close'));\n };\n\n return children({ close, ref, ...renderProps });\n});\n\nexport type DrawerTitleProps = React.HTMLAttributes<HTMLHeadingElement>;\nexport const Title = React.forwardRef(function DrawerTitle(props: DrawerTitleProps, externalRef: React.Ref<HTMLHeadingElement>) {\n const { className, children, ...otherProps } = props;\n const ref = useMergedRef<HTMLHeadingElement>(externalRef);\n const [style, setStyle] = React.useState({});\n const { texts } = useLocalization();\n const { onClickBack } = useCurrentDrawer();\n\n /**\n * By design in default drawer version Title has grey separator, but we might have exceptions like Drawer + Tabs scenario,\n * where we might want to hide the grey separator. For this reason separator was rendered with using of classNames,\n * so it can be easily overriden in exceptional scenarios.\n * */\n const cName = cn('grow-0 py-4 px-4 justify-self-start mb-0 border-b-[1px] border-grey-300 flex items-start', className);\n\n React.useEffect(() => {\n const drawer = ref?.current?.closest('[data-taco=\"drawer\"]');\n\n // This is the margin amount that we need to deduct from the margins to align with the design\n const marginAdjust = 4;\n\n const closeButton: HTMLButtonElement | null = drawer?.querySelector(`[aria-label=\"${texts.drawer.close}\"]`) ?? null;\n const closeButtonWidth = closeButton?.offsetWidth ?? 0;\n const closeButtonRightMargin = 8;\n\n const actionsWrapper: HTMLSpanElement | null = drawer?.querySelector(`#taco-drawer-actions[data-taco=\"group\"]`) ?? null;\n const actionsWrapperWidth = actionsWrapper?.offsetWidth ?? 0;\n const actionsWrapperRightMargin = 8;\n\n const marginRight =\n closeButtonWidth + actionsWrapperWidth + closeButtonRightMargin + actionsWrapperRightMargin - marginAdjust;\n\n setStyle({ marginRight });\n }, [ref, texts.drawer.close]);\n\n return (\n <DialogPrimitive.Title className={cName} {...otherProps} ref={ref}>\n {onClickBack ? (\n <IconButton\n appearance=\"discrete\"\n aria-label={texts.drawer.back}\n className=\"mr-3 text-base\"\n icon=\"chevron-left\"\n onClick={onClickBack}\n />\n ) : null}\n {\n // We need to apply the right margin as an inline style instead of using Tailwind CSS.\n // This is necessary because we are creating styles dynamically at runtime,\n // and Tailwind doesn't support generating runtime styles.\n }\n <span className=\"line-clamp-2 inline-block overflow-y-hidden\" style={style}>\n {children}\n </span>\n </DialogPrimitive.Title>\n );\n});\n\nexport type DrawerFooterProps = React.HTMLAttributes<HTMLDivElement>;\nexport const Footer = React.forwardRef(function DrawerFooter(props: DrawerFooterProps, ref: React.Ref<HTMLDivElement>) {\n const { className, ...otherProps } = props;\n /**\n * The same scenario as Title, grey separator rendered using classNames to have posibility to override it.\n */\n const cName = cn('mt-auto flex justify-end grow-0 p-4 border-t-[1px] border-grey-300', props.className);\n return <div {...otherProps} className={cName} ref={ref} />;\n});\n\nexport const Actions = React.forwardRef(function Actions(props: GroupProps, ref: React.Ref<HTMLDivElement>) {\n const { className, ...otherProps } = props;\n const cName = cn('absolute top-0 right-10 mr-[8px] mt-4', className);\n // Id is added to identify the actions wrapper inside a useEffect in Dialog.Title\n return <Group {...otherProps} className={cName} id=\"taco-drawer-actions\" ref={ref} />;\n});\n\nexport type DrawerCloseProps = React.HTMLAttributes<HTMLButtonElement>;\nexport const Close = React.forwardRef(function DrawerClose(props: DrawerCloseProps, ref: React.Ref<HTMLButtonElement>) {\n const { onClose } = useCurrentDrawer();\n\n return <DialogPrimitive.Close {...props} onClick={onClose} ref={ref} asChild />;\n});\n\n/**\n * It is container component, needed to provide default scrolling behaviour and padding, to simplyfy usage, requested by feature devs.\n * It is optional to use InnerContent component, if consumer need to implement custom behaviour or paddings for inner content,\n * then it's simply enough to render children and wrap them in custom implementation.\n */\nexport type DrawerInnerContentProps = React.HTMLAttributes<HTMLDivElement> & {\n /**\n * Consumer might want to use innerContent component to apply default paddings, but want to implement custom scrolling behaviour,\n * default value - true\n */\n isScrollable?: boolean;\n};\nexport const InnerContent = React.forwardRef(function InnerContent(\n props: DrawerInnerContentProps,\n ref: React.Ref<HTMLDivElement>\n) {\n const { className, isScrollable = true, children, ...otherProps } = props;\n const cName = cn(\n 'grow flex flex-col',\n {\n 'overflow-y-hidden': isScrollable,\n 'p-4': !isScrollable,\n },\n className\n );\n return (\n <div {...otherProps} className={cName} ref={ref}>\n {isScrollable ? <ScrollArea className=\"w-full gap-y-0.5 p-4\">{children}</ScrollArea> : children}\n </div>\n );\n});\n\nconst Portal = (props: DialogPrimitive.DialogPortalProps) => {\n const { children, ...otherProps } = props;\n const { open = false, variant, outlet } = useCurrentDrawer();\n\n const backdropClassNames = React.useMemo(() => {\n return getBackdropClassNames(open);\n }, [open]);\n\n if (!outlet) {\n return null;\n }\n\n return (\n <DialogPrimitive.Portal {...otherProps} container={outlet ?? undefined}>\n {variant === 'overlay' ? (\n <DialogPrimitive.Overlay forceMount>\n {/* Animate backdrop appearance for overlay version of Drawer */}\n <Backdrop className={backdropClassNames} />\n </DialogPrimitive.Overlay>\n ) : null}\n {children}\n </DialogPrimitive.Portal>\n );\n};\n\ntype UntrappedFocusDrawerContentProps = React.HTMLAttributes<HTMLDivElement> & {\n onEscape: (event: KeyboardEvent) => void;\n};\nconst UntrappedFocusDrawerContent = React.forwardRef(function EmbeddedDrawerContent(\n props: UntrappedFocusDrawerContentProps,\n ref: React.Ref<HTMLDivElement>\n) {\n const { onEscape, children, ...otherProps } = props;\n\n useGlobalKeyDown('Escape', onEscape);\n\n return (\n <div {...otherProps} ref={ref}>\n <FocusScope autoFocus={true} restoreFocus={true}>\n {children}\n </FocusScope>\n </div>\n );\n});\n\nexport type DrawerContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> & {\n /** An accessible label to be announced when the side drawer is opened */\n 'aria-label': string;\n children: Omit<React.ReactNode, 'Function'> | ((props: DrawerContentRenderProps) => JSX.Element);\n};\nexport const DrawerContent = React.forwardRef(function Content(\n props: DrawerContentProps,\n externalRef: React.Ref<HTMLDivElement>\n) {\n const {\n size,\n onClose,\n onResize,\n open = false,\n closeOnEscape,\n variant,\n focusTrap,\n showCloseButton,\n setOpen,\n } = useCurrentDrawer();\n const { className, style, children, ...otherProps } = props;\n const { texts } = useLocalization();\n const ref = useMergedRef<HTMLDivElement>(externalRef);\n\n // if the drawer was opened by a menu, we need to close the menu when the drawer closes\n // the menu is still open (and mounted) because it is the trigger for the drawer\n const menu = useCurrentMenu();\n let handleCloseAutoFocus: DialogPrimitive.DialogContentProps['onCloseAutoFocus'];\n\n if (menu) {\n handleCloseAutoFocus = () => {\n menu.close();\n };\n }\n\n const containerClassName: string = React.useMemo(() => cn(getDrawerContainerClassNames(variant), className), [className]);\n\n const { contentClassName, dragHandlerClassName } = React.useMemo(() => {\n const contentClassName = getDrawerContentClassNames(size, variant, open);\n const dragHandlerClassName: string = getDrawerDragHandlerClassNames();\n return { contentClassName, dragHandlerClassName };\n }, [size, variant, open]);\n\n const handleEscapeKeyDown = (event: KeyboardEvent) => {\n const isTargetInsideDrawerContent = ref.current?.contains(event.target as HTMLElement);\n if (isTargetInsideDrawerContent) {\n if (!closeOnEscape) {\n event.preventDefault();\n } else {\n setOpen && setOpen(false);\n if (onClose) {\n onClose();\n }\n }\n }\n };\n\n const [containerWidth, setContainerWidth] = React.useState<number>();\n\n const dragHandlerRef = React.useRef<HTMLDivElement>(null);\n const {\n position,\n dragging,\n handleProps: dragHandleProps,\n resetPosition,\n } = useDraggable(useMergedRef<HTMLDivElement>(dragHandlerRef));\n\n const contentRef = React.useRef<HTMLDivElement>(null);\n\n React.useEffect(() => {\n if (onResize) {\n onResize(position.x);\n }\n }, [position]);\n\n React.useEffect(() => {\n setContainerWidth(contentRef.current?.offsetWidth);\n }, [contentRef, open]);\n\n const resizedWidth = React.useMemo((): number | undefined => {\n if (containerWidth) {\n return Math.min(RESIZE_MAX, Math.max(RESIZE_MIN, containerWidth - position.x || 0));\n }\n return;\n }, [containerWidth, position]);\n\n React.useEffect(() => {\n if (!dragging && resizedWidth) {\n setContainerWidth(resizedWidth);\n resetPosition();\n }\n }, [dragging]);\n\n let output;\n\n if (typeof children === 'function') {\n output = (\n <Close>\n <RenderPropWrapper>{children}</RenderPropWrapper>\n </Close>\n );\n } else {\n output = children;\n }\n\n const content = (\n <div ref={contentRef} data-taco=\"drawer\" className={containerClassName}>\n {output}\n <div className={dragHandlerClassName} {...dragHandleProps} data-testid=\"resize-handler\" ref={dragHandlerRef}>\n {dragging ? <div data-testid=\"resize-hit-area\" className=\"fixed bottom-0 left-0 right-0 top-0\" /> : null}\n </div>\n {showCloseButton ? (\n <Close>\n <IconButton\n appearance=\"discrete\"\n aria-label={texts.drawer.close}\n className=\"absolute right-0 top-0 mr-2 mt-4\"\n icon=\"close\"\n />\n </Close>\n ) : null}\n </div>\n );\n\n const styleProp = {\n ...style,\n ...{ width: resizedWidth },\n };\n\n return focusTrap ? (\n <DialogPrimitive.Content\n forceMount\n {...otherProps}\n className={contentClassName}\n onEscapeKeyDown={handleEscapeKeyDown}\n onInteractOutside={variant === 'overlay' ? undefined : event => event.preventDefault()}\n onCloseAutoFocus={handleCloseAutoFocus}\n ref={ref}\n style={styleProp}>\n {content}\n </DialogPrimitive.Content>\n ) : (\n <UntrappedFocusDrawerContent onEscape={handleEscapeKeyDown} className={contentClassName} style={styleProp} ref={ref}>\n {content}\n </UntrappedFocusDrawerContent>\n );\n});\n\nexport const Content = React.forwardRef(function Content(props: DrawerContentProps, externalRef: React.Ref<HTMLDivElement>) {\n const { children } = props;\n\n return (\n <Portal>\n <DrawerContent {...props} ref={externalRef}>\n {children}\n </DrawerContent>\n </Portal>\n );\n});\n"],"names":["RESIZE_MIN","RESIZE_MAX","DrawerAnimationDefinition","RenderPropWrapper","React","forwardRef","children","onClick","renderProps","ref","close","CustomEvent","Title","DrawerTitle","props","externalRef","className","otherProps","useMergedRef","style","setStyle","useState","texts","useLocalization","onClickBack","useCurrentDrawer","cName","cn","useEffect","drawer","_ref$current","current","closest","marginAdjust","closeButton","_drawer$querySelector","querySelector","closeButtonWidth","_closeButton$offsetWi","offsetWidth","closeButtonRightMargin","actionsWrapper","_drawer$querySelector2","actionsWrapperWidth","_actionsWrapper$offse","actionsWrapperRightMargin","marginRight","DialogPrimitive","IconButton","appearance","back","icon","Footer","DrawerFooter","Actions","Group","id","Close","DrawerClose","onClose","asChild","InnerContent","isScrollable","ScrollArea","Portal","open","variant","outlet","backdropClassNames","useMemo","getBackdropClassNames","container","undefined","forceMount","Backdrop","UntrappedFocusDrawerContent","EmbeddedDrawerContent","onEscape","useGlobalKeyDown","FocusScope","autoFocus","restoreFocus","DrawerContent","Content","size","onResize","closeOnEscape","focusTrap","showCloseButton","setOpen","menu","useCurrentMenu","handleCloseAutoFocus","containerClassName","getDrawerContainerClassNames","contentClassName","dragHandlerClassName","getDrawerContentClassNames","getDrawerDragHandlerClassNames","handleEscapeKeyDown","event","isTargetInsideDrawerContent","_ref$current2","contains","target","preventDefault","containerWidth","setContainerWidth","dragHandlerRef","useRef","position","dragging","handleProps","dragHandleProps","resetPosition","useDraggable","contentRef","x","_contentRef$current","resizedWidth","Math","min","max","output","content","styleProp","width","onEscapeKeyDown","onInteractOutside","onCloseAutoFocus"],"mappings":"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"}
@@ -20,7 +20,7 @@ const getDrawerContentClassNames = (size, variant, open) => {
20
20
  const getDrawerContainerClassNames = variant => {
21
21
  return cn('bg-white mx-auto absolute h-full w-full flex flex-col ', {
22
22
  'shadow-[0_6px_9px_0_rgba(89,85,98,0.3),0_0_1px_0_rgba(89,85,98,0.2)]': variant === 'overlay',
23
- 'border-l border-grey h-full': variant === 'embedded'
23
+ 'border-l border-grey-300 h-full': variant === 'embedded'
24
24
  });
25
25
  };
26
26
  const getDrawerDragHandlerClassNames = () => {
@@ -1 +1 @@
1
- {"version":3,"file":"util.js","sources":["../../../../../../../src/components/Drawer/util.ts"],"sourcesContent":["import { DrawerSize, DrawerVariant } from './types';\nimport cn from 'clsx';\n\nexport const getDrawerSizeClassnames = (size: DrawerSize): string => {\n switch (size) {\n case 'lg':\n return 'w-[600px]';\n case 'md':\n default:\n return 'w-[420px]';\n }\n};\n\nexport const getDrawerPrimitiveContentClassNames = (): string => {\n return 'fixed bottom-0 top-0 right-0';\n};\n\nexport const getDrawerContentClassNames = (size: DrawerSize, variant: DrawerVariant, open: boolean): string => {\n return cn(\n 'bg-white h-full bottom-0 top-0 right-0 transition-none',\n {\n block: open,\n hidden: !open,\n fixed: variant === 'overlay',\n 'relative h-full overflow-hidden': variant === 'embedded',\n },\n getDrawerSizeClassnames(size)\n );\n};\n\nexport const getDrawerContainerClassNames = (variant: DrawerVariant): string => {\n return cn('bg-white mx-auto absolute h-full w-full flex flex-col ', {\n 'shadow-[0_6px_9px_0_rgba(89,85,98,0.3),0_0_1px_0_rgba(89,85,98,0.2)]': variant === 'overlay',\n 'border-l border-grey h-full': variant === 'embedded',\n });\n};\n\nexport const getDrawerDragHandlerClassNames = (): string => {\n return cn('border-[2px] absolute border-transparent top-0 w-2 h-full cursor-ew-resize left-0 hover:border-l-blue-500');\n};\n\nexport const getBackdropClassNames = (open: boolean): string => {\n return cn({\n block: open,\n hidden: !open,\n });\n};\n"],"names":["getDrawerSizeClassnames","size","getDrawerContentClassNames","variant","open","cn","block","hidden","fixed","getDrawerContainerClassNames","getDrawerDragHandlerClassNames","getBackdropClassNames"],"mappings":";;MAGaA,uBAAuB,GAAIC,IAAgB;EACpD,QAAQA,IAAI;IACR,KAAK,IAAI;MACL,OAAO,WAAW;IACtB,KAAK,IAAI;IACT;MACI,OAAO,WAAW;;AAE9B;MAMaC,0BAA0B,GAAGA,CAACD,IAAgB,EAAEE,OAAsB,EAAEC,IAAa;EAC9F,OAAOC,EAAE,CACL,wDAAwD,EACxD;IACIC,KAAK,EAAEF,IAAI;IACXG,MAAM,EAAE,CAACH,IAAI;IACbI,KAAK,EAAEL,OAAO,KAAK,SAAS;IAC5B,iCAAiC,EAAEA,OAAO,KAAK;GAClD,EACDH,uBAAuB,CAACC,IAAI,CAAC,CAChC;AACL;MAEaQ,4BAA4B,GAAIN,OAAsB;EAC/D,OAAOE,EAAE,CAAC,wDAAwD,EAAE;IAChE,sEAAsE,EAAEF,OAAO,KAAK,SAAS;IAC7F,6BAA6B,EAAEA,OAAO,KAAK;GAC9C,CAAC;AACN;MAEaO,8BAA8B,GAAGA;EAC1C,OAAOL,EAAE,CAAC,2GAA2G,CAAC;AAC1H;MAEaM,qBAAqB,GAAIP,IAAa;EAC/C,OAAOC,EAAE,CAAC;IACNC,KAAK,EAAEF,IAAI;IACXG,MAAM,EAAE,CAACH;GACZ,CAAC;AACN;;;;"}
1
+ {"version":3,"file":"util.js","sources":["../../../../../../../src/components/Drawer/util.ts"],"sourcesContent":["import { DrawerSize, DrawerVariant } from './types';\nimport cn from 'clsx';\n\nexport const getDrawerSizeClassnames = (size: DrawerSize): string => {\n switch (size) {\n case 'lg':\n return 'w-[600px]';\n case 'md':\n default:\n return 'w-[420px]';\n }\n};\n\nexport const getDrawerPrimitiveContentClassNames = (): string => {\n return 'fixed bottom-0 top-0 right-0';\n};\n\nexport const getDrawerContentClassNames = (size: DrawerSize, variant: DrawerVariant, open: boolean): string => {\n return cn(\n 'bg-white h-full bottom-0 top-0 right-0 transition-none',\n {\n block: open,\n hidden: !open,\n fixed: variant === 'overlay',\n 'relative h-full overflow-hidden': variant === 'embedded',\n },\n getDrawerSizeClassnames(size)\n );\n};\n\nexport const getDrawerContainerClassNames = (variant: DrawerVariant): string => {\n return cn('bg-white mx-auto absolute h-full w-full flex flex-col ', {\n 'shadow-[0_6px_9px_0_rgba(89,85,98,0.3),0_0_1px_0_rgba(89,85,98,0.2)]': variant === 'overlay',\n 'border-l border-grey-300 h-full': variant === 'embedded',\n });\n};\n\nexport const getDrawerDragHandlerClassNames = (): string => {\n return cn('border-[2px] absolute border-transparent top-0 w-2 h-full cursor-ew-resize left-0 hover:border-l-blue-500');\n};\n\nexport const getBackdropClassNames = (open: boolean): string => {\n return cn({\n block: open,\n hidden: !open,\n });\n};\n"],"names":["getDrawerSizeClassnames","size","getDrawerContentClassNames","variant","open","cn","block","hidden","fixed","getDrawerContainerClassNames","getDrawerDragHandlerClassNames","getBackdropClassNames"],"mappings":";;MAGaA,uBAAuB,GAAIC,IAAgB;EACpD,QAAQA,IAAI;IACR,KAAK,IAAI;MACL,OAAO,WAAW;IACtB,KAAK,IAAI;IACT;MACI,OAAO,WAAW;;AAE9B;MAMaC,0BAA0B,GAAGA,CAACD,IAAgB,EAAEE,OAAsB,EAAEC,IAAa;EAC9F,OAAOC,EAAE,CACL,wDAAwD,EACxD;IACIC,KAAK,EAAEF,IAAI;IACXG,MAAM,EAAE,CAACH,IAAI;IACbI,KAAK,EAAEL,OAAO,KAAK,SAAS;IAC5B,iCAAiC,EAAEA,OAAO,KAAK;GAClD,EACDH,uBAAuB,CAACC,IAAI,CAAC,CAChC;AACL;MAEaQ,4BAA4B,GAAIN,OAAsB;EAC/D,OAAOE,EAAE,CAAC,wDAAwD,EAAE;IAChE,sEAAsE,EAAEF,OAAO,KAAK,SAAS;IAC7F,iCAAiC,EAAEA,OAAO,KAAK;GAClD,CAAC;AACN;MAEaO,8BAA8B,GAAGA;EAC1C,OAAOL,EAAE,CAAC,2GAA2G,CAAC;AAC1H;MAEaM,qBAAqB,GAAIP,IAAa;EAC/C,OAAOC,EAAE,CAAC;IACNC,KAAK,EAAEF,IAAI;IACXG,MAAM,EAAE,CAACH;GACZ,CAAC;AACN;;;;"}
@@ -0,0 +1,19 @@
1
+ import { forwardRef, createElement } from 'react';
2
+
3
+ function IconDocumentSigned(props, svgRef) {
4
+ return /*#__PURE__*/createElement("svg", Object.assign({
5
+ fill: "none",
6
+ xmlns: "http://www.w3.org/2000/svg",
7
+ viewBox: "0 0 24 24",
8
+ ref: svgRef
9
+ }, props), /*#__PURE__*/createElement("path", {
10
+ fillRule: "evenodd",
11
+ clipRule: "evenodd",
12
+ d: "M14.293 2.293A1 1 0 0013.586 2H5.75A1.75 1.75 0 004 3.75v16.5c0 .966.784 1.75 1.75 1.75h12.5A1.75 1.75 0 0020 20.25V8.414a1 1 0 00-.293-.707l-5.414-5.414zM5.75 3.5H13v3.75l.006.144A1.75 1.75 0 0014.75 9h3.75v11.25l-.007.057a.25.25 0 01-.243.193H5.75l-.057-.007a.25.25 0 01-.193-.243V3.75l.007-.057A.25.25 0 015.75 3.5zm8.75 1.121V7.25a.25.25 0 00.193.243l.057.007h2.63L14.5 4.621zm-6.693 9.425C8.183 12.37 9.194 11 10.43 11c1.547 0 1.796 1.624 1 3.337a6.972 6.972 0 01-1.424 2.009l-.156.148.138-.007.17-.017c1.058-.13 1.702-.687 2.014-1.725l.044-.16.026-.08c.239-.613 1.208-.407 1.13.292a10.03 10.03 0 00-.074 1.205l.006.168.084-.093.202-.245c.451-.532.863-.748 1.332-.404.185.135.278.313.343.543l.019.072.033.156.064.387.087-.088.147-.16.172-.202.197-.242.22-.284.23-.312.057-.067a.59.59 0 01.898.758l-.133.182-.252.334-.127.162c-.665.834-1.147 1.225-1.605 1.266-.419.037-.725-.198-.889-.556a1.83 1.83 0 01-.128-.403l-.016-.081-.08.09-.093.096c-.583.591-1.13.773-1.585.251l-.068-.084-.054-.08a1.31 1.31 0 01-.128-.29l-.011-.04-.098.082-.152.112c-.568.398-1.28.616-2.126.645l-.2.003-.167-.005a1.862 1.862 0 01-.843-.253l-.016-.01-.077.046-.256.137a6.378 6.378 0 01-.8.342l-.222.072-.078.018a.59.59 0 01-.267-1.145 5.16 5.16 0 00.806-.324l.15-.08-.043-.116-.056-.188c-.133-.511-.144-1.121-.036-1.775l.031-.17.038-.181zm2.617-.347c.422-.975.323-1.52.004-1.52-.545 0-1.255 1.006-1.502 2.273-.09.462-.108.86-.061 1.178l.025.14.082-.07.197-.186a5.84 5.84 0 001.1-1.488l.091-.185.064-.142z",
13
+ fill: "currentColor"
14
+ }));
15
+ }
16
+ var DocumentSigned = /*#__PURE__*/forwardRef(IconDocumentSigned);
17
+
18
+ export default DocumentSigned;
19
+ //# sourceMappingURL=DocumentSigned.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DocumentSigned.js","sources":["../../../../../../../../src/components/Icon/components/DocumentSigned.tsx"],"sourcesContent":["import * as React from 'react';\nfunction IconDocumentSigned(props: React.SVGProps<SVGSVGElement>, svgRef?: React.Ref<SVGSVGElement>): JSX.Element {\n return (\n <svg fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" ref={svgRef} {...props}>\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M14.293 2.293A1 1 0 0013.586 2H5.75A1.75 1.75 0 004 3.75v16.5c0 .966.784 1.75 1.75 1.75h12.5A1.75 1.75 0 0020 20.25V8.414a1 1 0 00-.293-.707l-5.414-5.414zM5.75 3.5H13v3.75l.006.144A1.75 1.75 0 0014.75 9h3.75v11.25l-.007.057a.25.25 0 01-.243.193H5.75l-.057-.007a.25.25 0 01-.193-.243V3.75l.007-.057A.25.25 0 015.75 3.5zm8.75 1.121V7.25a.25.25 0 00.193.243l.057.007h2.63L14.5 4.621zm-6.693 9.425C8.183 12.37 9.194 11 10.43 11c1.547 0 1.796 1.624 1 3.337a6.972 6.972 0 01-1.424 2.009l-.156.148.138-.007.17-.017c1.058-.13 1.702-.687 2.014-1.725l.044-.16.026-.08c.239-.613 1.208-.407 1.13.292a10.03 10.03 0 00-.074 1.205l.006.168.084-.093.202-.245c.451-.532.863-.748 1.332-.404.185.135.278.313.343.543l.019.072.033.156.064.387.087-.088.147-.16.172-.202.197-.242.22-.284.23-.312.057-.067a.59.59 0 01.898.758l-.133.182-.252.334-.127.162c-.665.834-1.147 1.225-1.605 1.266-.419.037-.725-.198-.889-.556a1.83 1.83 0 01-.128-.403l-.016-.081-.08.09-.093.096c-.583.591-1.13.773-1.585.251l-.068-.084-.054-.08a1.31 1.31 0 01-.128-.29l-.011-.04-.098.082-.152.112c-.568.398-1.28.616-2.126.645l-.2.003-.167-.005a1.862 1.862 0 01-.843-.253l-.016-.01-.077.046-.256.137a6.378 6.378 0 01-.8.342l-.222.072-.078.018a.59.59 0 01-.267-1.145 5.16 5.16 0 00.806-.324l.15-.08-.043-.116-.056-.188c-.133-.511-.144-1.121-.036-1.775l.031-.17.038-.181zm2.617-.347c.422-.975.323-1.52.004-1.52-.545 0-1.255 1.006-1.502 2.273-.09.462-.108.86-.061 1.178l.025.14.082-.07.197-.186a5.84 5.84 0 001.1-1.488l.091-.185.064-.142z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n}\nexport default React.forwardRef(IconDocumentSigned);\n"],"names":["IconDocumentSigned","props","svgRef","React","fill","xmlns","viewBox","ref","fillRule","clipRule","d"],"mappings":";;AACA,SAASA,kBAAkBA,CAACC,KAAoC,EAAEC,MAAiC;EAC/F,oBACIC;IAAKC,IAAI,EAAC,MAAM;IAACC,KAAK,EAAC,4BAA4B;IAACC,OAAO,EAAC,WAAW;IAACC,GAAG,EAAEL;KAAYD,KAAK,gBAC1FE;IACIK,QAAQ,EAAC,SAAS;IAClBC,QAAQ,EAAC,SAAS;IAClBC,CAAC,EAAC,68CAA68C;IAC/8CN,IAAI,EAAC;IACP,CACA;AAEd;AACA,kCAAeD,UAAgB,CAACH,kBAAkB,CAAC;;;;"}
@@ -0,0 +1,19 @@
1
+ import { forwardRef, createElement } from 'react';
2
+
3
+ function IconHome2(props, svgRef) {
4
+ return /*#__PURE__*/createElement("svg", Object.assign({
5
+ fill: "none",
6
+ xmlns: "http://www.w3.org/2000/svg",
7
+ viewBox: "0 0 24 24",
8
+ ref: svgRef
9
+ }, props), /*#__PURE__*/createElement("path", {
10
+ fillRule: "evenodd",
11
+ clipRule: "evenodd",
12
+ d: "M11.116 2.823a1.25 1.25 0 011.768 0L17.25 7.19V6a.75.75 0 011.5 0v2.69l2.78 2.78a.75.75 0 01-1.06 1.06l-2.994-2.993-.013-.013L12 4.061l-8.47 8.47a.75.75 0 01-1.06-1.061l8.646-8.647zm1.768 3.25l7 7c.234.235.366.553.366.884v6.293c0 .69-.56 1.25-1.25 1.25h-4c-.69 0-1.25-.56-1.25-1.25V16.5h-3.5v3.75c0 .69-.56 1.25-1.25 1.25H5c-.69 0-1.25-.56-1.25-1.25v-6.293c0-.332.132-.65.366-.884l7-7a1.25 1.25 0 011.768 0zM12 7.311l-6.75 6.75V20h3.5v-3.75c0-.69.56-1.25 1.25-1.25h4c.69 0 1.25.56 1.25 1.25V20h3.5v-5.94L12 7.31z",
13
+ fill: "currentColor"
14
+ }));
15
+ }
16
+ var Home2 = /*#__PURE__*/forwardRef(IconHome2);
17
+
18
+ export default Home2;
19
+ //# sourceMappingURL=Home2.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Home2.js","sources":["../../../../../../../../src/components/Icon/components/Home2.tsx"],"sourcesContent":["import * as React from 'react';\nfunction IconHome2(props: React.SVGProps<SVGSVGElement>, svgRef?: React.Ref<SVGSVGElement>): JSX.Element {\n return (\n <svg fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" ref={svgRef} {...props}>\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M11.116 2.823a1.25 1.25 0 011.768 0L17.25 7.19V6a.75.75 0 011.5 0v2.69l2.78 2.78a.75.75 0 01-1.06 1.06l-2.994-2.993-.013-.013L12 4.061l-8.47 8.47a.75.75 0 01-1.06-1.061l8.646-8.647zm1.768 3.25l7 7c.234.235.366.553.366.884v6.293c0 .69-.56 1.25-1.25 1.25h-4c-.69 0-1.25-.56-1.25-1.25V16.5h-3.5v3.75c0 .69-.56 1.25-1.25 1.25H5c-.69 0-1.25-.56-1.25-1.25v-6.293c0-.332.132-.65.366-.884l7-7a1.25 1.25 0 011.768 0zM12 7.311l-6.75 6.75V20h3.5v-3.75c0-.69.56-1.25 1.25-1.25h4c.69 0 1.25.56 1.25 1.25V20h3.5v-5.94L12 7.31z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n}\nexport default React.forwardRef(IconHome2);\n"],"names":["IconHome2","props","svgRef","React","fill","xmlns","viewBox","ref","fillRule","clipRule","d"],"mappings":";;AACA,SAASA,SAASA,CAACC,KAAoC,EAAEC,MAAiC;EACtF,oBACIC;IAAKC,IAAI,EAAC,MAAM;IAACC,KAAK,EAAC,4BAA4B;IAACC,OAAO,EAAC,WAAW;IAACC,GAAG,EAAEL;KAAYD,KAAK,gBAC1FE;IACIK,QAAQ,EAAC,SAAS;IAClBC,QAAQ,EAAC,SAAS;IAClBC,CAAC,EAAC,kgBAAkgB;IACpgBN,IAAI,EAAC;IACP,CACA;AAEd;AACA,yBAAeD,UAAgB,CAACH,SAAS,CAAC;;;;"}
@@ -0,0 +1,19 @@
1
+ import { forwardRef, createElement } from 'react';
2
+
3
+ function IconId(props, svgRef) {
4
+ return /*#__PURE__*/createElement("svg", Object.assign({
5
+ fill: "none",
6
+ xmlns: "http://www.w3.org/2000/svg",
7
+ viewBox: "0 0 24 24",
8
+ ref: svgRef
9
+ }, props), /*#__PURE__*/createElement("path", {
10
+ fillRule: "evenodd",
11
+ clipRule: "evenodd",
12
+ d: "M20.25 5c.966 0 1.75.784 1.75 1.75v10.5A1.75 1.75 0 0120.25 19H3.75A1.75 1.75 0 012 17.25V6.75C2 5.784 2.784 5 3.75 5h16.5zm0 1.5H3.75a.25.25 0 00-.243.193L3.5 6.75v10.5a.25.25 0 00.193.243l.057.007h16.5a.25.25 0 00.243-.193l.007-.057V6.75a.25.25 0 00-.193-.243L20.25 6.5zm-9.268 7.993c-.316-1.81-1.31-2.714-2.982-2.714-1.673 0-2.667.905-2.982 2.714a1.204 1.204 0 001.184 1.41h3.595a1.204 1.204 0 001.185-1.41zM8 8c.76 0 1.374.77 1.374 1.718 0 .949-.615 1.718-1.374 1.718-.759 0-1.374-.77-1.374-1.718C6.626 8.769 7.24 8 8 8zm11 .75a.75.75 0 00-.75-.75h-6a.75.75 0 000 1.5h6a.75.75 0 00.75-.75zM18.25 14a.75.75 0 010 1.5h-4.5a.75.75 0 010-1.5h4.5zm.75-2.25a.75.75 0 00-.75-.75h-4.5a.75.75 0 000 1.5h4.5a.75.75 0 00.75-.75z",
13
+ fill: "currentColor"
14
+ }));
15
+ }
16
+ var Id = /*#__PURE__*/forwardRef(IconId);
17
+
18
+ export default Id;
19
+ //# sourceMappingURL=Id.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Id.js","sources":["../../../../../../../../src/components/Icon/components/Id.tsx"],"sourcesContent":["import * as React from 'react';\nfunction IconId(props: React.SVGProps<SVGSVGElement>, svgRef?: React.Ref<SVGSVGElement>): JSX.Element {\n return (\n <svg fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" ref={svgRef} {...props}>\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M20.25 5c.966 0 1.75.784 1.75 1.75v10.5A1.75 1.75 0 0120.25 19H3.75A1.75 1.75 0 012 17.25V6.75C2 5.784 2.784 5 3.75 5h16.5zm0 1.5H3.75a.25.25 0 00-.243.193L3.5 6.75v10.5a.25.25 0 00.193.243l.057.007h16.5a.25.25 0 00.243-.193l.007-.057V6.75a.25.25 0 00-.193-.243L20.25 6.5zm-9.268 7.993c-.316-1.81-1.31-2.714-2.982-2.714-1.673 0-2.667.905-2.982 2.714a1.204 1.204 0 001.184 1.41h3.595a1.204 1.204 0 001.185-1.41zM8 8c.76 0 1.374.77 1.374 1.718 0 .949-.615 1.718-1.374 1.718-.759 0-1.374-.77-1.374-1.718C6.626 8.769 7.24 8 8 8zm11 .75a.75.75 0 00-.75-.75h-6a.75.75 0 000 1.5h6a.75.75 0 00.75-.75zM18.25 14a.75.75 0 010 1.5h-4.5a.75.75 0 010-1.5h4.5zm.75-2.25a.75.75 0 00-.75-.75h-4.5a.75.75 0 000 1.5h4.5a.75.75 0 00.75-.75z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n}\nexport default React.forwardRef(IconId);\n"],"names":["IconId","props","svgRef","React","fill","xmlns","viewBox","ref","fillRule","clipRule","d"],"mappings":";;AACA,SAASA,MAAMA,CAACC,KAAoC,EAAEC,MAAiC;EACnF,oBACIC;IAAKC,IAAI,EAAC,MAAM;IAACC,KAAK,EAAC,4BAA4B;IAACC,OAAO,EAAC,WAAW;IAACC,GAAG,EAAEL;KAAYD,KAAK,gBAC1FE;IACIK,QAAQ,EAAC,SAAS;IAClBC,QAAQ,EAAC,SAAS;IAClBC,CAAC,EAAC,mtBAAmtB;IACrtBN,IAAI,EAAC;IACP,CACA;AAEd;AACA,sBAAeD,UAAgB,CAACH,MAAM,CAAC;;;;"}