@faststore/components 3.18.0 → 3.22.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.d.ts +4 -0
- package/dist/cjs/index.js +7 -3
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/molecules/TextareaField/TextareaField.d.ts +32 -0
- package/dist/cjs/molecules/TextareaField/TextareaField.js +32 -0
- package/dist/cjs/molecules/TextareaField/TextareaField.js.map +1 -0
- package/dist/cjs/molecules/TextareaField/index.d.ts +2 -0
- package/dist/cjs/molecules/TextareaField/index.js +9 -0
- package/dist/cjs/molecules/TextareaField/index.js.map +1 -0
- package/dist/cjs/molecules/Tooltip/Tooltip.d.ts +49 -0
- package/dist/cjs/molecules/Tooltip/Tooltip.js +41 -0
- package/dist/cjs/molecules/Tooltip/Tooltip.js.map +1 -0
- package/dist/cjs/molecules/Tooltip/index.d.ts +2 -0
- package/dist/cjs/molecules/Tooltip/index.js +9 -0
- package/dist/cjs/molecules/Tooltip/index.js.map +1 -0
- package/dist/esm/index.d.ts +4 -0
- package/dist/esm/index.js +2 -0
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/molecules/TextareaField/TextareaField.d.ts +32 -0
- package/dist/esm/molecules/TextareaField/TextareaField.js +29 -0
- package/dist/esm/molecules/TextareaField/TextareaField.js.map +1 -0
- package/dist/esm/molecules/TextareaField/index.d.ts +2 -0
- package/dist/esm/molecules/TextareaField/index.js +2 -0
- package/dist/esm/molecules/TextareaField/index.js.map +1 -0
- package/dist/esm/molecules/Tooltip/Tooltip.d.ts +49 -0
- package/dist/esm/molecules/Tooltip/Tooltip.js +38 -0
- package/dist/esm/molecules/Tooltip/Tooltip.js.map +1 -0
- package/dist/esm/molecules/Tooltip/index.d.ts +2 -0
- package/dist/esm/molecules/Tooltip/index.js +2 -0
- package/dist/esm/molecules/Tooltip/index.js.map +1 -0
- package/package.json +2 -2
- package/src/index.ts +4 -0
- package/src/molecules/TextareaField/TextareaField.tsx +102 -0
- package/src/molecules/TextareaField/index.ts +2 -0
- package/src/molecules/Tooltip/Tooltip.tsx +163 -0
- package/src/molecules/Tooltip/index.ts +2 -0
package/dist/cjs/index.d.ts
CHANGED
|
@@ -57,6 +57,8 @@ export { default as Gift, GiftContent, GiftImage } from './molecules/Gift';
|
|
|
57
57
|
export type { GiftProps, GiftContentProps, GiftImageProps, } from './molecules/Gift';
|
|
58
58
|
export { default as InputField } from './molecules/InputField';
|
|
59
59
|
export type { InputFieldProps } from './molecules/InputField';
|
|
60
|
+
export { default as TextareaField } from './molecules/TextareaField';
|
|
61
|
+
export type { TextareaFieldProps } from './molecules/TextareaField';
|
|
60
62
|
export { default as LinkButton } from './molecules/LinkButton';
|
|
61
63
|
export type { LinkButtonProps } from './molecules/LinkButton';
|
|
62
64
|
export { default as Modal, ModalHeader, ModalBody, ModalFooter, } from './molecules/Modal';
|
|
@@ -81,6 +83,8 @@ export { default as RatingField } from './molecules/RatingField';
|
|
|
81
83
|
export type { RatingFieldProps } from './molecules/RatingField';
|
|
82
84
|
export { default as RegionBar } from './molecules/RegionBar';
|
|
83
85
|
export type { RegionBarProps } from './molecules/RegionBar';
|
|
86
|
+
export { default as Tooltip } from './molecules/Tooltip';
|
|
87
|
+
export type { TooltipProps } from './molecules/Tooltip';
|
|
84
88
|
export { default as SearchProvider } from './molecules/SearchProvider';
|
|
85
89
|
export type { SearchProviderContextValue } from './molecules/SearchProvider';
|
|
86
90
|
export { default as SearchInputField } from './molecules/SearchInputField';
|
package/dist/cjs/index.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.
|
|
4
|
-
exports.
|
|
5
|
-
exports.SKUMatrixSidebar = exports.SKUMatrixTrigger = exports.SKUMatrix = exports.SlideOverHeader = exports.SlideOver = exports.ShippingSimulation = exports.SearchInput = exports.RegionModal = exports.ProductShelfItem = exports.ProductShelfItems = exports.ProductShelf = exports.ProductGridItem = exports.ProductGrid = exports.PriceRange = exports.PaymentMethods = exports.OutOfStock = exports.NewsletterHeader = exports.NewsletterForm = exports.NewsletterContent = exports.NewsletterAddendum = exports.Newsletter = exports.NavbarSliderFooter = exports.NavbarSliderContent = exports.NavbarSliderHeader = exports.NavbarSlider = exports.NavbarButtons = exports.NavbarRow = exports.NavbarHeader = exports.Navbar = exports.ImageGalleryViewer = exports.ImageGallerySelector = exports.ImageGallery = exports.HeroHeader = exports.HeroImage = exports.Hero = exports.FilterSlider = void 0;
|
|
3
|
+
exports.NavbarLinks = exports.ModalFooter = exports.ModalBody = exports.ModalHeader = exports.Modal = exports.LinkButton = exports.TextareaField = exports.InputField = exports.GiftImage = exports.GiftContent = exports.Gift = exports.DropdownMenu = exports.DropdownItem = exports.DropdownButton = exports.Dropdown = exports.DiscountBadge = exports.IconButton = exports.CheckboxField = exports.CartItemSummary = exports.CartItemImage = exports.CartItem = exports.Card = exports.CarouselBullets = exports.CarouselItem = exports.Carousel = exports.BuyButton = exports.Breadcrumb = exports.BreadcrumbPure = exports.Alert = exports.AccordionPanel = exports.AccordionButton = exports.AccordionItem = exports.Accordion = exports.SROnly = exports.Slider = exports.Select = exports.Skeleton = exports.Radio = exports.Price = exports.Overlay = exports.List = exports.Loader = exports.Link = exports.Label = exports.Textarea = exports.Input = exports.Icon = exports.Checkbox = exports.Button = exports.Badge = void 0;
|
|
4
|
+
exports.FilterFacetBooleanItem = exports.FilterFacetBoolean = exports.Filter = exports.EmptyState = exports.CartSidebarFooter = exports.CartSidebarList = exports.CartSidebar = exports.BannerTextContent = exports.BannerText = exports.QuantitySelector = exports.ToggleField = exports.Toggle = exports.Toast = exports.Tag = exports.TableRow = exports.TableHead = exports.TableFooter = exports.TableCell = exports.TableBody = exports.Table = exports.SkuSelector = exports.SelectField = exports.SearchTopTerm = exports.SearchTop = exports.SearchProductItemContent = exports.SearchProductItemImage = exports.SearchProductItem = exports.SearchProducts = exports.SearchHistoryTerm = exports.SearchHistory = exports.SearchDropdown = exports.SearchAutoCompleteTerm = exports.SearchAutoComplete = exports.SearchInputField = exports.SearchProvider = exports.Tooltip = exports.RegionBar = exports.RatingField = exports.Rating = exports.RadioOption = exports.RadioGroup = exports.RadioField = exports.ProductTitle = exports.ProductPrice = exports.ProductCardContent = exports.ProductCardImage = exports.ProductCard = exports.OrderSummary = exports.NavbarLinksListItem = exports.NavbarLinksList = void 0;
|
|
5
|
+
exports.SKUMatrixSidebar = exports.SKUMatrixTrigger = exports.SKUMatrix = exports.SlideOverHeader = exports.SlideOver = exports.ShippingSimulation = exports.SearchInput = exports.RegionModal = exports.ProductShelfItem = exports.ProductShelfItems = exports.ProductShelf = exports.ProductGridItem = exports.ProductGrid = exports.PriceRange = exports.PaymentMethods = exports.OutOfStock = exports.NewsletterHeader = exports.NewsletterForm = exports.NewsletterContent = exports.NewsletterAddendum = exports.Newsletter = exports.NavbarSliderFooter = exports.NavbarSliderContent = exports.NavbarSliderHeader = exports.NavbarSlider = exports.NavbarButtons = exports.NavbarRow = exports.NavbarHeader = exports.Navbar = exports.ImageGalleryViewer = exports.ImageGallerySelector = exports.ImageGallery = exports.HeroHeader = exports.HeroImage = exports.Hero = exports.FilterSlider = exports.FilterFacets = exports.FilterFacetRange = void 0;
|
|
6
6
|
const tslib_1 = require("tslib");
|
|
7
7
|
// Hooks
|
|
8
8
|
tslib_1.__exportStar(require("./hooks"), exports);
|
|
@@ -81,6 +81,8 @@ Object.defineProperty(exports, "GiftContent", { enumerable: true, get: function
|
|
|
81
81
|
Object.defineProperty(exports, "GiftImage", { enumerable: true, get: function () { return Gift_1.GiftImage; } });
|
|
82
82
|
var InputField_1 = require("./molecules/InputField");
|
|
83
83
|
Object.defineProperty(exports, "InputField", { enumerable: true, get: function () { return tslib_1.__importDefault(InputField_1).default; } });
|
|
84
|
+
var TextareaField_1 = require("./molecules/TextareaField");
|
|
85
|
+
Object.defineProperty(exports, "TextareaField", { enumerable: true, get: function () { return tslib_1.__importDefault(TextareaField_1).default; } });
|
|
84
86
|
var LinkButton_1 = require("./molecules/LinkButton");
|
|
85
87
|
Object.defineProperty(exports, "LinkButton", { enumerable: true, get: function () { return tslib_1.__importDefault(LinkButton_1).default; } });
|
|
86
88
|
var Modal_1 = require("./molecules/Modal");
|
|
@@ -113,6 +115,8 @@ var RatingField_1 = require("./molecules/RatingField");
|
|
|
113
115
|
Object.defineProperty(exports, "RatingField", { enumerable: true, get: function () { return tslib_1.__importDefault(RatingField_1).default; } });
|
|
114
116
|
var RegionBar_1 = require("./molecules/RegionBar");
|
|
115
117
|
Object.defineProperty(exports, "RegionBar", { enumerable: true, get: function () { return tslib_1.__importDefault(RegionBar_1).default; } });
|
|
118
|
+
var Tooltip_1 = require("./molecules/Tooltip");
|
|
119
|
+
Object.defineProperty(exports, "Tooltip", { enumerable: true, get: function () { return tslib_1.__importDefault(Tooltip_1).default; } });
|
|
116
120
|
var SearchProvider_1 = require("./molecules/SearchProvider");
|
|
117
121
|
Object.defineProperty(exports, "SearchProvider", { enumerable: true, get: function () { return tslib_1.__importDefault(SearchProvider_1).default; } });
|
|
118
122
|
var SearchInputField_1 = require("./molecules/SearchInputField");
|
package/dist/cjs/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;;;AAAA,QAAQ;AACR,kDAAuB;AAEvB,QAAQ;AACR,uCAAgD;AAAvC,uHAAA,OAAO,OAAS;AAEzB,yCAAkD;AAAzC,yHAAA,OAAO,OAAU;AAE1B,6CAAsD;AAA7C,6HAAA,OAAO,OAAY;AAE5B,qCAA8C;AAArC,qHAAA,OAAO,OAAQ;AAExB,uCAAgD;AAAvC,uHAAA,OAAO,OAAS;AAEzB,6CAAsD;AAA7C,6HAAA,OAAO,OAAY;AAE5B,uCAAgD;AAAvC,uHAAA,OAAO,OAAS;AAEzB,qCAA8C;AAArC,qHAAA,OAAO,OAAQ;AAExB,yCAAkD;AAAzC,yHAAA,OAAO,OAAU;AAE1B,qCAA8C;AAArC,qHAAA,OAAO,OAAQ;AAExB,2CAAoD;AAA3C,2HAAA,OAAO,OAAW;AAE3B,uCAAgD;AAAvC,uHAAA,OAAO,OAAS;AAEzB,uCAAgD;AAAvC,uHAAA,OAAO,OAAS;AAEzB,6CAAsD;AAA7C,6HAAA,OAAO,OAAY;AAE5B,yCAAkD;AAAzC,yHAAA,OAAO,OAAU;AAE1B,yCAAkD;AAAzC,yHAAA,OAAO,OAAU;AAE1B,yCAAkD;AAAzC,yHAAA,OAAO,OAAU;AAE1B,YAAY;AACZ,mDAK8B;AAJ5B,+HAAA,OAAO,OAAa;AACpB,0GAAA,aAAa,OAAA;AACb,4GAAA,eAAe,OAAA;AACf,2GAAA,cAAc,OAAA;AAQhB,2CAAoD;AAA3C,uHAAA,OAAO,OAAS;AAEzB,qDAAmE;AAA1D,4GAAA,cAAc,OAAA;AAAE,wGAAA,UAAU,OAAA;AAKnC,mDAA4D;AAAnD,+HAAA,OAAO,OAAa;AAE7B,iDAI6B;AAH3B,6HAAA,OAAO,OAAY;AACnB,wGAAA,YAAY,OAAA;AACZ,2GAAA,eAAe,OAAA;AAQjB,yCAAkD;AAAzC,qHAAA,OAAO,OAAQ;AAGxB,iDAI6B;AAH3B,6HAAA,OAAO,OAAY;AACnB,yGAAA,aAAa,OAAA;AACb,2GAAA,eAAe,OAAA;AAOjB,2DAAoE;AAA3D,uIAAA,OAAO,OAAiB;AAEjC,qDAA8D;AAArD,iIAAA,OAAO,OAAc;AAE9B,2DAAoE;AAA3D,uIAAA,OAAO,OAAiB;AAEjC,iDAK6B;AAJ3B,6HAAA,OAAO,OAAY;AACnB,0GAAA,cAAc,OAAA;AACd,wGAAA,YAAY,OAAA;AACZ,wGAAA,YAAY,OAAA;AAQd,yCAA0E;AAAjE,qHAAA,OAAO,OAAQ;AAAE,mGAAA,WAAW,OAAA;AAAE,iGAAA,SAAS,OAAA;AAMhD,qDAA8D;AAArD,iIAAA,OAAO,OAAc;AAE9B,qDAA8D;AAArD,iIAAA,OAAO,OAAc;AAE9B,2CAK0B;AAJxB,uHAAA,OAAO,OAAS;AAChB,oGAAA,WAAW,OAAA;AACX,kGAAA,SAAS,OAAA;AACT,oGAAA,WAAW,OAAA;AAGb,uDAIgC;AAH9B,mIAAA,OAAO,OAAe;AACtB,8GAAA,eAAe,OAAA;AACf,kHAAA,mBAAmB,OAAA;AAOrB,yDAAkE;AAAzD,qIAAA,OAAO,OAAgB;AAEhC,uDAIgC;AAH9B,mIAAA,OAAO,OAAe;AACtB,+GAAA,gBAAgB,OAAA;AAChB,iHAAA,kBAAkB,OAAA;AAOpB,yDAAkE;AAAzD,qIAAA,OAAO,OAAgB;AAEhC,yDAAkE;AAAzD,qIAAA,OAAO,OAAgB;AAEhC,qDAA8D;AAArD,iIAAA,OAAO,OAAc;AAE9B,qDAA2E;AAAlE,iIAAA,OAAO,OAAc;AAAE,yGAAA,WAAW,OAAA;AAE3C,6CAAsD;AAA7C,yHAAA,OAAO,OAAU;AAE1B,uDAAgE;AAAvD,mIAAA,OAAO,OAAe;AAE/B,mDAA4D;AAAnD,+HAAA,OAAO,OAAa;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import type { MutableRefObject } from 'react';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import type { TextareaProps } from '../..';
|
|
4
|
+
type DefaultProps = {
|
|
5
|
+
/**
|
|
6
|
+
* ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
|
|
7
|
+
*/
|
|
8
|
+
testId?: string;
|
|
9
|
+
/**
|
|
10
|
+
* ID to identify textarea and corresponding label.
|
|
11
|
+
*/
|
|
12
|
+
id: string;
|
|
13
|
+
/**
|
|
14
|
+
* The text displayed to identify textarea.
|
|
15
|
+
*/
|
|
16
|
+
label: string;
|
|
17
|
+
/**
|
|
18
|
+
* The error message is displayed when an error occurs.
|
|
19
|
+
*/
|
|
20
|
+
error?: string;
|
|
21
|
+
/**
|
|
22
|
+
* Component's ref.
|
|
23
|
+
*/
|
|
24
|
+
textareaRef?: MutableRefObject<HTMLTextAreaElement | null>;
|
|
25
|
+
/**
|
|
26
|
+
* Specifies that the whole textarea component should be disabled.
|
|
27
|
+
*/
|
|
28
|
+
disabled?: boolean;
|
|
29
|
+
};
|
|
30
|
+
export type TextareaFieldProps = DefaultProps & Omit<TextareaProps, 'disabled' | 'onSubmit'>;
|
|
31
|
+
declare const TextareaField: ({ id, label, error, placeholder, textareaRef, disabled, value, testId, ...otherProps }: TextareaFieldProps) => React.JSX.Element;
|
|
32
|
+
export default TextareaField;
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const tslib_1 = require("tslib");
|
|
4
|
+
const react_1 = tslib_1.__importStar(require("react"));
|
|
5
|
+
const __1 = require("../..");
|
|
6
|
+
const TextareaField = ({ id, label, error, placeholder = ' ', // initializes with an empty space to style float label using `placeholder-shown`
|
|
7
|
+
textareaRef, disabled, value, testId = 'fs-textarea-field', ...otherProps }) => {
|
|
8
|
+
const shouldDisplayError = !disabled && error && error !== '';
|
|
9
|
+
const textareaInternalRef = (0, react_1.useRef)(null);
|
|
10
|
+
const ref = textareaRef || textareaInternalRef;
|
|
11
|
+
(0, react_1.useEffect)(() => {
|
|
12
|
+
const textarea = ref?.current;
|
|
13
|
+
if (!textarea)
|
|
14
|
+
return;
|
|
15
|
+
const updateSize = () => {
|
|
16
|
+
textarea.parentElement?.style.setProperty('--fs-textarea-width', `${textarea.offsetWidth}px`);
|
|
17
|
+
textarea.parentElement?.style.setProperty('--fs-textarea-height', `${textarea.offsetHeight}px`);
|
|
18
|
+
};
|
|
19
|
+
updateSize();
|
|
20
|
+
const resizeObserver = new ResizeObserver(updateSize);
|
|
21
|
+
resizeObserver.observe(textarea);
|
|
22
|
+
return () => {
|
|
23
|
+
resizeObserver.disconnect();
|
|
24
|
+
};
|
|
25
|
+
}, [ref]);
|
|
26
|
+
return (react_1.default.createElement("div", { "data-fs-textarea-field": true, "data-fs-textarea-field-error": error && error !== '', "data-testid": testId },
|
|
27
|
+
react_1.default.createElement(__1.Textarea, { id: id, value: value, ref: ref, disabled: disabled, placeholder: placeholder, ...otherProps }),
|
|
28
|
+
react_1.default.createElement(__1.Label, { "data-fs-textarea-field-label": true, htmlFor: id }, label),
|
|
29
|
+
shouldDisplayError && (react_1.default.createElement("span", { "data-fs-textarea-field-error-message": true }, error))));
|
|
30
|
+
};
|
|
31
|
+
exports.default = TextareaField;
|
|
32
|
+
//# sourceMappingURL=TextareaField.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TextareaField.js","sourceRoot":"","sources":["../../../../src/molecules/TextareaField/TextareaField.tsx"],"names":[],"mappings":";;;AACA,uDAAgD;AAGhD,6BAAuC;AAgCvC,MAAM,aAAa,GAAG,CAAC,EACrB,EAAE,EACF,KAAK,EACL,KAAK,EACL,WAAW,GAAG,GAAG,EAAE,iFAAiF;AACpG,WAAW,EACX,QAAQ,EACR,KAAK,EACL,MAAM,GAAG,mBAAmB,EAC5B,GAAG,UAAU,EACM,EAAE,EAAE;IACvB,MAAM,kBAAkB,GAAG,CAAC,QAAQ,IAAI,KAAK,IAAI,KAAK,KAAK,EAAE,CAAA;IAC7D,MAAM,mBAAmB,GAAG,IAAA,cAAM,EAA6B,IAAI,CAAC,CAAA;IACpE,MAAM,GAAG,GAAG,WAAW,IAAI,mBAAmB,CAAA;IAE9C,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,MAAM,QAAQ,GAAG,GAAG,EAAE,OAAO,CAAA;QAC7B,IAAI,CAAC,QAAQ;YAAE,OAAM;QAErB,MAAM,UAAU,GAAG,GAAG,EAAE;YACtB,QAAQ,CAAC,aAAa,EAAE,KAAK,CAAC,WAAW,CACvC,qBAAqB,EACrB,GAAG,QAAQ,CAAC,WAAW,IAAI,CAC5B,CAAA;YACD,QAAQ,CAAC,aAAa,EAAE,KAAK,CAAC,WAAW,CACvC,sBAAsB,EACtB,GAAG,QAAQ,CAAC,YAAY,IAAI,CAC7B,CAAA;QACH,CAAC,CAAA;QAED,UAAU,EAAE,CAAA;QAEZ,MAAM,cAAc,GAAG,IAAI,cAAc,CAAC,UAAU,CAAC,CAAA;QACrD,cAAc,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAA;QAEhC,OAAO,GAAG,EAAE;YACV,cAAc,CAAC,UAAU,EAAE,CAAA;QAC7B,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,CAAA;IAET,OAAO,CACL,uGAEgC,KAAK,IAAI,KAAK,KAAK,EAAE,iBACtC,MAAM;QAEnB,8BAAC,YAAQ,IACP,EAAE,EAAE,EAAE,EACN,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,WAAW,KACpB,UAAU,GACd;QACF,8BAAC,SAAK,0CAA8B,OAAO,EAAE,EAAE,IAC5C,KAAK,CACA;QAEP,kBAAkB,IAAI,CACrB,wFAA4C,KAAK,CAAQ,CAC1D,CACG,CACP,CAAA;AACH,CAAC,CAAA;AAED,kBAAe,aAAa,CAAA"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var TextareaField_1 = require("./TextareaField");
|
|
8
|
+
Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(TextareaField_1).default; } });
|
|
9
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/molecules/TextareaField/index.ts"],"names":[],"mappings":";;;;;;AAAA,iDAAyC;AAAhC,yHAAA,OAAO,OAAA"}
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import React, { type ReactNode, type HTMLAttributes } from 'react';
|
|
2
|
+
/**
|
|
3
|
+
* Specifies tooltip position.
|
|
4
|
+
*/
|
|
5
|
+
export type Side = 'top' | 'right' | 'bottom' | 'left';
|
|
6
|
+
/**
|
|
7
|
+
* Specifies tooltip alignment.
|
|
8
|
+
*/
|
|
9
|
+
export type Alignment = 'start' | 'center' | 'end';
|
|
10
|
+
/**
|
|
11
|
+
* Combines side + alignment (e.g., "top-start").
|
|
12
|
+
*/
|
|
13
|
+
export type Placement = `${Side}-${Alignment}`;
|
|
14
|
+
export interface TooltipProps extends Omit<HTMLAttributes<HTMLDivElement>, 'content'> {
|
|
15
|
+
/**
|
|
16
|
+
* Text/content of the tooltip.
|
|
17
|
+
*/
|
|
18
|
+
content: ReactNode;
|
|
19
|
+
/**
|
|
20
|
+
* Defines the side or side-alignment (e.g., "top-center", "right-end") of the tooltip.
|
|
21
|
+
*/
|
|
22
|
+
placement?: Placement;
|
|
23
|
+
/**
|
|
24
|
+
* If the tooltip can be closed by a button.
|
|
25
|
+
*/
|
|
26
|
+
dismissible?: boolean;
|
|
27
|
+
/**
|
|
28
|
+
* Called when the dismiss button is clicked.
|
|
29
|
+
*/
|
|
30
|
+
onDismiss?: (ev: React.KeyboardEvent<HTMLDivElement> | React.MouseEvent<HTMLButtonElement>) => void;
|
|
31
|
+
/**
|
|
32
|
+
* Element that activates the tooltip on hover/focus.
|
|
33
|
+
*/
|
|
34
|
+
children: ReactNode;
|
|
35
|
+
/**
|
|
36
|
+
* ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
|
|
37
|
+
*/
|
|
38
|
+
testId?: string;
|
|
39
|
+
/**
|
|
40
|
+
* Maximum width of the tooltip.
|
|
41
|
+
*/
|
|
42
|
+
maxWidth?: number;
|
|
43
|
+
/**
|
|
44
|
+
* ID for the tooltip content to be used with aria-describedby.
|
|
45
|
+
*/
|
|
46
|
+
describedById?: string;
|
|
47
|
+
}
|
|
48
|
+
declare const Tooltip: React.ForwardRefExoticComponent<TooltipProps & React.RefAttributes<HTMLDivElement>>;
|
|
49
|
+
export default Tooltip;
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const tslib_1 = require("tslib");
|
|
4
|
+
const react_1 = tslib_1.__importStar(require("react"));
|
|
5
|
+
const Icon_1 = tslib_1.__importDefault(require("../../atoms/Icon"));
|
|
6
|
+
const IconButton_1 = tslib_1.__importDefault(require("../IconButton"));
|
|
7
|
+
const Tooltip = (0, react_1.forwardRef)(function Tooltip({ content, placement = 'top-center', dismissible = false, onDismiss, children, testId = 'fs-tooltip', maxWidth = 300, describedById = 'tooltip-content', ...otherProps }, ref) {
|
|
8
|
+
const [open, setOpen] = (0, react_1.useState)(false);
|
|
9
|
+
const [dismissed, setDismissed] = (0, react_1.useState)(false);
|
|
10
|
+
const dismissButtonRef = (0, react_1.useRef)(null);
|
|
11
|
+
const triggerRef = (0, react_1.useRef)(null);
|
|
12
|
+
const handleDismiss = (ev) => {
|
|
13
|
+
onDismiss?.(ev);
|
|
14
|
+
setOpen(false);
|
|
15
|
+
setDismissed(true);
|
|
16
|
+
};
|
|
17
|
+
const toggleOpen = () => {
|
|
18
|
+
if (dismissed) {
|
|
19
|
+
setDismissed(false);
|
|
20
|
+
}
|
|
21
|
+
setOpen(true);
|
|
22
|
+
};
|
|
23
|
+
const handleKeyDown = (event) => {
|
|
24
|
+
if (event.key === 'Escape') {
|
|
25
|
+
handleDismiss(event);
|
|
26
|
+
}
|
|
27
|
+
};
|
|
28
|
+
(0, react_1.useEffect)(() => {
|
|
29
|
+
if (open && dismissible) {
|
|
30
|
+
dismissButtonRef.current?.focus();
|
|
31
|
+
}
|
|
32
|
+
}, [open, dismissible]);
|
|
33
|
+
return (react_1.default.createElement("div", { "data-fs-tooltip": true, onMouseEnter: toggleOpen, onMouseLeave: () => setOpen(false), onFocus: toggleOpen, onBlur: () => setOpen(false), "data-testid": testId, "aria-describedby": describedById, onKeyDown: handleKeyDown, tabIndex: 0, ref: triggerRef },
|
|
34
|
+
children,
|
|
35
|
+
open && !dismissed && (react_1.default.createElement("div", { ref: ref, "data-fs-tooltip-wrapper": true, "data-fs-tooltip-placement": placement, "data-fs-tooltip-dismissible": dismissible, role: "tooltip", onKeyDown: handleKeyDown, style: { maxWidth }, ...otherProps },
|
|
36
|
+
react_1.default.createElement("div", { "data-fs-tooltip-content": true, id: describedById }, content),
|
|
37
|
+
dismissible && (react_1.default.createElement(IconButton_1.default, { size: "small", variant: "tertiary", inverse: true, icon: react_1.default.createElement(Icon_1.default, { name: "X", width: 20, height: 20 }), "aria-label": "Dismiss tooltip", "data-fs-tooltip-dismiss-button": true, onClick: handleDismiss, ref: dismissButtonRef })),
|
|
38
|
+
react_1.default.createElement("div", { "data-fs-tooltip-indicator": true, "aria-hidden": "true" })))));
|
|
39
|
+
});
|
|
40
|
+
exports.default = Tooltip;
|
|
41
|
+
//# sourceMappingURL=Tooltip.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../../src/molecules/Tooltip/Tooltip.tsx"],"names":[],"mappings":";;;AAAA,uDAOc;AACd,oEAAmC;AACnC,uEAAsC;AAyDtC,MAAM,OAAO,GAAG,IAAA,kBAAU,EAA+B,SAAS,OAAO,CACvE,EACE,OAAO,EACP,SAAS,GAAG,YAAY,EACxB,WAAW,GAAG,KAAK,EACnB,SAAS,EACT,QAAQ,EACR,MAAM,GAAG,YAAY,EACrB,QAAQ,GAAG,GAAG,EACd,aAAa,GAAG,iBAAiB,EACjC,GAAG,UAAU,EACd,EACD,GAAG;IAEH,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAA;IACvC,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAA;IACjD,MAAM,gBAAgB,GAAG,IAAA,cAAM,EAAoB,IAAI,CAAC,CAAA;IACxD,MAAM,UAAU,GAAG,IAAA,cAAM,EAAiB,IAAI,CAAC,CAAA;IAE/C,MAAM,aAAa,GAAG,CACpB,EAEuC,EACvC,EAAE;QACF,SAAS,EAAE,CAAC,EAAE,CAAC,CAAA;QACf,OAAO,CAAC,KAAK,CAAC,CAAA;QACd,YAAY,CAAC,IAAI,CAAC,CAAA;IACpB,CAAC,CAAA;IAED,MAAM,UAAU,GAAG,GAAG,EAAE;QACtB,IAAI,SAAS,EAAE,CAAC;YACd,YAAY,CAAC,KAAK,CAAC,CAAA;QACrB,CAAC;QACD,OAAO,CAAC,IAAI,CAAC,CAAA;IACf,CAAC,CAAA;IAED,MAAM,aAAa,GAAG,CAAC,KAA0C,EAAE,EAAE;QACnE,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE,CAAC;YAC3B,aAAa,CAAC,KAAK,CAAC,CAAA;QACtB,CAAC;IACH,CAAC,CAAA;IAED,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,IAAI,IAAI,WAAW,EAAE,CAAC;YACxB,gBAAgB,CAAC,OAAO,EAAE,KAAK,EAAE,CAAA;QACnC,CAAC;IACH,CAAC,EAAE,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC,CAAA;IAEvB,OAAO,CACL,gEAEE,YAAY,EAAE,UAAU,EACxB,YAAY,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,EAClC,OAAO,EAAE,UAAU,EACnB,MAAM,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,iBACf,MAAM,sBACD,aAAa,EAC/B,SAAS,EAAE,aAAa,EACxB,QAAQ,EAAE,CAAC,EACX,GAAG,EAAE,UAAU;QAEd,QAAQ;QAER,IAAI,IAAI,CAAC,SAAS,IAAI,CACrB,uCACE,GAAG,EAAE,GAAG,gEAEmB,SAAS,iCACP,WAAW,EACxC,IAAI,EAAC,SAAS,EACd,SAAS,EAAE,aAAa,EACxB,KAAK,EAAE,EAAE,QAAQ,EAAE,KACf,UAAU;YAEd,wEAA6B,EAAE,EAAE,aAAa,IAC3C,OAAO,CACJ;YACL,WAAW,IAAI,CACd,8BAAC,oBAAU,IACT,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,UAAU,EAClB,OAAO,QACP,IAAI,EAAE,8BAAC,cAAI,IAAC,IAAI,EAAC,GAAG,EAAC,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,GAAI,gBACnC,iBAAiB,0CAE5B,OAAO,EAAE,aAAa,EACtB,GAAG,EAAE,gBAAgB,GACrB,CACH;YACD,yFAA2C,MAAM,GAAG,CAChD,CACP,CACG,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,kBAAe,OAAO,CAAA"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var Tooltip_1 = require("./Tooltip");
|
|
8
|
+
Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Tooltip_1).default; } });
|
|
9
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/molecules/Tooltip/index.ts"],"names":[],"mappings":";;;;;;AAAA,qCAAmC;AAA1B,mHAAA,OAAO,OAAA"}
|
package/dist/esm/index.d.ts
CHANGED
|
@@ -57,6 +57,8 @@ export { default as Gift, GiftContent, GiftImage } from './molecules/Gift';
|
|
|
57
57
|
export type { GiftProps, GiftContentProps, GiftImageProps, } from './molecules/Gift';
|
|
58
58
|
export { default as InputField } from './molecules/InputField';
|
|
59
59
|
export type { InputFieldProps } from './molecules/InputField';
|
|
60
|
+
export { default as TextareaField } from './molecules/TextareaField';
|
|
61
|
+
export type { TextareaFieldProps } from './molecules/TextareaField';
|
|
60
62
|
export { default as LinkButton } from './molecules/LinkButton';
|
|
61
63
|
export type { LinkButtonProps } from './molecules/LinkButton';
|
|
62
64
|
export { default as Modal, ModalHeader, ModalBody, ModalFooter, } from './molecules/Modal';
|
|
@@ -81,6 +83,8 @@ export { default as RatingField } from './molecules/RatingField';
|
|
|
81
83
|
export type { RatingFieldProps } from './molecules/RatingField';
|
|
82
84
|
export { default as RegionBar } from './molecules/RegionBar';
|
|
83
85
|
export type { RegionBarProps } from './molecules/RegionBar';
|
|
86
|
+
export { default as Tooltip } from './molecules/Tooltip';
|
|
87
|
+
export type { TooltipProps } from './molecules/Tooltip';
|
|
84
88
|
export { default as SearchProvider } from './molecules/SearchProvider';
|
|
85
89
|
export type { SearchProviderContextValue } from './molecules/SearchProvider';
|
|
86
90
|
export { default as SearchInputField } from './molecules/SearchInputField';
|
package/dist/esm/index.js
CHANGED
|
@@ -32,6 +32,7 @@ export { default as DiscountBadge } from './molecules/DiscountBadge';
|
|
|
32
32
|
export { default as Dropdown, DropdownButton, DropdownItem, DropdownMenu, } from './molecules/Dropdown';
|
|
33
33
|
export { default as Gift, GiftContent, GiftImage } from './molecules/Gift';
|
|
34
34
|
export { default as InputField } from './molecules/InputField';
|
|
35
|
+
export { default as TextareaField } from './molecules/TextareaField';
|
|
35
36
|
export { default as LinkButton } from './molecules/LinkButton';
|
|
36
37
|
export { default as Modal, ModalHeader, ModalBody, ModalFooter, } from './molecules/Modal';
|
|
37
38
|
export { default as NavbarLinks, NavbarLinksList, NavbarLinksListItem, } from './molecules/NavbarLinks';
|
|
@@ -44,6 +45,7 @@ export { default as RadioGroup, RadioOption } from './molecules/RadioGroup';
|
|
|
44
45
|
export { default as Rating } from './molecules/Rating';
|
|
45
46
|
export { default as RatingField } from './molecules/RatingField';
|
|
46
47
|
export { default as RegionBar } from './molecules/RegionBar';
|
|
48
|
+
export { default as Tooltip } from './molecules/Tooltip';
|
|
47
49
|
export { default as SearchProvider } from './molecules/SearchProvider';
|
|
48
50
|
export { default as SearchInputField } from './molecules/SearchInputField';
|
|
49
51
|
export { default as SearchAutoComplete, SearchAutoCompleteTerm, } from './molecules/SearchAutoComplete';
|
package/dist/esm/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import type { MutableRefObject } from 'react';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import type { TextareaProps } from '../..';
|
|
4
|
+
type DefaultProps = {
|
|
5
|
+
/**
|
|
6
|
+
* ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
|
|
7
|
+
*/
|
|
8
|
+
testId?: string;
|
|
9
|
+
/**
|
|
10
|
+
* ID to identify textarea and corresponding label.
|
|
11
|
+
*/
|
|
12
|
+
id: string;
|
|
13
|
+
/**
|
|
14
|
+
* The text displayed to identify textarea.
|
|
15
|
+
*/
|
|
16
|
+
label: string;
|
|
17
|
+
/**
|
|
18
|
+
* The error message is displayed when an error occurs.
|
|
19
|
+
*/
|
|
20
|
+
error?: string;
|
|
21
|
+
/**
|
|
22
|
+
* Component's ref.
|
|
23
|
+
*/
|
|
24
|
+
textareaRef?: MutableRefObject<HTMLTextAreaElement | null>;
|
|
25
|
+
/**
|
|
26
|
+
* Specifies that the whole textarea component should be disabled.
|
|
27
|
+
*/
|
|
28
|
+
disabled?: boolean;
|
|
29
|
+
};
|
|
30
|
+
export type TextareaFieldProps = DefaultProps & Omit<TextareaProps, 'disabled' | 'onSubmit'>;
|
|
31
|
+
declare const TextareaField: ({ id, label, error, placeholder, textareaRef, disabled, value, testId, ...otherProps }: TextareaFieldProps) => React.JSX.Element;
|
|
32
|
+
export default TextareaField;
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import React, { useEffect, useRef } from 'react';
|
|
2
|
+
import { Textarea, Label } from '../..';
|
|
3
|
+
const TextareaField = ({ id, label, error, placeholder = ' ', // initializes with an empty space to style float label using `placeholder-shown`
|
|
4
|
+
textareaRef, disabled, value, testId = 'fs-textarea-field', ...otherProps }) => {
|
|
5
|
+
const shouldDisplayError = !disabled && error && error !== '';
|
|
6
|
+
const textareaInternalRef = useRef(null);
|
|
7
|
+
const ref = textareaRef || textareaInternalRef;
|
|
8
|
+
useEffect(() => {
|
|
9
|
+
const textarea = ref?.current;
|
|
10
|
+
if (!textarea)
|
|
11
|
+
return;
|
|
12
|
+
const updateSize = () => {
|
|
13
|
+
textarea.parentElement?.style.setProperty('--fs-textarea-width', `${textarea.offsetWidth}px`);
|
|
14
|
+
textarea.parentElement?.style.setProperty('--fs-textarea-height', `${textarea.offsetHeight}px`);
|
|
15
|
+
};
|
|
16
|
+
updateSize();
|
|
17
|
+
const resizeObserver = new ResizeObserver(updateSize);
|
|
18
|
+
resizeObserver.observe(textarea);
|
|
19
|
+
return () => {
|
|
20
|
+
resizeObserver.disconnect();
|
|
21
|
+
};
|
|
22
|
+
}, [ref]);
|
|
23
|
+
return (React.createElement("div", { "data-fs-textarea-field": true, "data-fs-textarea-field-error": error && error !== '', "data-testid": testId },
|
|
24
|
+
React.createElement(Textarea, { id: id, value: value, ref: ref, disabled: disabled, placeholder: placeholder, ...otherProps }),
|
|
25
|
+
React.createElement(Label, { "data-fs-textarea-field-label": true, htmlFor: id }, label),
|
|
26
|
+
shouldDisplayError && (React.createElement("span", { "data-fs-textarea-field-error-message": true }, error))));
|
|
27
|
+
};
|
|
28
|
+
export default TextareaField;
|
|
29
|
+
//# sourceMappingURL=TextareaField.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TextareaField.js","sourceRoot":"","sources":["../../../../src/molecules/TextareaField/TextareaField.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAGhD,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,OAAO,CAAA;AAgCvC,MAAM,aAAa,GAAG,CAAC,EACrB,EAAE,EACF,KAAK,EACL,KAAK,EACL,WAAW,GAAG,GAAG,EAAE,iFAAiF;AACpG,WAAW,EACX,QAAQ,EACR,KAAK,EACL,MAAM,GAAG,mBAAmB,EAC5B,GAAG,UAAU,EACM,EAAE,EAAE;IACvB,MAAM,kBAAkB,GAAG,CAAC,QAAQ,IAAI,KAAK,IAAI,KAAK,KAAK,EAAE,CAAA;IAC7D,MAAM,mBAAmB,GAAG,MAAM,CAA6B,IAAI,CAAC,CAAA;IACpE,MAAM,GAAG,GAAG,WAAW,IAAI,mBAAmB,CAAA;IAE9C,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,QAAQ,GAAG,GAAG,EAAE,OAAO,CAAA;QAC7B,IAAI,CAAC,QAAQ;YAAE,OAAM;QAErB,MAAM,UAAU,GAAG,GAAG,EAAE;YACtB,QAAQ,CAAC,aAAa,EAAE,KAAK,CAAC,WAAW,CACvC,qBAAqB,EACrB,GAAG,QAAQ,CAAC,WAAW,IAAI,CAC5B,CAAA;YACD,QAAQ,CAAC,aAAa,EAAE,KAAK,CAAC,WAAW,CACvC,sBAAsB,EACtB,GAAG,QAAQ,CAAC,YAAY,IAAI,CAC7B,CAAA;QACH,CAAC,CAAA;QAED,UAAU,EAAE,CAAA;QAEZ,MAAM,cAAc,GAAG,IAAI,cAAc,CAAC,UAAU,CAAC,CAAA;QACrD,cAAc,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAA;QAEhC,OAAO,GAAG,EAAE;YACV,cAAc,CAAC,UAAU,EAAE,CAAA;QAC7B,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,CAAA;IAET,OAAO,CACL,6FAEgC,KAAK,IAAI,KAAK,KAAK,EAAE,iBACtC,MAAM;QAEnB,oBAAC,QAAQ,IACP,EAAE,EAAE,EAAE,EACN,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,WAAW,KACpB,UAAU,GACd;QACF,oBAAC,KAAK,0CAA8B,OAAO,EAAE,EAAE,IAC5C,KAAK,CACA;QAEP,kBAAkB,IAAI,CACrB,8EAA4C,KAAK,CAAQ,CAC1D,CACG,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,aAAa,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/molecules/TextareaField/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAA"}
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import React, { type ReactNode, type HTMLAttributes } from 'react';
|
|
2
|
+
/**
|
|
3
|
+
* Specifies tooltip position.
|
|
4
|
+
*/
|
|
5
|
+
export type Side = 'top' | 'right' | 'bottom' | 'left';
|
|
6
|
+
/**
|
|
7
|
+
* Specifies tooltip alignment.
|
|
8
|
+
*/
|
|
9
|
+
export type Alignment = 'start' | 'center' | 'end';
|
|
10
|
+
/**
|
|
11
|
+
* Combines side + alignment (e.g., "top-start").
|
|
12
|
+
*/
|
|
13
|
+
export type Placement = `${Side}-${Alignment}`;
|
|
14
|
+
export interface TooltipProps extends Omit<HTMLAttributes<HTMLDivElement>, 'content'> {
|
|
15
|
+
/**
|
|
16
|
+
* Text/content of the tooltip.
|
|
17
|
+
*/
|
|
18
|
+
content: ReactNode;
|
|
19
|
+
/**
|
|
20
|
+
* Defines the side or side-alignment (e.g., "top-center", "right-end") of the tooltip.
|
|
21
|
+
*/
|
|
22
|
+
placement?: Placement;
|
|
23
|
+
/**
|
|
24
|
+
* If the tooltip can be closed by a button.
|
|
25
|
+
*/
|
|
26
|
+
dismissible?: boolean;
|
|
27
|
+
/**
|
|
28
|
+
* Called when the dismiss button is clicked.
|
|
29
|
+
*/
|
|
30
|
+
onDismiss?: (ev: React.KeyboardEvent<HTMLDivElement> | React.MouseEvent<HTMLButtonElement>) => void;
|
|
31
|
+
/**
|
|
32
|
+
* Element that activates the tooltip on hover/focus.
|
|
33
|
+
*/
|
|
34
|
+
children: ReactNode;
|
|
35
|
+
/**
|
|
36
|
+
* ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
|
|
37
|
+
*/
|
|
38
|
+
testId?: string;
|
|
39
|
+
/**
|
|
40
|
+
* Maximum width of the tooltip.
|
|
41
|
+
*/
|
|
42
|
+
maxWidth?: number;
|
|
43
|
+
/**
|
|
44
|
+
* ID for the tooltip content to be used with aria-describedby.
|
|
45
|
+
*/
|
|
46
|
+
describedById?: string;
|
|
47
|
+
}
|
|
48
|
+
declare const Tooltip: React.ForwardRefExoticComponent<TooltipProps & React.RefAttributes<HTMLDivElement>>;
|
|
49
|
+
export default Tooltip;
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import React, { useState, forwardRef, useRef, useEffect, } from 'react';
|
|
2
|
+
import Icon from '../../atoms/Icon';
|
|
3
|
+
import IconButton from '../IconButton';
|
|
4
|
+
const Tooltip = forwardRef(function Tooltip({ content, placement = 'top-center', dismissible = false, onDismiss, children, testId = 'fs-tooltip', maxWidth = 300, describedById = 'tooltip-content', ...otherProps }, ref) {
|
|
5
|
+
const [open, setOpen] = useState(false);
|
|
6
|
+
const [dismissed, setDismissed] = useState(false);
|
|
7
|
+
const dismissButtonRef = useRef(null);
|
|
8
|
+
const triggerRef = useRef(null);
|
|
9
|
+
const handleDismiss = (ev) => {
|
|
10
|
+
onDismiss?.(ev);
|
|
11
|
+
setOpen(false);
|
|
12
|
+
setDismissed(true);
|
|
13
|
+
};
|
|
14
|
+
const toggleOpen = () => {
|
|
15
|
+
if (dismissed) {
|
|
16
|
+
setDismissed(false);
|
|
17
|
+
}
|
|
18
|
+
setOpen(true);
|
|
19
|
+
};
|
|
20
|
+
const handleKeyDown = (event) => {
|
|
21
|
+
if (event.key === 'Escape') {
|
|
22
|
+
handleDismiss(event);
|
|
23
|
+
}
|
|
24
|
+
};
|
|
25
|
+
useEffect(() => {
|
|
26
|
+
if (open && dismissible) {
|
|
27
|
+
dismissButtonRef.current?.focus();
|
|
28
|
+
}
|
|
29
|
+
}, [open, dismissible]);
|
|
30
|
+
return (React.createElement("div", { "data-fs-tooltip": true, onMouseEnter: toggleOpen, onMouseLeave: () => setOpen(false), onFocus: toggleOpen, onBlur: () => setOpen(false), "data-testid": testId, "aria-describedby": describedById, onKeyDown: handleKeyDown, tabIndex: 0, ref: triggerRef },
|
|
31
|
+
children,
|
|
32
|
+
open && !dismissed && (React.createElement("div", { ref: ref, "data-fs-tooltip-wrapper": true, "data-fs-tooltip-placement": placement, "data-fs-tooltip-dismissible": dismissible, role: "tooltip", onKeyDown: handleKeyDown, style: { maxWidth }, ...otherProps },
|
|
33
|
+
React.createElement("div", { "data-fs-tooltip-content": true, id: describedById }, content),
|
|
34
|
+
dismissible && (React.createElement(IconButton, { size: "small", variant: "tertiary", inverse: true, icon: React.createElement(Icon, { name: "X", width: 20, height: 20 }), "aria-label": "Dismiss tooltip", "data-fs-tooltip-dismiss-button": true, onClick: handleDismiss, ref: dismissButtonRef })),
|
|
35
|
+
React.createElement("div", { "data-fs-tooltip-indicator": true, "aria-hidden": "true" })))));
|
|
36
|
+
});
|
|
37
|
+
export default Tooltip;
|
|
38
|
+
//# sourceMappingURL=Tooltip.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../../src/molecules/Tooltip/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAEZ,QAAQ,EACR,UAAU,EAEV,MAAM,EACN,SAAS,GACV,MAAM,OAAO,CAAA;AACd,OAAO,IAAI,MAAM,kBAAkB,CAAA;AACnC,OAAO,UAAU,MAAM,eAAe,CAAA;AAyDtC,MAAM,OAAO,GAAG,UAAU,CAA+B,SAAS,OAAO,CACvE,EACE,OAAO,EACP,SAAS,GAAG,YAAY,EACxB,WAAW,GAAG,KAAK,EACnB,SAAS,EACT,QAAQ,EACR,MAAM,GAAG,YAAY,EACrB,QAAQ,GAAG,GAAG,EACd,aAAa,GAAG,iBAAiB,EACjC,GAAG,UAAU,EACd,EACD,GAAG;IAEH,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IACvC,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IACjD,MAAM,gBAAgB,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAA;IACxD,MAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAA;IAE/C,MAAM,aAAa,GAAG,CACpB,EAEuC,EACvC,EAAE;QACF,SAAS,EAAE,CAAC,EAAE,CAAC,CAAA;QACf,OAAO,CAAC,KAAK,CAAC,CAAA;QACd,YAAY,CAAC,IAAI,CAAC,CAAA;IACpB,CAAC,CAAA;IAED,MAAM,UAAU,GAAG,GAAG,EAAE;QACtB,IAAI,SAAS,EAAE,CAAC;YACd,YAAY,CAAC,KAAK,CAAC,CAAA;QACrB,CAAC;QACD,OAAO,CAAC,IAAI,CAAC,CAAA;IACf,CAAC,CAAA;IAED,MAAM,aAAa,GAAG,CAAC,KAA0C,EAAE,EAAE;QACnE,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE,CAAC;YAC3B,aAAa,CAAC,KAAK,CAAC,CAAA;QACtB,CAAC;IACH,CAAC,CAAA;IAED,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,IAAI,IAAI,WAAW,EAAE,CAAC;YACxB,gBAAgB,CAAC,OAAO,EAAE,KAAK,EAAE,CAAA;QACnC,CAAC;IACH,CAAC,EAAE,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC,CAAA;IAEvB,OAAO,CACL,sDAEE,YAAY,EAAE,UAAU,EACxB,YAAY,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,EAClC,OAAO,EAAE,UAAU,EACnB,MAAM,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,iBACf,MAAM,sBACD,aAAa,EAC/B,SAAS,EAAE,aAAa,EACxB,QAAQ,EAAE,CAAC,EACX,GAAG,EAAE,UAAU;QAEd,QAAQ;QAER,IAAI,IAAI,CAAC,SAAS,IAAI,CACrB,6BACE,GAAG,EAAE,GAAG,gEAEmB,SAAS,iCACP,WAAW,EACxC,IAAI,EAAC,SAAS,EACd,SAAS,EAAE,aAAa,EACxB,KAAK,EAAE,EAAE,QAAQ,EAAE,KACf,UAAU;YAEd,8DAA6B,EAAE,EAAE,aAAa,IAC3C,OAAO,CACJ;YACL,WAAW,IAAI,CACd,oBAAC,UAAU,IACT,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,UAAU,EAClB,OAAO,QACP,IAAI,EAAE,oBAAC,IAAI,IAAC,IAAI,EAAC,GAAG,EAAC,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,GAAI,gBACnC,iBAAiB,0CAE5B,OAAO,EAAE,aAAa,EACtB,GAAG,EAAE,gBAAgB,GACrB,CACH;YACD,+EAA2C,MAAM,GAAG,CAChD,CACP,CACG,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,OAAO,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/molecules/Tooltip/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@faststore/components",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.22.0",
|
|
4
4
|
"main": "dist/cjs/index.js",
|
|
5
5
|
"module": "dist/esm/index.js",
|
|
6
6
|
"typings": "dist/esm/index.d.ts",
|
|
@@ -56,5 +56,5 @@
|
|
|
56
56
|
"volta": {
|
|
57
57
|
"extends": "../../package.json"
|
|
58
58
|
},
|
|
59
|
-
"gitHead": "
|
|
59
|
+
"gitHead": "c06b27a4839b7fc14b4e5a3ba0f6d865bd78706c"
|
|
60
60
|
}
|
package/src/index.ts
CHANGED
|
@@ -108,6 +108,8 @@ export type {
|
|
|
108
108
|
} from './molecules/Gift'
|
|
109
109
|
export { default as InputField } from './molecules/InputField'
|
|
110
110
|
export type { InputFieldProps } from './molecules/InputField'
|
|
111
|
+
export { default as TextareaField } from './molecules/TextareaField'
|
|
112
|
+
export type { TextareaFieldProps } from './molecules/TextareaField'
|
|
111
113
|
export { default as LinkButton } from './molecules/LinkButton'
|
|
112
114
|
export type { LinkButtonProps } from './molecules/LinkButton'
|
|
113
115
|
export {
|
|
@@ -153,6 +155,8 @@ export { default as RatingField } from './molecules/RatingField'
|
|
|
153
155
|
export type { RatingFieldProps } from './molecules/RatingField'
|
|
154
156
|
export { default as RegionBar } from './molecules/RegionBar'
|
|
155
157
|
export type { RegionBarProps } from './molecules/RegionBar'
|
|
158
|
+
export { default as Tooltip } from './molecules/Tooltip'
|
|
159
|
+
export type { TooltipProps } from './molecules/Tooltip'
|
|
156
160
|
|
|
157
161
|
export { default as SearchProvider } from './molecules/SearchProvider'
|
|
158
162
|
export type { SearchProviderContextValue } from './molecules/SearchProvider'
|
|
@@ -0,0 +1,102 @@
|
|
|
1
|
+
import type { MutableRefObject } from 'react'
|
|
2
|
+
import React, { useEffect, useRef } from 'react'
|
|
3
|
+
|
|
4
|
+
import type { TextareaProps } from '../..'
|
|
5
|
+
import { Textarea, Label } from '../..'
|
|
6
|
+
|
|
7
|
+
type DefaultProps = {
|
|
8
|
+
/**
|
|
9
|
+
* ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
|
|
10
|
+
*/
|
|
11
|
+
testId?: string
|
|
12
|
+
/**
|
|
13
|
+
* ID to identify textarea and corresponding label.
|
|
14
|
+
*/
|
|
15
|
+
id: string
|
|
16
|
+
/**
|
|
17
|
+
* The text displayed to identify textarea.
|
|
18
|
+
*/
|
|
19
|
+
label: string
|
|
20
|
+
/**
|
|
21
|
+
* The error message is displayed when an error occurs.
|
|
22
|
+
*/
|
|
23
|
+
error?: string
|
|
24
|
+
/**
|
|
25
|
+
* Component's ref.
|
|
26
|
+
*/
|
|
27
|
+
textareaRef?: MutableRefObject<HTMLTextAreaElement | null>
|
|
28
|
+
/**
|
|
29
|
+
* Specifies that the whole textarea component should be disabled.
|
|
30
|
+
*/
|
|
31
|
+
disabled?: boolean
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
export type TextareaFieldProps = DefaultProps &
|
|
35
|
+
Omit<TextareaProps, 'disabled' | 'onSubmit'>
|
|
36
|
+
|
|
37
|
+
const TextareaField = ({
|
|
38
|
+
id,
|
|
39
|
+
label,
|
|
40
|
+
error,
|
|
41
|
+
placeholder = ' ', // initializes with an empty space to style float label using `placeholder-shown`
|
|
42
|
+
textareaRef,
|
|
43
|
+
disabled,
|
|
44
|
+
value,
|
|
45
|
+
testId = 'fs-textarea-field',
|
|
46
|
+
...otherProps
|
|
47
|
+
}: TextareaFieldProps) => {
|
|
48
|
+
const shouldDisplayError = !disabled && error && error !== ''
|
|
49
|
+
const textareaInternalRef = useRef<HTMLTextAreaElement | null>(null)
|
|
50
|
+
const ref = textareaRef || textareaInternalRef
|
|
51
|
+
|
|
52
|
+
useEffect(() => {
|
|
53
|
+
const textarea = ref?.current
|
|
54
|
+
if (!textarea) return
|
|
55
|
+
|
|
56
|
+
const updateSize = () => {
|
|
57
|
+
textarea.parentElement?.style.setProperty(
|
|
58
|
+
'--fs-textarea-width',
|
|
59
|
+
`${textarea.offsetWidth}px`
|
|
60
|
+
)
|
|
61
|
+
textarea.parentElement?.style.setProperty(
|
|
62
|
+
'--fs-textarea-height',
|
|
63
|
+
`${textarea.offsetHeight}px`
|
|
64
|
+
)
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
updateSize()
|
|
68
|
+
|
|
69
|
+
const resizeObserver = new ResizeObserver(updateSize)
|
|
70
|
+
resizeObserver.observe(textarea)
|
|
71
|
+
|
|
72
|
+
return () => {
|
|
73
|
+
resizeObserver.disconnect()
|
|
74
|
+
}
|
|
75
|
+
}, [ref])
|
|
76
|
+
|
|
77
|
+
return (
|
|
78
|
+
<div
|
|
79
|
+
data-fs-textarea-field
|
|
80
|
+
data-fs-textarea-field-error={error && error !== ''}
|
|
81
|
+
data-testid={testId}
|
|
82
|
+
>
|
|
83
|
+
<Textarea
|
|
84
|
+
id={id}
|
|
85
|
+
value={value}
|
|
86
|
+
ref={ref}
|
|
87
|
+
disabled={disabled}
|
|
88
|
+
placeholder={placeholder}
|
|
89
|
+
{...otherProps}
|
|
90
|
+
/>
|
|
91
|
+
<Label data-fs-textarea-field-label htmlFor={id}>
|
|
92
|
+
{label}
|
|
93
|
+
</Label>
|
|
94
|
+
|
|
95
|
+
{shouldDisplayError && (
|
|
96
|
+
<span data-fs-textarea-field-error-message>{error}</span>
|
|
97
|
+
)}
|
|
98
|
+
</div>
|
|
99
|
+
)
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
export default TextareaField
|
|
@@ -0,0 +1,163 @@
|
|
|
1
|
+
import React, {
|
|
2
|
+
type ReactNode,
|
|
3
|
+
useState,
|
|
4
|
+
forwardRef,
|
|
5
|
+
type HTMLAttributes,
|
|
6
|
+
useRef,
|
|
7
|
+
useEffect,
|
|
8
|
+
} from 'react'
|
|
9
|
+
import Icon from '../../atoms/Icon'
|
|
10
|
+
import IconButton from '../IconButton'
|
|
11
|
+
|
|
12
|
+
/**
|
|
13
|
+
* Specifies tooltip position.
|
|
14
|
+
*/
|
|
15
|
+
export type Side = 'top' | 'right' | 'bottom' | 'left'
|
|
16
|
+
|
|
17
|
+
/**
|
|
18
|
+
* Specifies tooltip alignment.
|
|
19
|
+
*/
|
|
20
|
+
export type Alignment = 'start' | 'center' | 'end'
|
|
21
|
+
|
|
22
|
+
/**
|
|
23
|
+
* Combines side + alignment (e.g., "top-start").
|
|
24
|
+
*/
|
|
25
|
+
export type Placement = `${Side}-${Alignment}`
|
|
26
|
+
|
|
27
|
+
export interface TooltipProps
|
|
28
|
+
extends Omit<HTMLAttributes<HTMLDivElement>, 'content'> {
|
|
29
|
+
/**
|
|
30
|
+
* Text/content of the tooltip.
|
|
31
|
+
*/
|
|
32
|
+
content: ReactNode
|
|
33
|
+
/**
|
|
34
|
+
* Defines the side or side-alignment (e.g., "top-center", "right-end") of the tooltip.
|
|
35
|
+
*/
|
|
36
|
+
placement?: Placement
|
|
37
|
+
/**
|
|
38
|
+
* If the tooltip can be closed by a button.
|
|
39
|
+
*/
|
|
40
|
+
dismissible?: boolean
|
|
41
|
+
/**
|
|
42
|
+
* Called when the dismiss button is clicked.
|
|
43
|
+
*/
|
|
44
|
+
onDismiss?: (
|
|
45
|
+
ev:
|
|
46
|
+
| React.KeyboardEvent<HTMLDivElement>
|
|
47
|
+
| React.MouseEvent<HTMLButtonElement>
|
|
48
|
+
) => void
|
|
49
|
+
/**
|
|
50
|
+
* Element that activates the tooltip on hover/focus.
|
|
51
|
+
*/
|
|
52
|
+
children: ReactNode
|
|
53
|
+
/**
|
|
54
|
+
* ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
|
|
55
|
+
*/
|
|
56
|
+
testId?: string
|
|
57
|
+
/**
|
|
58
|
+
* Maximum width of the tooltip.
|
|
59
|
+
*/
|
|
60
|
+
maxWidth?: number
|
|
61
|
+
/**
|
|
62
|
+
* ID for the tooltip content to be used with aria-describedby.
|
|
63
|
+
*/
|
|
64
|
+
describedById?: string
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
const Tooltip = forwardRef<HTMLDivElement, TooltipProps>(function Tooltip(
|
|
68
|
+
{
|
|
69
|
+
content,
|
|
70
|
+
placement = 'top-center',
|
|
71
|
+
dismissible = false,
|
|
72
|
+
onDismiss,
|
|
73
|
+
children,
|
|
74
|
+
testId = 'fs-tooltip',
|
|
75
|
+
maxWidth = 300,
|
|
76
|
+
describedById = 'tooltip-content',
|
|
77
|
+
...otherProps
|
|
78
|
+
},
|
|
79
|
+
ref
|
|
80
|
+
) {
|
|
81
|
+
const [open, setOpen] = useState(false)
|
|
82
|
+
const [dismissed, setDismissed] = useState(false)
|
|
83
|
+
const dismissButtonRef = useRef<HTMLButtonElement>(null)
|
|
84
|
+
const triggerRef = useRef<HTMLDivElement>(null)
|
|
85
|
+
|
|
86
|
+
const handleDismiss = (
|
|
87
|
+
ev:
|
|
88
|
+
| React.KeyboardEvent<HTMLDivElement>
|
|
89
|
+
| React.MouseEvent<HTMLButtonElement>
|
|
90
|
+
) => {
|
|
91
|
+
onDismiss?.(ev)
|
|
92
|
+
setOpen(false)
|
|
93
|
+
setDismissed(true)
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
const toggleOpen = () => {
|
|
97
|
+
if (dismissed) {
|
|
98
|
+
setDismissed(false)
|
|
99
|
+
}
|
|
100
|
+
setOpen(true)
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {
|
|
104
|
+
if (event.key === 'Escape') {
|
|
105
|
+
handleDismiss(event)
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
useEffect(() => {
|
|
110
|
+
if (open && dismissible) {
|
|
111
|
+
dismissButtonRef.current?.focus()
|
|
112
|
+
}
|
|
113
|
+
}, [open, dismissible])
|
|
114
|
+
|
|
115
|
+
return (
|
|
116
|
+
<div
|
|
117
|
+
data-fs-tooltip
|
|
118
|
+
onMouseEnter={toggleOpen}
|
|
119
|
+
onMouseLeave={() => setOpen(false)}
|
|
120
|
+
onFocus={toggleOpen}
|
|
121
|
+
onBlur={() => setOpen(false)}
|
|
122
|
+
data-testid={testId}
|
|
123
|
+
aria-describedby={describedById}
|
|
124
|
+
onKeyDown={handleKeyDown}
|
|
125
|
+
tabIndex={0}
|
|
126
|
+
ref={triggerRef}
|
|
127
|
+
>
|
|
128
|
+
{children}
|
|
129
|
+
|
|
130
|
+
{open && !dismissed && (
|
|
131
|
+
<div
|
|
132
|
+
ref={ref}
|
|
133
|
+
data-fs-tooltip-wrapper
|
|
134
|
+
data-fs-tooltip-placement={placement}
|
|
135
|
+
data-fs-tooltip-dismissible={dismissible}
|
|
136
|
+
role="tooltip"
|
|
137
|
+
onKeyDown={handleKeyDown}
|
|
138
|
+
style={{ maxWidth }}
|
|
139
|
+
{...otherProps}
|
|
140
|
+
>
|
|
141
|
+
<div data-fs-tooltip-content id={describedById}>
|
|
142
|
+
{content}
|
|
143
|
+
</div>
|
|
144
|
+
{dismissible && (
|
|
145
|
+
<IconButton
|
|
146
|
+
size="small"
|
|
147
|
+
variant="tertiary"
|
|
148
|
+
inverse
|
|
149
|
+
icon={<Icon name="X" width={20} height={20} />}
|
|
150
|
+
aria-label="Dismiss tooltip"
|
|
151
|
+
data-fs-tooltip-dismiss-button
|
|
152
|
+
onClick={handleDismiss}
|
|
153
|
+
ref={dismissButtonRef}
|
|
154
|
+
/>
|
|
155
|
+
)}
|
|
156
|
+
<div data-fs-tooltip-indicator aria-hidden="true" />
|
|
157
|
+
</div>
|
|
158
|
+
)}
|
|
159
|
+
</div>
|
|
160
|
+
)
|
|
161
|
+
})
|
|
162
|
+
|
|
163
|
+
export default Tooltip
|