@sproutsocial/seeds-react-token-input 1.4.62 → 1.4.64

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.
@@ -8,14 +8,14 @@ $ tsup --dts
8
8
  CLI Cleaning output folder
9
9
  CJS Build start
10
10
  ESM Build start
11
- CJS dist/index.js 15.36 KB
12
- CJS dist/index.js.map 28.27 KB
13
- CJS ⚡️ Build success in 79ms
14
- ESM dist/esm/index.js 12.68 KB
15
- ESM dist/esm/index.js.map 28.06 KB
16
- ESM ⚡️ Build success in 79ms
11
+ CJS dist/index.js 21.11 KB
12
+ CJS dist/index.js.map 35.79 KB
13
+ CJS ⚡️ Build success in 84ms
14
+ ESM dist/esm/index.js 18.29 KB
15
+ ESM dist/esm/index.js.map 35.55 KB
16
+ ESM ⚡️ Build success in 84ms
17
17
  DTS Build start
18
- DTS ⚡️ Build success in 3053ms
18
+ DTS ⚡️ Build success in 3816ms
19
19
  DTS dist/index.d.ts 4.51 KB
20
20
  DTS dist/index.d.mts 4.51 KB
21
- Done in 4.21s.
21
+ Done in 5.41s.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,29 @@
1
1
  # @sproutsocial/seeds-react-token-input
2
2
 
3
+ ## 1.4.64
4
+
5
+ ### Patch Changes
6
+
7
+ - @sproutsocial/seeds-react-theme@4.5.1
8
+ - @sproutsocial/seeds-react-token@1.5.20
9
+ - @sproutsocial/seeds-react-box@1.1.32
10
+ - @sproutsocial/seeds-react-icon@2.5.2
11
+ - @sproutsocial/seeds-react-mixins@4.3.16
12
+ - @sproutsocial/seeds-react-input@1.5.42
13
+
14
+ ## 1.4.63
15
+
16
+ ### Patch Changes
17
+
18
+ - Updated dependencies [e38d258]
19
+ - @sproutsocial/seeds-react-theme@4.5.0
20
+ - @sproutsocial/seeds-react-system-props@3.2.1
21
+ - @sproutsocial/seeds-react-box@1.1.31
22
+ - @sproutsocial/seeds-react-icon@2.5.1
23
+ - @sproutsocial/seeds-react-mixins@4.3.15
24
+ - @sproutsocial/seeds-react-token@1.5.19
25
+ - @sproutsocial/seeds-react-input@1.5.41
26
+
3
27
  ## 1.4.62
4
28
 
5
29
  ### Patch Changes
package/dist/esm/index.js CHANGED
@@ -1,8 +1,8 @@
1
1
  // src/index.ts
2
- import * as React4 from "react";
2
+ import * as React5 from "react";
3
3
 
4
4
  // src/TokenInput.tsx
5
- import * as React2 from "react";
5
+ import * as React3 from "react";
6
6
  import styled3 from "styled-components";
7
7
  import { Accessory } from "@sproutsocial/seeds-react-input";
8
8
  import Box from "@sproutsocial/seeds-react-box";
@@ -148,18 +148,68 @@ import "react";
148
148
  import { useEffect, useRef, useState } from "react";
149
149
 
150
150
  // ../seeds-react-visually-hidden/dist/esm/index.js
151
+ import { needsStyledComponents } from "@sproutsocial/seeds-react-system-props";
151
152
  import styled2 from "styled-components";
152
153
  import { visuallyHidden } from "@sproutsocial/seeds-react-mixins";
153
154
  import { jsx } from "react/jsx-runtime";
155
+
156
+ // ../../node_modules/@emotion/memoize/dist/emotion-memoize.esm.js
157
+ function memoize(fn) {
158
+ var cache = /* @__PURE__ */ Object.create(null);
159
+ return function(arg) {
160
+ if (cache[arg] === void 0) cache[arg] = fn(arg);
161
+ return cache[arg];
162
+ };
163
+ }
164
+
165
+ // ../../node_modules/@emotion/is-prop-valid/dist/emotion-is-prop-valid.esm.js
166
+ var reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|abbr|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|enterKeyHint|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|translate|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|incremental|fallback|inert|itemProp|itemScope|itemType|itemID|itemRef|on|option|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/;
167
+ var isPropValid = /* @__PURE__ */ memoize(
168
+ function(prop) {
169
+ return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111 && prop.charCodeAt(1) === 110 && prop.charCodeAt(2) < 91;
170
+ }
171
+ /* Z+1 */
172
+ );
173
+
174
+ // ../seeds-react-visually-hidden/dist/esm/index.js
175
+ import * as React from "react";
176
+ import { jsx as jsx2 } from "react/jsx-runtime";
177
+ import { jsx as jsx3 } from "react/jsx-runtime";
154
178
  var StyledVisuallyHidden = styled2.span`
155
179
  ${visuallyHidden}
156
180
  `;
157
- var VisuallyHidden = (props) => {
158
- return /* @__PURE__ */ jsx(StyledVisuallyHidden, { ...props });
181
+ var VisuallyHiddenStyled = (props) => /* @__PURE__ */ jsx(StyledVisuallyHidden, { ...props });
182
+ var mergeClassNames = (...classes) => classes.filter(Boolean).join(" ");
183
+ var VisuallyHiddenTailwind = ({
184
+ as,
185
+ children,
186
+ className,
187
+ ...rest
188
+ }) => {
189
+ const Element = as ?? "span";
190
+ const forwardedProps = typeof Element === "string" ? Object.fromEntries(
191
+ Object.entries(rest).filter(([name]) => isPropValid(name))
192
+ ) : rest;
193
+ return React.createElement(
194
+ Element,
195
+ {
196
+ ...forwardedProps,
197
+ className: mergeClassNames("seeds-visually-hidden", className)
198
+ },
199
+ children
200
+ );
159
201
  };
202
+ VisuallyHiddenTailwind.displayName = "VisuallyHiddenTailwind";
203
+ var VisuallyHiddenHybrid = (props) => {
204
+ if (needsStyledComponents(props)) {
205
+ return /* @__PURE__ */ jsx2(VisuallyHiddenStyled, { ...props });
206
+ }
207
+ return /* @__PURE__ */ jsx2(VisuallyHiddenTailwind, { ...props });
208
+ };
209
+ var VisuallyHidden = (props) => /* @__PURE__ */ jsx3(VisuallyHiddenHybrid, { ...props });
160
210
 
161
211
  // src/TokenScreenReaderStatus.tsx
162
- import { jsx as jsx2 } from "react/jsx-runtime";
212
+ import { jsx as jsx4 } from "react/jsx-runtime";
163
213
  function usePrevious(value) {
164
214
  const ref = useRef();
165
215
  useEffect(() => {
@@ -184,11 +234,11 @@ var TokenScreenReaderStatus = ({
184
234
  }
185
235
  }
186
236
  }, [prevTokens, tokens, tokenStatus]);
187
- return /* @__PURE__ */ jsx2(VisuallyHidden, { as: "div", role: "status", children: tokenStatus });
237
+ return /* @__PURE__ */ jsx4(VisuallyHidden, { as: "div", role: "status", children: tokenStatus });
188
238
  };
189
239
 
190
240
  // src/TokenInput.tsx
191
- import { jsx as jsx3, jsxs } from "react/jsx-runtime";
241
+ import { jsx as jsx5, jsxs } from "react/jsx-runtime";
192
242
  var StyledInput = styled3("input")``;
193
243
  var DefaultDelimiters = [",", "Enter"];
194
244
  var ControlledPropNames = [
@@ -196,7 +246,7 @@ var ControlledPropNames = [
196
246
  "hasFocus",
197
247
  "activeToken"
198
248
  ];
199
- var TokenInput = class extends React2.Component {
249
+ var TokenInput = class extends React3.Component {
200
250
  delimiterMatcher;
201
251
  constructor(props) {
202
252
  super(props);
@@ -329,7 +379,7 @@ var TokenInput = class extends React2.Component {
329
379
  } = token;
330
380
  const iconName = tokenIconName || defaultIconName;
331
381
  const isActive = activeId === id;
332
- return /* @__PURE__ */ jsx3(
382
+ return /* @__PURE__ */ jsx5(
333
383
  Token,
334
384
  {
335
385
  id,
@@ -343,14 +393,14 @@ var TokenInput = class extends React2.Component {
343
393
  disabled,
344
394
  ...restTokenProps,
345
395
  children: /* @__PURE__ */ jsxs(Box, { display: "flex", alignItems: "center", children: [
346
- iconName && /* @__PURE__ */ jsx3(Icon, { name: iconName, size: "mini", pr: 300, ...iconProps }),
396
+ iconName && /* @__PURE__ */ jsx5(Icon, { name: iconName, size: "mini", pr: 300, ...iconProps }),
347
397
  value
348
398
  ] })
349
399
  }
350
400
  );
351
401
  }
352
402
  renderTokens(tokens) {
353
- return tokens.map((token) => /* @__PURE__ */ jsx3("div", { className: "TokenInput-token", children: this.renderToken(token) }, token.id));
403
+ return tokens.map((token) => /* @__PURE__ */ jsx5("div", { className: "TokenInput-token", children: this.renderToken(token) }, token.id));
354
404
  }
355
405
  render() {
356
406
  const {
@@ -402,10 +452,10 @@ var TokenInput = class extends React2.Component {
402
452
  focused: state.hasFocus,
403
453
  ...rest,
404
454
  children: [
405
- elemBefore && /* @__PURE__ */ jsx3(Accessory, { before: true, children: elemBefore }),
455
+ elemBefore && /* @__PURE__ */ jsx5(Accessory, { before: true, children: elemBefore }),
406
456
  tokens && this.renderTokens(tokens),
407
- /* @__PURE__ */ jsx3(TokenScreenReaderStatus, { tokens }),
408
- /* @__PURE__ */ jsx3(
457
+ /* @__PURE__ */ jsx5(TokenScreenReaderStatus, { tokens }),
458
+ /* @__PURE__ */ jsx5(
409
459
  StyledInput,
410
460
  {
411
461
  "aria-describedby": ariaDescribedby,
@@ -435,7 +485,7 @@ var TokenInput = class extends React2.Component {
435
485
  ...inputProps
436
486
  }
437
487
  ),
438
- elemAfter && /* @__PURE__ */ jsx3(Accessory, { after: true, children: elemAfter })
488
+ elemAfter && /* @__PURE__ */ jsx5(Accessory, { after: true, children: elemAfter })
439
489
  ]
440
490
  }
441
491
  );
@@ -446,8 +496,8 @@ var TokenInput = class extends React2.Component {
446
496
  import "react";
447
497
 
448
498
  // src/index.ts
449
- var TokenInput2 = React4.forwardRef(
450
- (props, ref) => React4.createElement(TokenInput, { ...props, containerRef: ref })
499
+ var TokenInput2 = React5.forwardRef(
500
+ (props, ref) => React5.createElement(TokenInput, { ...props, containerRef: ref })
451
501
  );
452
502
  TokenInput2.displayName = "TokenInput";
453
503
  var index_default = TokenInput2;
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/index.ts","../../src/TokenInput.tsx","../../src/styles.ts","../../src/util.ts","../../src/TokenScreenReaderStatus.tsx","../../../seeds-react-visually-hidden/src/VisuallyHidden.tsx","../../src/TokenInputTypes.ts"],"sourcesContent":["import * as React from \"react\";\nimport TokenInputClass from \"./TokenInput\";\nimport type { TypeTokenInputProps } from \"./TokenInputTypes\";\n\n/**\n * Wraps the class-based TokenInput with forwardRef so that the standard React\n * `ref` prop resolves to the root Container DOM node. This is required for\n * Radix UI's `asChild` pattern (used by seeds-react-menu's Popout) which\n * expects triggerRef to be a DOM element for `.contains()` checks.\n *\n * The existing `innerRef` prop still forwards to the underlying `<input>`.\n */\nconst TokenInput = React.forwardRef<HTMLDivElement, TypeTokenInputProps>(\n (props, ref) =>\n React.createElement(TokenInputClass, { ...props, containerRef: ref })\n);\n\nTokenInput.displayName = \"TokenInput\";\n\nexport default TokenInput;\nexport { TokenInput };\nexport * from \"./TokenInputTypes\";\n","import * as React from \"react\";\nimport styled from \"styled-components\";\nimport { Accessory } from \"@sproutsocial/seeds-react-input\";\nimport Box from \"@sproutsocial/seeds-react-box\";\nimport Icon from \"@sproutsocial/seeds-react-icon\";\nimport Token from \"@sproutsocial/seeds-react-token\";\nimport Container from \"./styles\";\nimport { asTokenSpec, delimitersAsRegExp } from \"./util\";\nimport type { TypeTokenInputProps, TypeTokenSpec } from \"./TokenInputTypes\";\nimport { TokenScreenReaderStatus } from \"./TokenScreenReaderStatus\";\n\ntype TypeState = {\n prevProps: TypeTokenInputProps;\n hasFocus: boolean;\n activeToken: string | null | undefined;\n value: string;\n};\n\n// Simply using a styled input to allow passing the `as` prop\nconst StyledInput = styled(\"input\")``;\n\nconst DefaultDelimiters = [\",\", \"Enter\"];\nconst ControlledPropNames: (keyof TypeState)[] = [\n \"value\",\n \"hasFocus\",\n \"activeToken\",\n];\n\nexport default class TokenInput extends React.Component<\n TypeTokenInputProps,\n TypeState\n> {\n delimiterMatcher: RegExp;\n\n constructor(props: TypeTokenInputProps) {\n super(props);\n const { hasFocus, activeToken, value, delimiters } = props;\n this.delimiterMatcher = delimitersAsRegExp(delimiters || DefaultDelimiters);\n this.state = {\n prevProps: props,\n hasFocus: hasFocus || false,\n activeToken: activeToken,\n value: value || \"\",\n };\n }\n\n static getDerivedStateFromProps(\n props: Readonly<TypeTokenInputProps>,\n state: TypeState\n ) {\n const { prevProps } = state;\n const modifiedState: Partial<TypeState> = { prevProps: props };\n ControlledPropNames.forEach((propName) => {\n const currentProp = props[propName as keyof TypeTokenInputProps];\n\n // @ts-ignore: TODO - fix state types for prevProps\n if (currentProp !== prevProps[propName]) {\n modifiedState[propName] = currentProp;\n }\n });\n modifiedState.prevProps = props;\n return modifiedState;\n }\n\n isDelimiter(keyName: string) {\n const { delimiters = DefaultDelimiters } = this.props;\n return delimiters.includes(keyName);\n }\n\n spawnNewTokens(texts: string[]) {\n const {\n onAddToken,\n onChangeTokens,\n tokenMaxLength: max = Infinity,\n tokens = [],\n } = this.props;\n const tokenSpecs = texts.map((text) => asTokenSpec(text.slice(0, max)));\n\n if (onAddToken) {\n tokenSpecs.forEach(onAddToken);\n } else if (onChangeTokens) {\n onChangeTokens(tokens.concat(tokenSpecs));\n }\n\n this.setState({\n value: \"\",\n });\n }\n\n deleteToken(tokenId?: string) {\n const { onRemoveToken, onChangeTokens, tokens = [] } = this.props;\n const count = tokens.length;\n if (count === 0) return;\n const id = tokenId ?? tokens[count - 1]?.id;\n\n if (onRemoveToken) {\n onRemoveToken(id ? id : \"\");\n } else if (onChangeTokens) {\n onChangeTokens(tokens.filter((tokenSpec) => tokenSpec.id !== id));\n }\n\n this.setState({\n value: \"\",\n });\n }\n\n handleChangeText = (e: React.SyntheticEvent<HTMLInputElement>) => {\n const { value } = e.currentTarget;\n const { onChange } = this.props;\n this.setState({\n value,\n });\n onChange?.(e, value);\n };\n\n handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n const { onFocus } = this.props;\n this.setState({\n hasFocus: true,\n });\n onFocus?.(e);\n };\n\n handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n const { onBlur } = this.props;\n if (onBlur) onBlur(e);\n this.setState({\n hasFocus: false,\n });\n };\n\n handleKeyUp = (e: React.KeyboardEvent<HTMLInputElement>) => {\n this.props.onKeyUp?.(e, e.currentTarget.value);\n };\n\n handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n const { onKeyDown } = this.props;\n const { key, currentTarget } = e;\n const text = currentTarget.value;\n if (onKeyDown) onKeyDown(e, text);\n\n // keyPress event runs before change\n // Prevent event from bubbling up and calling change, which can lead to comma in value\n if (this.isDelimiter(key)) {\n if (text) {\n this.spawnNewTokens([text]);\n e.preventDefault();\n }\n } else if (key === \"Backspace\") {\n if (text === \"\") {\n this.deleteToken();\n }\n }\n };\n\n handlePaste = (e: React.ClipboardEvent<HTMLInputElement>) => {\n const text = e.clipboardData.getData(\"text\");\n const { onPaste } = this.props;\n if (onPaste) onPaste(e, text);\n const subtexts = text.split(this.delimiterMatcher);\n const texts = subtexts.filter((subtext) => subtext.length);\n\n if (texts.length > 1) {\n this.spawnNewTokens(texts);\n e.preventDefault();\n }\n };\n\n handleClickToken = (\n e: React.SyntheticEvent<Element, Event>,\n token: TypeTokenSpec\n ) => {\n const { onClickToken, disabled } = this.props;\n if (onClickToken) onClickToken(e, token.id);\n\n if (!disabled) {\n this.deleteToken(token.id);\n }\n };\n\n renderToken(token: TypeTokenSpec): React.ReactNode {\n const { iconName: defaultIconName, disabled } = this.props;\n const activeId = this.state.activeToken;\n const {\n id,\n iconName: tokenIconName,\n iconProps = { \"aria-hidden\": true },\n value,\n valid,\n hasWarning,\n tokenProps: { onClick, ...restTokenProps } = {},\n } = token;\n const iconName = tokenIconName || defaultIconName;\n const isActive = activeId === id;\n return (\n <Token\n id={id}\n onClick={(e) => {\n this.handleClickToken(e, token);\n onClick?.(e);\n }}\n valid={valid}\n hasWarning={hasWarning}\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n active={isActive}\n disabled={disabled}\n {...restTokenProps}\n >\n <Box display=\"flex\" alignItems=\"center\">\n {iconName && (\n <Icon name={iconName} size=\"mini\" pr={300} {...iconProps} />\n )}\n {value}\n </Box>\n </Token>\n );\n }\n\n renderTokens(tokens: TypeTokenSpec[]): React.ReactNode {\n return tokens.map<React.ReactNode>((token) => (\n <div key={token.id} className=\"TokenInput-token\">\n {this.renderToken(token)}\n </div>\n ));\n }\n\n override render() {\n const {\n autoFocus,\n autocomplete,\n disabled,\n isInvalid,\n hasWarning,\n id,\n name,\n placeholder,\n required,\n elemBefore,\n elemAfter,\n maxLength,\n ariaDescribedby,\n ariaLabel,\n innerRef,\n containerRef,\n // These functions are used in the class functions above, but need to be extracted in order for `rest` to be correct\n /* eslint-disable @typescript-eslint/no-unused-vars */\n value,\n onAddToken,\n onRemoveToken,\n onChangeTokens,\n onClickToken,\n onBlur,\n onChange,\n onFocus,\n onKeyDown,\n onKeyUp,\n onPaste,\n /* eslint-enable @typescript-eslint/no-unused-vars */\n inputProps = {},\n qa = {},\n tokens,\n ...rest\n } = this.props;\n const { state } = this;\n return (\n <Container\n ref={containerRef}\n hasBeforeElement={!!elemBefore}\n hasAfterElement={!!elemAfter}\n disabled={disabled}\n invalid={!!isInvalid}\n warning={hasWarning}\n focused={state.hasFocus}\n {...rest}\n >\n {elemBefore && <Accessory before>{elemBefore}</Accessory>}\n\n {tokens && this.renderTokens(tokens)}\n\n <TokenScreenReaderStatus tokens={tokens} />\n\n <StyledInput\n aria-describedby={ariaDescribedby}\n aria-invalid={!!isInvalid}\n aria-label={ariaLabel}\n autoFocus={autoFocus}\n autoComplete={autocomplete}\n disabled={disabled}\n id={id}\n name={name}\n placeholder={placeholder}\n type=\"text\"\n required={required}\n value={state.value}\n maxLength={maxLength}\n onBlur={this.handleBlur}\n onChange={this.handleChangeText}\n onFocus={this.handleFocus}\n onKeyDown={this.handleKeyDown}\n onKeyUp={this.handleKeyUp}\n onPaste={this.handlePaste}\n ref={innerRef}\n data-qa-input={name || \"\"}\n data-qa-input-isdisabled={!!disabled}\n data-qa-input-isrequired={!!required}\n {...qa}\n {...inputProps}\n />\n\n {elemAfter && <Accessory after>{elemAfter}</Accessory>}\n </Container>\n );\n }\n}\n","import styled, { css } from \"styled-components\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\nimport { focusRing } from \"@sproutsocial/seeds-react-mixins\";\nimport type { TypeInputContainerProps } from \"@sproutsocial/seeds-react-input\";\n\ninterface TypeTokenInputContainerProps\n extends Pick<\n TypeInputContainerProps,\n \"hasBeforeElement\" | \"hasAfterElement\" | \"disabled\" | \"invalid\" | \"warning\"\n > {\n focused?: boolean;\n}\n\nconst Container = styled.div<TypeTokenInputContainerProps>`\n box-sizing: border-box;\n position: relative;\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n align-content: center;\n cursor: text;\n width: 100%;\n border: 1px solid ${(props) => props.theme.colors.form.border.base};\n border-radius: ${(props) => props.theme.radii[500]};\n margin: 0;\n padding: ${(props) => props.theme.space[300]};\n padding-top: ${(props) => props.theme.space[200]};\n background-color: ${(props) => props.theme.colors.form.background.base};\n color: ${(props) => props.theme.colors.text.body};\n transition: border-color ${(props) => props.theme.duration.fast}\n ${(props) => props.theme.easing.ease_in},\n box-shadow ${(props) => props.theme.duration.fast}\n ${(props) => props.theme.easing.ease_in};\n ${(props) => props.theme.typography[200]};\n font-family: ${(props) => props.theme.fontFamily};\n font-weight: ${(props) => props.theme.fontWeights.normal};\n appearance: none;\n\n button {\n margin: ${(props) => props.theme.space[200]}\n ${(props) => props.theme.space[200]} 0 0;\n }\n\n input,\n textarea {\n ${(props) => props.theme.typography[200]};\n outline: none;\n border: none;\n flex: 1;\n padding: 0;\n padding-top: ${(props) => props.theme.space[100]};\n margin: ${(props) => props.theme.space[200]}\n ${(props) => props.theme.space[300]} ${(props) => props.theme.space[100]}\n 0;\n color: ${(props) => props.theme.colors.text.body};\n background-color: ${(props) => props.theme.colors.form.background.base};\n /** This matches the height of the token so size does not change as tokens are added */\n min-height: 20px;\n\n &::-webkit-search-cancel-button {\n appearance: none;\n }\n\n /* Explicitly removes double focus ring in environments where box-shadow focus styles have been specified (Seeds). Focus is passed up from the input to the parent container. */\n &:focus {\n box-shadow: none;\n }\n\n /* https://stackoverflow.com/questions/14007655/remove-ie10s-clear-field-x-button-on-certain-inputs */\n &::-ms-clear {\n display: none;\n }\n\n /* Fix for red ring when input is marked required in Firefox */\n &:not(output):not(:focus):-moz-ui-invalid {\n box-shadow: none;\n }\n\n &::placeholder {\n color: ${(props) => props.theme.colors.form.placeholder.base};\n font-style: italic;\n }\n\n ${(props) =>\n props.disabled &&\n css`\n opacity: 0.4;\n\n cursor: not-allowed;\n `}\n }\n\n textarea {\n font-family: ${(props) => props.theme.fontFamily};\n }\n\n ${(props) =>\n props.hasBeforeElement &&\n css`\n padding-left: 40px;\n `}\n\n ${(props) =>\n props.hasAfterElement &&\n css`\n padding-right: 40px;\n `}\n\n\n ${(props) =>\n props.disabled &&\n css`\n opacity: 0.4;\n\n cursor: not-allowed;\n `}\n\n ${(props) =>\n props.focused &&\n css`\n ${focusRing}\n `}\n\n ${(props) =>\n props.invalid &&\n css`\n border-color: ${(props) => props.theme.colors.form.border.error};\n `}\n\n\t${(props) =>\n props.warning &&\n css`\n border-color: ${(props) => props.theme.colors.form.border.warning};\n `}\n\n ${COMMON}\n`;\n\nContainer.displayName = \"TokenInputContainer\";\n\nexport default Container;\n","import uniqueId from \"lodash.uniqueid\";\nimport type { TypeTokenSpec } from \"./\";\n\nexport const asTokenSpec = (text: string): TypeTokenSpec => ({\n id: uniqueId(`${text}-`),\n value: text.trim(),\n});\n\nconst KeyNameToRegExpChar: { [key: string]: string } = {\n Enter: \"\\\\n\",\n};\n\nexport const delimitersAsRegExp = (delimiters: string[] | null | undefined) => {\n if (!delimiters) return /[,\\n]/;\n const chars = delimiters\n .map(\n (key) =>\n KeyNameToRegExpChar[key as keyof typeof KeyNameToRegExpChar] || key\n )\n .join(\"\");\n return RegExp(`[${chars}]`);\n};\n","import React from \"react\";\nimport { useEffect, useRef, useState } from \"react\";\nimport { VisuallyHidden } from \"@sproutsocial/seeds-react-visually-hidden\";\nimport type { TypeTokenInputProps } from \"./\";\n\nfunction usePrevious(value: TypeTokenInputProps[\"tokens\"]) {\n const ref = useRef<TypeTokenInputProps[\"tokens\"]>();\n\n useEffect(() => {\n ref.current = value;\n });\n\n return ref.current;\n}\n\nexport const TokenScreenReaderStatus = ({\n tokens,\n}: {\n tokens: TypeTokenInputProps[\"tokens\"];\n}) => {\n const prevTokens = usePrevious(tokens);\n const [tokenStatus, setTokenStatus] = useState(\"\");\n\n // TODO: Use callbacks so consumers can pass localized messaging to the screen reader\n useEffect(() => {\n if (prevTokens && tokens) {\n if (prevTokens.length > tokens.length) {\n setTokenStatus(\n `${\n prevTokens.filter((item) => tokens.indexOf(item) === -1)[0]?.value\n } has been removed`\n );\n }\n\n if (prevTokens.length < tokens.length) {\n setTokenStatus(`${tokens[tokens.length - 1]?.value} has been added.`);\n }\n }\n }, [prevTokens, tokens, tokenStatus]);\n\n return (\n <VisuallyHidden as=\"div\" role=\"status\">\n {tokenStatus}\n </VisuallyHidden>\n );\n};\n","import styled from \"styled-components\";\nimport { visuallyHidden } from \"@sproutsocial/seeds-react-mixins\";\nimport type { ComponentPropsWithRef } from \"react\";\n\nconst StyledVisuallyHidden = styled.span`\n ${visuallyHidden}\n`;\n\nexport type VisuallyHiddenProps = ComponentPropsWithRef<\n typeof StyledVisuallyHidden\n>;\n\n// This wrapper component is needed for react-docgen to work.\n// It has issues with generating docs for the styled component directly.\nexport const VisuallyHidden = (props: VisuallyHiddenProps) => {\n return <StyledVisuallyHidden {...props} />;\n};\n","import * as React from \"react\";\nimport type {\n TypeStyledComponentsCommonProps,\n TypeSystemCommonProps,\n} from \"@sproutsocial/seeds-react-system-props\";\nimport type {\n TypeIconProps,\n TypeIconName,\n} from \"@sproutsocial/seeds-react-icon\";\nimport type { TypeTokenProps } from \"@sproutsocial/seeds-react-token\";\n\nexport interface TypeTokenSpec {\n id: string;\n iconName?: TypeIconName;\n iconProps?: Omit<TypeIconProps, \"name\">;\n value: string;\n valid?: boolean;\n hasWarning?: boolean;\n tokenProps?: Partial<TypeTokenProps>;\n}\n\nexport interface TypeBaseTokenInputProps {\n /** ID of the form element, should match the \"for\" value of the associated label */\n id: string;\n name: string;\n iconName?: TypeIconName;\n\n /** Array of delimiter key names */\n delimiters?: string[];\n\n /** Current input text. Required when controlling the input text */\n value?: string;\n\n /** Current focus state. Required when controlling the focus via onFocus and onBlur */\n hasFocus?: boolean;\n\n /** Id of the currently selected token */\n activeToken?: string;\n\n /** Array of current tokens */\n tokens?: TypeTokenSpec[];\n\n /** Standard control of changing tokens. For fine-grain control use onAddToken and onRemoveToken, instead */\n onChangeTokens?: (tokens: TypeTokenSpec[]) => void;\n\n /** Fine-grained control of adding tokens. Use with onRemoveToken instead of onChangeTokens */\n onAddToken?: (tokenSpec: TypeTokenSpec) => void;\n\n /** Fine-grained control of removing tokens. Use with onAddToken instead of onChangeTokens */\n onRemoveToken?: (tokenId: string) => void;\n\n /** Controls clicking on a token. When absent, clicking a token removes itself */\n onClickToken?(e: React.SyntheticEvent<Element, Event>, tokenId: string): void;\n\n /** Fine-grained control of the input text used to create tokens */\n onChange?: (e: React.SyntheticEvent<HTMLInputElement>, value: string) => void;\n\n /** Fine-grained control of pasted text */\n onPaste?: (e: React.ClipboardEvent<HTMLInputElement>, value: string) => void;\n onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;\n onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void;\n onKeyDown?: (e: React.KeyboardEvent<HTMLInputElement>, value: string) => void;\n onKeyUp?: (e: React.KeyboardEvent<HTMLInputElement>, value: string) => void;\n\n /** Attribute used to associate other elements that describe the Input, like an error */\n ariaDescribedby?: string;\n\n /** Label used to describe the input if not used with an accompanying visual label */\n ariaLabel?: string;\n\n /** Placeholder text for when value is undefined or empty */\n placeholder?: string;\n\n /** Will autofocus the element when mounted to the DOM */\n autoFocus?: boolean;\n\n /** HTML disabled attribute */\n disabled?: boolean;\n\n /** Whether or not the current contents of the input are invalid */\n isInvalid?: boolean;\n\n /** Whether or not the current contents of the input has any warnings */\n hasWarning?: boolean;\n\n /** HTML required attribute */\n required?: boolean;\n\n /** 16x16 element, such as an icon */\n elemBefore?: React.ReactNode;\n\n /** 16x16 element, such as an icon */\n elemAfter?: React.ReactNode;\n\n /** Max input text length */\n maxLength?: number;\n\n /** Max length of the token */\n tokenMaxLength?: number;\n\n /** Props to spread onto the underlying input element */\n inputProps?: React.ComponentPropsWithoutRef<\"input\">;\n\n /** Used to get a reference to the underlying input element */\n innerRef?: React.Ref<HTMLInputElement>;\n\n /** Ref forwarded to the root container element (used by Radix asChild) */\n containerRef?: React.Ref<HTMLDivElement>;\n qa?: object;\n\n /** Browser autocomplete support */\n autocomplete?: string;\n}\n\nexport interface TypeTokenInputProps\n extends TypeBaseTokenInputProps,\n TypeStyledComponentsCommonProps,\n TypeSystemCommonProps,\n Omit<\n React.ComponentPropsWithoutRef<\"div\">,\n keyof TypeBaseTokenInputProps | \"color\"\n > {}\n"],"mappings":"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","names":["React","React","styled","props","styled","jsx","jsx","styled","TokenInput"]}
1
+ {"version":3,"sources":["../../src/index.ts","../../src/TokenInput.tsx","../../src/styles.ts","../../src/util.ts","../../src/TokenScreenReaderStatus.tsx","../../../seeds-react-visually-hidden/src/VisuallyHiddenHybrid.tsx","../../../seeds-react-visually-hidden/src/VisuallyHiddenStyled.tsx","../../../seeds-react-visually-hidden/src/VisuallyHiddenTailwind.tsx","../../../seeds-react-visually-hidden/src/VisuallyHidden.tsx","../../../../node_modules/@emotion/memoize/dist/emotion-memoize.esm.js","../../../../node_modules/@emotion/is-prop-valid/dist/emotion-is-prop-valid.esm.js","../../src/TokenInputTypes.ts"],"sourcesContent":["import * as React from \"react\";\nimport TokenInputClass from \"./TokenInput\";\nimport type { TypeTokenInputProps } from \"./TokenInputTypes\";\n\n/**\n * Wraps the class-based TokenInput with forwardRef so that the standard React\n * `ref` prop resolves to the root Container DOM node. This is required for\n * Radix UI's `asChild` pattern (used by seeds-react-menu's Popout) which\n * expects triggerRef to be a DOM element for `.contains()` checks.\n *\n * The existing `innerRef` prop still forwards to the underlying `<input>`.\n */\nconst TokenInput = React.forwardRef<HTMLDivElement, TypeTokenInputProps>(\n (props, ref) =>\n React.createElement(TokenInputClass, { ...props, containerRef: ref })\n);\n\nTokenInput.displayName = \"TokenInput\";\n\nexport default TokenInput;\nexport { TokenInput };\nexport * from \"./TokenInputTypes\";\n","import * as React from \"react\";\nimport styled from \"styled-components\";\nimport { Accessory } from \"@sproutsocial/seeds-react-input\";\nimport Box from \"@sproutsocial/seeds-react-box\";\nimport Icon from \"@sproutsocial/seeds-react-icon\";\nimport Token from \"@sproutsocial/seeds-react-token\";\nimport Container from \"./styles\";\nimport { asTokenSpec, delimitersAsRegExp } from \"./util\";\nimport type { TypeTokenInputProps, TypeTokenSpec } from \"./TokenInputTypes\";\nimport { TokenScreenReaderStatus } from \"./TokenScreenReaderStatus\";\n\ntype TypeState = {\n prevProps: TypeTokenInputProps;\n hasFocus: boolean;\n activeToken: string | null | undefined;\n value: string;\n};\n\n// Simply using a styled input to allow passing the `as` prop\nconst StyledInput = styled(\"input\")``;\n\nconst DefaultDelimiters = [\",\", \"Enter\"];\nconst ControlledPropNames: (keyof TypeState)[] = [\n \"value\",\n \"hasFocus\",\n \"activeToken\",\n];\n\nexport default class TokenInput extends React.Component<\n TypeTokenInputProps,\n TypeState\n> {\n delimiterMatcher: RegExp;\n\n constructor(props: TypeTokenInputProps) {\n super(props);\n const { hasFocus, activeToken, value, delimiters } = props;\n this.delimiterMatcher = delimitersAsRegExp(delimiters || DefaultDelimiters);\n this.state = {\n prevProps: props,\n hasFocus: hasFocus || false,\n activeToken: activeToken,\n value: value || \"\",\n };\n }\n\n static getDerivedStateFromProps(\n props: Readonly<TypeTokenInputProps>,\n state: TypeState\n ) {\n const { prevProps } = state;\n const modifiedState: Partial<TypeState> = { prevProps: props };\n ControlledPropNames.forEach((propName) => {\n const currentProp = props[propName as keyof TypeTokenInputProps];\n\n // @ts-ignore: TODO - fix state types for prevProps\n if (currentProp !== prevProps[propName]) {\n modifiedState[propName] = currentProp;\n }\n });\n modifiedState.prevProps = props;\n return modifiedState;\n }\n\n isDelimiter(keyName: string) {\n const { delimiters = DefaultDelimiters } = this.props;\n return delimiters.includes(keyName);\n }\n\n spawnNewTokens(texts: string[]) {\n const {\n onAddToken,\n onChangeTokens,\n tokenMaxLength: max = Infinity,\n tokens = [],\n } = this.props;\n const tokenSpecs = texts.map((text) => asTokenSpec(text.slice(0, max)));\n\n if (onAddToken) {\n tokenSpecs.forEach(onAddToken);\n } else if (onChangeTokens) {\n onChangeTokens(tokens.concat(tokenSpecs));\n }\n\n this.setState({\n value: \"\",\n });\n }\n\n deleteToken(tokenId?: string) {\n const { onRemoveToken, onChangeTokens, tokens = [] } = this.props;\n const count = tokens.length;\n if (count === 0) return;\n const id = tokenId ?? tokens[count - 1]?.id;\n\n if (onRemoveToken) {\n onRemoveToken(id ? id : \"\");\n } else if (onChangeTokens) {\n onChangeTokens(tokens.filter((tokenSpec) => tokenSpec.id !== id));\n }\n\n this.setState({\n value: \"\",\n });\n }\n\n handleChangeText = (e: React.SyntheticEvent<HTMLInputElement>) => {\n const { value } = e.currentTarget;\n const { onChange } = this.props;\n this.setState({\n value,\n });\n onChange?.(e, value);\n };\n\n handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n const { onFocus } = this.props;\n this.setState({\n hasFocus: true,\n });\n onFocus?.(e);\n };\n\n handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n const { onBlur } = this.props;\n if (onBlur) onBlur(e);\n this.setState({\n hasFocus: false,\n });\n };\n\n handleKeyUp = (e: React.KeyboardEvent<HTMLInputElement>) => {\n this.props.onKeyUp?.(e, e.currentTarget.value);\n };\n\n handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n const { onKeyDown } = this.props;\n const { key, currentTarget } = e;\n const text = currentTarget.value;\n if (onKeyDown) onKeyDown(e, text);\n\n // keyPress event runs before change\n // Prevent event from bubbling up and calling change, which can lead to comma in value\n if (this.isDelimiter(key)) {\n if (text) {\n this.spawnNewTokens([text]);\n e.preventDefault();\n }\n } else if (key === \"Backspace\") {\n if (text === \"\") {\n this.deleteToken();\n }\n }\n };\n\n handlePaste = (e: React.ClipboardEvent<HTMLInputElement>) => {\n const text = e.clipboardData.getData(\"text\");\n const { onPaste } = this.props;\n if (onPaste) onPaste(e, text);\n const subtexts = text.split(this.delimiterMatcher);\n const texts = subtexts.filter((subtext) => subtext.length);\n\n if (texts.length > 1) {\n this.spawnNewTokens(texts);\n e.preventDefault();\n }\n };\n\n handleClickToken = (\n e: React.SyntheticEvent<Element, Event>,\n token: TypeTokenSpec\n ) => {\n const { onClickToken, disabled } = this.props;\n if (onClickToken) onClickToken(e, token.id);\n\n if (!disabled) {\n this.deleteToken(token.id);\n }\n };\n\n renderToken(token: TypeTokenSpec): React.ReactNode {\n const { iconName: defaultIconName, disabled } = this.props;\n const activeId = this.state.activeToken;\n const {\n id,\n iconName: tokenIconName,\n iconProps = { \"aria-hidden\": true },\n value,\n valid,\n hasWarning,\n tokenProps: { onClick, ...restTokenProps } = {},\n } = token;\n const iconName = tokenIconName || defaultIconName;\n const isActive = activeId === id;\n return (\n <Token\n id={id}\n onClick={(e) => {\n this.handleClickToken(e, token);\n onClick?.(e);\n }}\n valid={valid}\n hasWarning={hasWarning}\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n active={isActive}\n disabled={disabled}\n {...restTokenProps}\n >\n <Box display=\"flex\" alignItems=\"center\">\n {iconName && (\n <Icon name={iconName} size=\"mini\" pr={300} {...iconProps} />\n )}\n {value}\n </Box>\n </Token>\n );\n }\n\n renderTokens(tokens: TypeTokenSpec[]): React.ReactNode {\n return tokens.map<React.ReactNode>((token) => (\n <div key={token.id} className=\"TokenInput-token\">\n {this.renderToken(token)}\n </div>\n ));\n }\n\n override render() {\n const {\n autoFocus,\n autocomplete,\n disabled,\n isInvalid,\n hasWarning,\n id,\n name,\n placeholder,\n required,\n elemBefore,\n elemAfter,\n maxLength,\n ariaDescribedby,\n ariaLabel,\n innerRef,\n containerRef,\n // These functions are used in the class functions above, but need to be extracted in order for `rest` to be correct\n /* eslint-disable @typescript-eslint/no-unused-vars */\n value,\n onAddToken,\n onRemoveToken,\n onChangeTokens,\n onClickToken,\n onBlur,\n onChange,\n onFocus,\n onKeyDown,\n onKeyUp,\n onPaste,\n /* eslint-enable @typescript-eslint/no-unused-vars */\n inputProps = {},\n qa = {},\n tokens,\n ...rest\n } = this.props;\n const { state } = this;\n return (\n <Container\n ref={containerRef}\n hasBeforeElement={!!elemBefore}\n hasAfterElement={!!elemAfter}\n disabled={disabled}\n invalid={!!isInvalid}\n warning={hasWarning}\n focused={state.hasFocus}\n {...rest}\n >\n {elemBefore && <Accessory before>{elemBefore}</Accessory>}\n\n {tokens && this.renderTokens(tokens)}\n\n <TokenScreenReaderStatus tokens={tokens} />\n\n <StyledInput\n aria-describedby={ariaDescribedby}\n aria-invalid={!!isInvalid}\n aria-label={ariaLabel}\n autoFocus={autoFocus}\n autoComplete={autocomplete}\n disabled={disabled}\n id={id}\n name={name}\n placeholder={placeholder}\n type=\"text\"\n required={required}\n value={state.value}\n maxLength={maxLength}\n onBlur={this.handleBlur}\n onChange={this.handleChangeText}\n onFocus={this.handleFocus}\n onKeyDown={this.handleKeyDown}\n onKeyUp={this.handleKeyUp}\n onPaste={this.handlePaste}\n ref={innerRef}\n data-qa-input={name || \"\"}\n data-qa-input-isdisabled={!!disabled}\n data-qa-input-isrequired={!!required}\n {...qa}\n {...inputProps}\n />\n\n {elemAfter && <Accessory after>{elemAfter}</Accessory>}\n </Container>\n );\n }\n}\n","import styled, { css } from \"styled-components\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\nimport { focusRing } from \"@sproutsocial/seeds-react-mixins\";\nimport type { TypeInputContainerProps } from \"@sproutsocial/seeds-react-input\";\n\ninterface TypeTokenInputContainerProps\n extends Pick<\n TypeInputContainerProps,\n \"hasBeforeElement\" | \"hasAfterElement\" | \"disabled\" | \"invalid\" | \"warning\"\n > {\n focused?: boolean;\n}\n\nconst Container = styled.div<TypeTokenInputContainerProps>`\n box-sizing: border-box;\n position: relative;\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n align-content: center;\n cursor: text;\n width: 100%;\n border: 1px solid ${(props) => props.theme.colors.form.border.base};\n border-radius: ${(props) => props.theme.radii[500]};\n margin: 0;\n padding: ${(props) => props.theme.space[300]};\n padding-top: ${(props) => props.theme.space[200]};\n background-color: ${(props) => props.theme.colors.form.background.base};\n color: ${(props) => props.theme.colors.text.body};\n transition: border-color ${(props) => props.theme.duration.fast}\n ${(props) => props.theme.easing.ease_in},\n box-shadow ${(props) => props.theme.duration.fast}\n ${(props) => props.theme.easing.ease_in};\n ${(props) => props.theme.typography[200]};\n font-family: ${(props) => props.theme.fontFamily};\n font-weight: ${(props) => props.theme.fontWeights.normal};\n appearance: none;\n\n button {\n margin: ${(props) => props.theme.space[200]}\n ${(props) => props.theme.space[200]} 0 0;\n }\n\n input,\n textarea {\n ${(props) => props.theme.typography[200]};\n outline: none;\n border: none;\n flex: 1;\n padding: 0;\n padding-top: ${(props) => props.theme.space[100]};\n margin: ${(props) => props.theme.space[200]}\n ${(props) => props.theme.space[300]} ${(props) => props.theme.space[100]}\n 0;\n color: ${(props) => props.theme.colors.text.body};\n background-color: ${(props) => props.theme.colors.form.background.base};\n /** This matches the height of the token so size does not change as tokens are added */\n min-height: 20px;\n\n &::-webkit-search-cancel-button {\n appearance: none;\n }\n\n /* Explicitly removes double focus ring in environments where box-shadow focus styles have been specified (Seeds). Focus is passed up from the input to the parent container. */\n &:focus {\n box-shadow: none;\n }\n\n /* https://stackoverflow.com/questions/14007655/remove-ie10s-clear-field-x-button-on-certain-inputs */\n &::-ms-clear {\n display: none;\n }\n\n /* Fix for red ring when input is marked required in Firefox */\n &:not(output):not(:focus):-moz-ui-invalid {\n box-shadow: none;\n }\n\n &::placeholder {\n color: ${(props) => props.theme.colors.form.placeholder.base};\n font-style: italic;\n }\n\n ${(props) =>\n props.disabled &&\n css`\n opacity: 0.4;\n\n cursor: not-allowed;\n `}\n }\n\n textarea {\n font-family: ${(props) => props.theme.fontFamily};\n }\n\n ${(props) =>\n props.hasBeforeElement &&\n css`\n padding-left: 40px;\n `}\n\n ${(props) =>\n props.hasAfterElement &&\n css`\n padding-right: 40px;\n `}\n\n\n ${(props) =>\n props.disabled &&\n css`\n opacity: 0.4;\n\n cursor: not-allowed;\n `}\n\n ${(props) =>\n props.focused &&\n css`\n ${focusRing}\n `}\n\n ${(props) =>\n props.invalid &&\n css`\n border-color: ${(props) => props.theme.colors.form.border.error};\n `}\n\n\t${(props) =>\n props.warning &&\n css`\n border-color: ${(props) => props.theme.colors.form.border.warning};\n `}\n\n ${COMMON}\n`;\n\nContainer.displayName = \"TokenInputContainer\";\n\nexport default Container;\n","import uniqueId from \"lodash.uniqueid\";\nimport type { TypeTokenSpec } from \"./\";\n\nexport const asTokenSpec = (text: string): TypeTokenSpec => ({\n id: uniqueId(`${text}-`),\n value: text.trim(),\n});\n\nconst KeyNameToRegExpChar: { [key: string]: string } = {\n Enter: \"\\\\n\",\n};\n\nexport const delimitersAsRegExp = (delimiters: string[] | null | undefined) => {\n if (!delimiters) return /[,\\n]/;\n const chars = delimiters\n .map(\n (key) =>\n KeyNameToRegExpChar[key as keyof typeof KeyNameToRegExpChar] || key\n )\n .join(\"\");\n return RegExp(`[${chars}]`);\n};\n","import React from \"react\";\nimport { useEffect, useRef, useState } from \"react\";\nimport { VisuallyHidden } from \"@sproutsocial/seeds-react-visually-hidden\";\nimport type { TypeTokenInputProps } from \"./\";\n\nfunction usePrevious(value: TypeTokenInputProps[\"tokens\"]) {\n const ref = useRef<TypeTokenInputProps[\"tokens\"]>();\n\n useEffect(() => {\n ref.current = value;\n });\n\n return ref.current;\n}\n\nexport const TokenScreenReaderStatus = ({\n tokens,\n}: {\n tokens: TypeTokenInputProps[\"tokens\"];\n}) => {\n const prevTokens = usePrevious(tokens);\n const [tokenStatus, setTokenStatus] = useState(\"\");\n\n // TODO: Use callbacks so consumers can pass localized messaging to the screen reader\n useEffect(() => {\n if (prevTokens && tokens) {\n if (prevTokens.length > tokens.length) {\n setTokenStatus(\n `${\n prevTokens.filter((item) => tokens.indexOf(item) === -1)[0]?.value\n } has been removed`\n );\n }\n\n if (prevTokens.length < tokens.length) {\n setTokenStatus(`${tokens[tokens.length - 1]?.value} has been added.`);\n }\n }\n }, [prevTokens, tokens, tokenStatus]);\n\n return (\n <VisuallyHidden as=\"div\" role=\"status\">\n {tokenStatus}\n </VisuallyHidden>\n );\n};\n","import { needsStyledComponents } from \"@sproutsocial/seeds-react-system-props\";\nimport {\n VisuallyHiddenStyled,\n type VisuallyHiddenProps,\n} from \"./VisuallyHiddenStyled\";\nimport { VisuallyHiddenTailwind } from \"./VisuallyHiddenTailwind\";\n\nexport const VisuallyHiddenHybrid = (props: VisuallyHiddenProps) => {\n if (needsStyledComponents(props)) {\n return <VisuallyHiddenStyled {...props} />;\n }\n\n return <VisuallyHiddenTailwind {...props} />;\n};\n","import styled from \"styled-components\";\nimport { visuallyHidden } from \"@sproutsocial/seeds-react-mixins\";\nimport type { ComponentPropsWithRef } from \"react\";\n\nconst StyledVisuallyHidden = styled.span`\n ${visuallyHidden}\n`;\n\nexport type VisuallyHiddenProps = ComponentPropsWithRef<\n typeof StyledVisuallyHidden\n>;\n\nexport const VisuallyHiddenStyled = (props: VisuallyHiddenProps) => (\n <StyledVisuallyHidden {...props} />\n);\n","import isPropValid from \"@emotion/is-prop-valid\";\nimport * as React from \"react\";\nimport type { VisuallyHiddenProps } from \"./VisuallyHiddenStyled\";\n\nconst mergeClassNames = (...classes: Array<string | undefined>) =>\n classes.filter(Boolean).join(\" \");\n\nexport const VisuallyHiddenTailwind = ({\n as,\n children,\n className,\n ...rest\n}: VisuallyHiddenProps) => {\n const Element = (as ?? \"span\") as React.ElementType;\n const forwardedProps =\n typeof Element === \"string\"\n ? Object.fromEntries(\n Object.entries(rest).filter(([name]) => isPropValid(name))\n )\n : rest;\n\n return React.createElement(\n Element,\n {\n ...forwardedProps,\n className: mergeClassNames(\"seeds-visually-hidden\", className),\n },\n children\n );\n};\n\nVisuallyHiddenTailwind.displayName = \"VisuallyHiddenTailwind\";\n","import { VisuallyHiddenHybrid } from \"./VisuallyHiddenHybrid\";\nimport type { VisuallyHiddenProps } from \"./VisuallyHiddenStyled\";\n\nexport type { VisuallyHiddenProps };\n\n// This wrapper component is needed for react-docgen to work.\n// It has issues with generating docs for the implementation directly.\nexport const VisuallyHidden = (props: VisuallyHiddenProps) => (\n <VisuallyHiddenHybrid {...props} />\n);\n","function memoize(fn) {\n var cache = Object.create(null);\n return function (arg) {\n if (cache[arg] === undefined) cache[arg] = fn(arg);\n return cache[arg];\n };\n}\n\nexport { memoize as default };\n","import memoize from '@emotion/memoize';\n\nvar reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|abbr|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|enterKeyHint|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|translate|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|incremental|fallback|inert|itemProp|itemScope|itemType|itemID|itemRef|on|option|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23\n\nvar isPropValid = /* #__PURE__ */memoize(function (prop) {\n return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111\n /* o */\n && prop.charCodeAt(1) === 110\n /* n */\n && prop.charCodeAt(2) < 91;\n}\n/* Z+1 */\n);\n\nexport { isPropValid as default };\n","import * as React from \"react\";\nimport type {\n TypeStyledComponentsCommonProps,\n TypeSystemCommonProps,\n} from \"@sproutsocial/seeds-react-system-props\";\nimport type {\n TypeIconProps,\n TypeIconName,\n} from \"@sproutsocial/seeds-react-icon\";\nimport type { TypeTokenProps } from \"@sproutsocial/seeds-react-token\";\n\nexport interface TypeTokenSpec {\n id: string;\n iconName?: TypeIconName;\n iconProps?: Omit<TypeIconProps, \"name\">;\n value: string;\n valid?: boolean;\n hasWarning?: boolean;\n tokenProps?: Partial<TypeTokenProps>;\n}\n\nexport interface TypeBaseTokenInputProps {\n /** ID of the form element, should match the \"for\" value of the associated label */\n id: string;\n name: string;\n iconName?: TypeIconName;\n\n /** Array of delimiter key names */\n delimiters?: string[];\n\n /** Current input text. Required when controlling the input text */\n value?: string;\n\n /** Current focus state. Required when controlling the focus via onFocus and onBlur */\n hasFocus?: boolean;\n\n /** Id of the currently selected token */\n activeToken?: string;\n\n /** Array of current tokens */\n tokens?: TypeTokenSpec[];\n\n /** Standard control of changing tokens. For fine-grain control use onAddToken and onRemoveToken, instead */\n onChangeTokens?: (tokens: TypeTokenSpec[]) => void;\n\n /** Fine-grained control of adding tokens. Use with onRemoveToken instead of onChangeTokens */\n onAddToken?: (tokenSpec: TypeTokenSpec) => void;\n\n /** Fine-grained control of removing tokens. Use with onAddToken instead of onChangeTokens */\n onRemoveToken?: (tokenId: string) => void;\n\n /** Controls clicking on a token. When absent, clicking a token removes itself */\n onClickToken?(e: React.SyntheticEvent<Element, Event>, tokenId: string): void;\n\n /** Fine-grained control of the input text used to create tokens */\n onChange?: (e: React.SyntheticEvent<HTMLInputElement>, value: string) => void;\n\n /** Fine-grained control of pasted text */\n onPaste?: (e: React.ClipboardEvent<HTMLInputElement>, value: string) => void;\n onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;\n onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void;\n onKeyDown?: (e: React.KeyboardEvent<HTMLInputElement>, value: string) => void;\n onKeyUp?: (e: React.KeyboardEvent<HTMLInputElement>, value: string) => void;\n\n /** Attribute used to associate other elements that describe the Input, like an error */\n ariaDescribedby?: string;\n\n /** Label used to describe the input if not used with an accompanying visual label */\n ariaLabel?: string;\n\n /** Placeholder text for when value is undefined or empty */\n placeholder?: string;\n\n /** Will autofocus the element when mounted to the DOM */\n autoFocus?: boolean;\n\n /** HTML disabled attribute */\n disabled?: boolean;\n\n /** Whether or not the current contents of the input are invalid */\n isInvalid?: boolean;\n\n /** Whether or not the current contents of the input has any warnings */\n hasWarning?: boolean;\n\n /** HTML required attribute */\n required?: boolean;\n\n /** 16x16 element, such as an icon */\n elemBefore?: React.ReactNode;\n\n /** 16x16 element, such as an icon */\n elemAfter?: React.ReactNode;\n\n /** Max input text length */\n maxLength?: number;\n\n /** Max length of the token */\n tokenMaxLength?: number;\n\n /** Props to spread onto the underlying input element */\n inputProps?: React.ComponentPropsWithoutRef<\"input\">;\n\n /** Used to get a reference to the underlying input element */\n innerRef?: React.Ref<HTMLInputElement>;\n\n /** Ref forwarded to the root container element (used by Radix asChild) */\n containerRef?: React.Ref<HTMLDivElement>;\n qa?: object;\n\n /** Browser autocomplete support */\n autocomplete?: string;\n}\n\nexport interface TypeTokenInputProps\n extends TypeBaseTokenInputProps,\n TypeStyledComponentsCommonProps,\n TypeSystemCommonProps,\n Omit<\n React.ComponentPropsWithoutRef<\"div\">,\n keyof TypeBaseTokenInputProps | \"color\"\n > {}\n"],"mappings":"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","names":["React","React","styled","props","styled","jsx","styled","jsx","jsx","styled","TokenInput"]}
package/dist/index.js CHANGED
@@ -34,10 +34,10 @@ __export(index_exports, {
34
34
  default: () => index_default
35
35
  });
36
36
  module.exports = __toCommonJS(index_exports);
37
- var React4 = __toESM(require("react"));
37
+ var React5 = __toESM(require("react"));
38
38
 
39
39
  // src/TokenInput.tsx
40
- var React2 = __toESM(require("react"));
40
+ var React3 = __toESM(require("react"));
41
41
  var import_styled_components3 = __toESM(require("styled-components"));
42
42
  var import_seeds_react_input = require("@sproutsocial/seeds-react-input");
43
43
  var import_seeds_react_box = __toESM(require("@sproutsocial/seeds-react-box"));
@@ -183,18 +183,68 @@ var import_react = require("react");
183
183
  var import_react2 = require("react");
184
184
 
185
185
  // ../seeds-react-visually-hidden/dist/esm/index.js
186
+ var import_seeds_react_system_props2 = require("@sproutsocial/seeds-react-system-props");
186
187
  var import_styled_components2 = __toESM(require("styled-components"));
187
188
  var import_seeds_react_mixins2 = require("@sproutsocial/seeds-react-mixins");
188
189
  var import_jsx_runtime = require("react/jsx-runtime");
190
+
191
+ // ../../node_modules/@emotion/memoize/dist/emotion-memoize.esm.js
192
+ function memoize(fn) {
193
+ var cache = /* @__PURE__ */ Object.create(null);
194
+ return function(arg) {
195
+ if (cache[arg] === void 0) cache[arg] = fn(arg);
196
+ return cache[arg];
197
+ };
198
+ }
199
+
200
+ // ../../node_modules/@emotion/is-prop-valid/dist/emotion-is-prop-valid.esm.js
201
+ var reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|abbr|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|enterKeyHint|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|translate|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|incremental|fallback|inert|itemProp|itemScope|itemType|itemID|itemRef|on|option|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/;
202
+ var isPropValid = /* @__PURE__ */ memoize(
203
+ function(prop) {
204
+ return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111 && prop.charCodeAt(1) === 110 && prop.charCodeAt(2) < 91;
205
+ }
206
+ /* Z+1 */
207
+ );
208
+
209
+ // ../seeds-react-visually-hidden/dist/esm/index.js
210
+ var React = __toESM(require("react"));
211
+ var import_jsx_runtime2 = require("react/jsx-runtime");
212
+ var import_jsx_runtime3 = require("react/jsx-runtime");
189
213
  var StyledVisuallyHidden = import_styled_components2.default.span`
190
214
  ${import_seeds_react_mixins2.visuallyHidden}
191
215
  `;
192
- var VisuallyHidden = (props) => {
193
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StyledVisuallyHidden, { ...props });
216
+ var VisuallyHiddenStyled = (props) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StyledVisuallyHidden, { ...props });
217
+ var mergeClassNames = (...classes) => classes.filter(Boolean).join(" ");
218
+ var VisuallyHiddenTailwind = ({
219
+ as,
220
+ children,
221
+ className,
222
+ ...rest
223
+ }) => {
224
+ const Element = as ?? "span";
225
+ const forwardedProps = typeof Element === "string" ? Object.fromEntries(
226
+ Object.entries(rest).filter(([name]) => isPropValid(name))
227
+ ) : rest;
228
+ return React.createElement(
229
+ Element,
230
+ {
231
+ ...forwardedProps,
232
+ className: mergeClassNames("seeds-visually-hidden", className)
233
+ },
234
+ children
235
+ );
194
236
  };
237
+ VisuallyHiddenTailwind.displayName = "VisuallyHiddenTailwind";
238
+ var VisuallyHiddenHybrid = (props) => {
239
+ if ((0, import_seeds_react_system_props2.needsStyledComponents)(props)) {
240
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(VisuallyHiddenStyled, { ...props });
241
+ }
242
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(VisuallyHiddenTailwind, { ...props });
243
+ };
244
+ var VisuallyHidden = (props) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(VisuallyHiddenHybrid, { ...props });
195
245
 
196
246
  // src/TokenScreenReaderStatus.tsx
197
- var import_jsx_runtime2 = require("react/jsx-runtime");
247
+ var import_jsx_runtime4 = require("react/jsx-runtime");
198
248
  function usePrevious(value) {
199
249
  const ref = (0, import_react2.useRef)();
200
250
  (0, import_react2.useEffect)(() => {
@@ -219,11 +269,11 @@ var TokenScreenReaderStatus = ({
219
269
  }
220
270
  }
221
271
  }, [prevTokens, tokens, tokenStatus]);
222
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(VisuallyHidden, { as: "div", role: "status", children: tokenStatus });
272
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(VisuallyHidden, { as: "div", role: "status", children: tokenStatus });
223
273
  };
224
274
 
225
275
  // src/TokenInput.tsx
226
- var import_jsx_runtime3 = require("react/jsx-runtime");
276
+ var import_jsx_runtime5 = require("react/jsx-runtime");
227
277
  var StyledInput = (0, import_styled_components3.default)("input")``;
228
278
  var DefaultDelimiters = [",", "Enter"];
229
279
  var ControlledPropNames = [
@@ -231,7 +281,7 @@ var ControlledPropNames = [
231
281
  "hasFocus",
232
282
  "activeToken"
233
283
  ];
234
- var TokenInput = class extends React2.Component {
284
+ var TokenInput = class extends React3.Component {
235
285
  delimiterMatcher;
236
286
  constructor(props) {
237
287
  super(props);
@@ -364,7 +414,7 @@ var TokenInput = class extends React2.Component {
364
414
  } = token;
365
415
  const iconName = tokenIconName || defaultIconName;
366
416
  const isActive = activeId === id;
367
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
417
+ return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
368
418
  import_seeds_react_token.default,
369
419
  {
370
420
  id,
@@ -377,15 +427,15 @@ var TokenInput = class extends React2.Component {
377
427
  active: isActive,
378
428
  disabled,
379
429
  ...restTokenProps,
380
- children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_seeds_react_box.default, { display: "flex", alignItems: "center", children: [
381
- iconName && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_seeds_react_icon.default, { name: iconName, size: "mini", pr: 300, ...iconProps }),
430
+ children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_seeds_react_box.default, { display: "flex", alignItems: "center", children: [
431
+ iconName && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_seeds_react_icon.default, { name: iconName, size: "mini", pr: 300, ...iconProps }),
382
432
  value
383
433
  ] })
384
434
  }
385
435
  );
386
436
  }
387
437
  renderTokens(tokens) {
388
- return tokens.map((token) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "TokenInput-token", children: this.renderToken(token) }, token.id));
438
+ return tokens.map((token) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "TokenInput-token", children: this.renderToken(token) }, token.id));
389
439
  }
390
440
  render() {
391
441
  const {
@@ -425,7 +475,7 @@ var TokenInput = class extends React2.Component {
425
475
  ...rest
426
476
  } = this.props;
427
477
  const { state } = this;
428
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
478
+ return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
429
479
  styles_default,
430
480
  {
431
481
  ref: containerRef,
@@ -437,10 +487,10 @@ var TokenInput = class extends React2.Component {
437
487
  focused: state.hasFocus,
438
488
  ...rest,
439
489
  children: [
440
- elemBefore && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_seeds_react_input.Accessory, { before: true, children: elemBefore }),
490
+ elemBefore && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_seeds_react_input.Accessory, { before: true, children: elemBefore }),
441
491
  tokens && this.renderTokens(tokens),
442
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(TokenScreenReaderStatus, { tokens }),
443
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
492
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(TokenScreenReaderStatus, { tokens }),
493
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
444
494
  StyledInput,
445
495
  {
446
496
  "aria-describedby": ariaDescribedby,
@@ -470,7 +520,7 @@ var TokenInput = class extends React2.Component {
470
520
  ...inputProps
471
521
  }
472
522
  ),
473
- elemAfter && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_seeds_react_input.Accessory, { after: true, children: elemAfter })
523
+ elemAfter && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_seeds_react_input.Accessory, { after: true, children: elemAfter })
474
524
  ]
475
525
  }
476
526
  );
@@ -478,11 +528,11 @@ var TokenInput = class extends React2.Component {
478
528
  };
479
529
 
480
530
  // src/TokenInputTypes.ts
481
- var React3 = require("react");
531
+ var React4 = require("react");
482
532
 
483
533
  // src/index.ts
484
- var TokenInput2 = React4.forwardRef(
485
- (props, ref) => React4.createElement(TokenInput, { ...props, containerRef: ref })
534
+ var TokenInput2 = React5.forwardRef(
535
+ (props, ref) => React5.createElement(TokenInput, { ...props, containerRef: ref })
486
536
  );
487
537
  TokenInput2.displayName = "TokenInput";
488
538
  var index_default = TokenInput2;
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/TokenInput.tsx","../src/styles.ts","../src/util.ts","../src/TokenScreenReaderStatus.tsx","../../seeds-react-visually-hidden/src/VisuallyHidden.tsx","../src/TokenInputTypes.ts"],"sourcesContent":["import * as React from \"react\";\nimport TokenInputClass from \"./TokenInput\";\nimport type { TypeTokenInputProps } from \"./TokenInputTypes\";\n\n/**\n * Wraps the class-based TokenInput with forwardRef so that the standard React\n * `ref` prop resolves to the root Container DOM node. This is required for\n * Radix UI's `asChild` pattern (used by seeds-react-menu's Popout) which\n * expects triggerRef to be a DOM element for `.contains()` checks.\n *\n * The existing `innerRef` prop still forwards to the underlying `<input>`.\n */\nconst TokenInput = React.forwardRef<HTMLDivElement, TypeTokenInputProps>(\n (props, ref) =>\n React.createElement(TokenInputClass, { ...props, containerRef: ref })\n);\n\nTokenInput.displayName = \"TokenInput\";\n\nexport default TokenInput;\nexport { TokenInput };\nexport * from \"./TokenInputTypes\";\n","import * as React from \"react\";\nimport styled from \"styled-components\";\nimport { Accessory } from \"@sproutsocial/seeds-react-input\";\nimport Box from \"@sproutsocial/seeds-react-box\";\nimport Icon from \"@sproutsocial/seeds-react-icon\";\nimport Token from \"@sproutsocial/seeds-react-token\";\nimport Container from \"./styles\";\nimport { asTokenSpec, delimitersAsRegExp } from \"./util\";\nimport type { TypeTokenInputProps, TypeTokenSpec } from \"./TokenInputTypes\";\nimport { TokenScreenReaderStatus } from \"./TokenScreenReaderStatus\";\n\ntype TypeState = {\n prevProps: TypeTokenInputProps;\n hasFocus: boolean;\n activeToken: string | null | undefined;\n value: string;\n};\n\n// Simply using a styled input to allow passing the `as` prop\nconst StyledInput = styled(\"input\")``;\n\nconst DefaultDelimiters = [\",\", \"Enter\"];\nconst ControlledPropNames: (keyof TypeState)[] = [\n \"value\",\n \"hasFocus\",\n \"activeToken\",\n];\n\nexport default class TokenInput extends React.Component<\n TypeTokenInputProps,\n TypeState\n> {\n delimiterMatcher: RegExp;\n\n constructor(props: TypeTokenInputProps) {\n super(props);\n const { hasFocus, activeToken, value, delimiters } = props;\n this.delimiterMatcher = delimitersAsRegExp(delimiters || DefaultDelimiters);\n this.state = {\n prevProps: props,\n hasFocus: hasFocus || false,\n activeToken: activeToken,\n value: value || \"\",\n };\n }\n\n static getDerivedStateFromProps(\n props: Readonly<TypeTokenInputProps>,\n state: TypeState\n ) {\n const { prevProps } = state;\n const modifiedState: Partial<TypeState> = { prevProps: props };\n ControlledPropNames.forEach((propName) => {\n const currentProp = props[propName as keyof TypeTokenInputProps];\n\n // @ts-ignore: TODO - fix state types for prevProps\n if (currentProp !== prevProps[propName]) {\n modifiedState[propName] = currentProp;\n }\n });\n modifiedState.prevProps = props;\n return modifiedState;\n }\n\n isDelimiter(keyName: string) {\n const { delimiters = DefaultDelimiters } = this.props;\n return delimiters.includes(keyName);\n }\n\n spawnNewTokens(texts: string[]) {\n const {\n onAddToken,\n onChangeTokens,\n tokenMaxLength: max = Infinity,\n tokens = [],\n } = this.props;\n const tokenSpecs = texts.map((text) => asTokenSpec(text.slice(0, max)));\n\n if (onAddToken) {\n tokenSpecs.forEach(onAddToken);\n } else if (onChangeTokens) {\n onChangeTokens(tokens.concat(tokenSpecs));\n }\n\n this.setState({\n value: \"\",\n });\n }\n\n deleteToken(tokenId?: string) {\n const { onRemoveToken, onChangeTokens, tokens = [] } = this.props;\n const count = tokens.length;\n if (count === 0) return;\n const id = tokenId ?? tokens[count - 1]?.id;\n\n if (onRemoveToken) {\n onRemoveToken(id ? id : \"\");\n } else if (onChangeTokens) {\n onChangeTokens(tokens.filter((tokenSpec) => tokenSpec.id !== id));\n }\n\n this.setState({\n value: \"\",\n });\n }\n\n handleChangeText = (e: React.SyntheticEvent<HTMLInputElement>) => {\n const { value } = e.currentTarget;\n const { onChange } = this.props;\n this.setState({\n value,\n });\n onChange?.(e, value);\n };\n\n handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n const { onFocus } = this.props;\n this.setState({\n hasFocus: true,\n });\n onFocus?.(e);\n };\n\n handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n const { onBlur } = this.props;\n if (onBlur) onBlur(e);\n this.setState({\n hasFocus: false,\n });\n };\n\n handleKeyUp = (e: React.KeyboardEvent<HTMLInputElement>) => {\n this.props.onKeyUp?.(e, e.currentTarget.value);\n };\n\n handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n const { onKeyDown } = this.props;\n const { key, currentTarget } = e;\n const text = currentTarget.value;\n if (onKeyDown) onKeyDown(e, text);\n\n // keyPress event runs before change\n // Prevent event from bubbling up and calling change, which can lead to comma in value\n if (this.isDelimiter(key)) {\n if (text) {\n this.spawnNewTokens([text]);\n e.preventDefault();\n }\n } else if (key === \"Backspace\") {\n if (text === \"\") {\n this.deleteToken();\n }\n }\n };\n\n handlePaste = (e: React.ClipboardEvent<HTMLInputElement>) => {\n const text = e.clipboardData.getData(\"text\");\n const { onPaste } = this.props;\n if (onPaste) onPaste(e, text);\n const subtexts = text.split(this.delimiterMatcher);\n const texts = subtexts.filter((subtext) => subtext.length);\n\n if (texts.length > 1) {\n this.spawnNewTokens(texts);\n e.preventDefault();\n }\n };\n\n handleClickToken = (\n e: React.SyntheticEvent<Element, Event>,\n token: TypeTokenSpec\n ) => {\n const { onClickToken, disabled } = this.props;\n if (onClickToken) onClickToken(e, token.id);\n\n if (!disabled) {\n this.deleteToken(token.id);\n }\n };\n\n renderToken(token: TypeTokenSpec): React.ReactNode {\n const { iconName: defaultIconName, disabled } = this.props;\n const activeId = this.state.activeToken;\n const {\n id,\n iconName: tokenIconName,\n iconProps = { \"aria-hidden\": true },\n value,\n valid,\n hasWarning,\n tokenProps: { onClick, ...restTokenProps } = {},\n } = token;\n const iconName = tokenIconName || defaultIconName;\n const isActive = activeId === id;\n return (\n <Token\n id={id}\n onClick={(e) => {\n this.handleClickToken(e, token);\n onClick?.(e);\n }}\n valid={valid}\n hasWarning={hasWarning}\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n active={isActive}\n disabled={disabled}\n {...restTokenProps}\n >\n <Box display=\"flex\" alignItems=\"center\">\n {iconName && (\n <Icon name={iconName} size=\"mini\" pr={300} {...iconProps} />\n )}\n {value}\n </Box>\n </Token>\n );\n }\n\n renderTokens(tokens: TypeTokenSpec[]): React.ReactNode {\n return tokens.map<React.ReactNode>((token) => (\n <div key={token.id} className=\"TokenInput-token\">\n {this.renderToken(token)}\n </div>\n ));\n }\n\n override render() {\n const {\n autoFocus,\n autocomplete,\n disabled,\n isInvalid,\n hasWarning,\n id,\n name,\n placeholder,\n required,\n elemBefore,\n elemAfter,\n maxLength,\n ariaDescribedby,\n ariaLabel,\n innerRef,\n containerRef,\n // These functions are used in the class functions above, but need to be extracted in order for `rest` to be correct\n /* eslint-disable @typescript-eslint/no-unused-vars */\n value,\n onAddToken,\n onRemoveToken,\n onChangeTokens,\n onClickToken,\n onBlur,\n onChange,\n onFocus,\n onKeyDown,\n onKeyUp,\n onPaste,\n /* eslint-enable @typescript-eslint/no-unused-vars */\n inputProps = {},\n qa = {},\n tokens,\n ...rest\n } = this.props;\n const { state } = this;\n return (\n <Container\n ref={containerRef}\n hasBeforeElement={!!elemBefore}\n hasAfterElement={!!elemAfter}\n disabled={disabled}\n invalid={!!isInvalid}\n warning={hasWarning}\n focused={state.hasFocus}\n {...rest}\n >\n {elemBefore && <Accessory before>{elemBefore}</Accessory>}\n\n {tokens && this.renderTokens(tokens)}\n\n <TokenScreenReaderStatus tokens={tokens} />\n\n <StyledInput\n aria-describedby={ariaDescribedby}\n aria-invalid={!!isInvalid}\n aria-label={ariaLabel}\n autoFocus={autoFocus}\n autoComplete={autocomplete}\n disabled={disabled}\n id={id}\n name={name}\n placeholder={placeholder}\n type=\"text\"\n required={required}\n value={state.value}\n maxLength={maxLength}\n onBlur={this.handleBlur}\n onChange={this.handleChangeText}\n onFocus={this.handleFocus}\n onKeyDown={this.handleKeyDown}\n onKeyUp={this.handleKeyUp}\n onPaste={this.handlePaste}\n ref={innerRef}\n data-qa-input={name || \"\"}\n data-qa-input-isdisabled={!!disabled}\n data-qa-input-isrequired={!!required}\n {...qa}\n {...inputProps}\n />\n\n {elemAfter && <Accessory after>{elemAfter}</Accessory>}\n </Container>\n );\n }\n}\n","import styled, { css } from \"styled-components\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\nimport { focusRing } from \"@sproutsocial/seeds-react-mixins\";\nimport type { TypeInputContainerProps } from \"@sproutsocial/seeds-react-input\";\n\ninterface TypeTokenInputContainerProps\n extends Pick<\n TypeInputContainerProps,\n \"hasBeforeElement\" | \"hasAfterElement\" | \"disabled\" | \"invalid\" | \"warning\"\n > {\n focused?: boolean;\n}\n\nconst Container = styled.div<TypeTokenInputContainerProps>`\n box-sizing: border-box;\n position: relative;\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n align-content: center;\n cursor: text;\n width: 100%;\n border: 1px solid ${(props) => props.theme.colors.form.border.base};\n border-radius: ${(props) => props.theme.radii[500]};\n margin: 0;\n padding: ${(props) => props.theme.space[300]};\n padding-top: ${(props) => props.theme.space[200]};\n background-color: ${(props) => props.theme.colors.form.background.base};\n color: ${(props) => props.theme.colors.text.body};\n transition: border-color ${(props) => props.theme.duration.fast}\n ${(props) => props.theme.easing.ease_in},\n box-shadow ${(props) => props.theme.duration.fast}\n ${(props) => props.theme.easing.ease_in};\n ${(props) => props.theme.typography[200]};\n font-family: ${(props) => props.theme.fontFamily};\n font-weight: ${(props) => props.theme.fontWeights.normal};\n appearance: none;\n\n button {\n margin: ${(props) => props.theme.space[200]}\n ${(props) => props.theme.space[200]} 0 0;\n }\n\n input,\n textarea {\n ${(props) => props.theme.typography[200]};\n outline: none;\n border: none;\n flex: 1;\n padding: 0;\n padding-top: ${(props) => props.theme.space[100]};\n margin: ${(props) => props.theme.space[200]}\n ${(props) => props.theme.space[300]} ${(props) => props.theme.space[100]}\n 0;\n color: ${(props) => props.theme.colors.text.body};\n background-color: ${(props) => props.theme.colors.form.background.base};\n /** This matches the height of the token so size does not change as tokens are added */\n min-height: 20px;\n\n &::-webkit-search-cancel-button {\n appearance: none;\n }\n\n /* Explicitly removes double focus ring in environments where box-shadow focus styles have been specified (Seeds). Focus is passed up from the input to the parent container. */\n &:focus {\n box-shadow: none;\n }\n\n /* https://stackoverflow.com/questions/14007655/remove-ie10s-clear-field-x-button-on-certain-inputs */\n &::-ms-clear {\n display: none;\n }\n\n /* Fix for red ring when input is marked required in Firefox */\n &:not(output):not(:focus):-moz-ui-invalid {\n box-shadow: none;\n }\n\n &::placeholder {\n color: ${(props) => props.theme.colors.form.placeholder.base};\n font-style: italic;\n }\n\n ${(props) =>\n props.disabled &&\n css`\n opacity: 0.4;\n\n cursor: not-allowed;\n `}\n }\n\n textarea {\n font-family: ${(props) => props.theme.fontFamily};\n }\n\n ${(props) =>\n props.hasBeforeElement &&\n css`\n padding-left: 40px;\n `}\n\n ${(props) =>\n props.hasAfterElement &&\n css`\n padding-right: 40px;\n `}\n\n\n ${(props) =>\n props.disabled &&\n css`\n opacity: 0.4;\n\n cursor: not-allowed;\n `}\n\n ${(props) =>\n props.focused &&\n css`\n ${focusRing}\n `}\n\n ${(props) =>\n props.invalid &&\n css`\n border-color: ${(props) => props.theme.colors.form.border.error};\n `}\n\n\t${(props) =>\n props.warning &&\n css`\n border-color: ${(props) => props.theme.colors.form.border.warning};\n `}\n\n ${COMMON}\n`;\n\nContainer.displayName = \"TokenInputContainer\";\n\nexport default Container;\n","import uniqueId from \"lodash.uniqueid\";\nimport type { TypeTokenSpec } from \"./\";\n\nexport const asTokenSpec = (text: string): TypeTokenSpec => ({\n id: uniqueId(`${text}-`),\n value: text.trim(),\n});\n\nconst KeyNameToRegExpChar: { [key: string]: string } = {\n Enter: \"\\\\n\",\n};\n\nexport const delimitersAsRegExp = (delimiters: string[] | null | undefined) => {\n if (!delimiters) return /[,\\n]/;\n const chars = delimiters\n .map(\n (key) =>\n KeyNameToRegExpChar[key as keyof typeof KeyNameToRegExpChar] || key\n )\n .join(\"\");\n return RegExp(`[${chars}]`);\n};\n","import React from \"react\";\nimport { useEffect, useRef, useState } from \"react\";\nimport { VisuallyHidden } from \"@sproutsocial/seeds-react-visually-hidden\";\nimport type { TypeTokenInputProps } from \"./\";\n\nfunction usePrevious(value: TypeTokenInputProps[\"tokens\"]) {\n const ref = useRef<TypeTokenInputProps[\"tokens\"]>();\n\n useEffect(() => {\n ref.current = value;\n });\n\n return ref.current;\n}\n\nexport const TokenScreenReaderStatus = ({\n tokens,\n}: {\n tokens: TypeTokenInputProps[\"tokens\"];\n}) => {\n const prevTokens = usePrevious(tokens);\n const [tokenStatus, setTokenStatus] = useState(\"\");\n\n // TODO: Use callbacks so consumers can pass localized messaging to the screen reader\n useEffect(() => {\n if (prevTokens && tokens) {\n if (prevTokens.length > tokens.length) {\n setTokenStatus(\n `${\n prevTokens.filter((item) => tokens.indexOf(item) === -1)[0]?.value\n } has been removed`\n );\n }\n\n if (prevTokens.length < tokens.length) {\n setTokenStatus(`${tokens[tokens.length - 1]?.value} has been added.`);\n }\n }\n }, [prevTokens, tokens, tokenStatus]);\n\n return (\n <VisuallyHidden as=\"div\" role=\"status\">\n {tokenStatus}\n </VisuallyHidden>\n );\n};\n","import styled from \"styled-components\";\nimport { visuallyHidden } from \"@sproutsocial/seeds-react-mixins\";\nimport type { ComponentPropsWithRef } from \"react\";\n\nconst StyledVisuallyHidden = styled.span`\n ${visuallyHidden}\n`;\n\nexport type VisuallyHiddenProps = ComponentPropsWithRef<\n typeof StyledVisuallyHidden\n>;\n\n// This wrapper component is needed for react-docgen to work.\n// It has issues with generating docs for the styled component directly.\nexport const VisuallyHidden = (props: VisuallyHiddenProps) => {\n return <StyledVisuallyHidden {...props} />;\n};\n","import * as React from \"react\";\nimport type {\n TypeStyledComponentsCommonProps,\n TypeSystemCommonProps,\n} from \"@sproutsocial/seeds-react-system-props\";\nimport type {\n TypeIconProps,\n TypeIconName,\n} from \"@sproutsocial/seeds-react-icon\";\nimport type { TypeTokenProps } from \"@sproutsocial/seeds-react-token\";\n\nexport interface TypeTokenSpec {\n id: string;\n iconName?: TypeIconName;\n iconProps?: Omit<TypeIconProps, \"name\">;\n value: string;\n valid?: boolean;\n hasWarning?: boolean;\n tokenProps?: Partial<TypeTokenProps>;\n}\n\nexport interface TypeBaseTokenInputProps {\n /** ID of the form element, should match the \"for\" value of the associated label */\n id: string;\n name: string;\n iconName?: TypeIconName;\n\n /** Array of delimiter key names */\n delimiters?: string[];\n\n /** Current input text. Required when controlling the input text */\n value?: string;\n\n /** Current focus state. Required when controlling the focus via onFocus and onBlur */\n hasFocus?: boolean;\n\n /** Id of the currently selected token */\n activeToken?: string;\n\n /** Array of current tokens */\n tokens?: TypeTokenSpec[];\n\n /** Standard control of changing tokens. For fine-grain control use onAddToken and onRemoveToken, instead */\n onChangeTokens?: (tokens: TypeTokenSpec[]) => void;\n\n /** Fine-grained control of adding tokens. Use with onRemoveToken instead of onChangeTokens */\n onAddToken?: (tokenSpec: TypeTokenSpec) => void;\n\n /** Fine-grained control of removing tokens. Use with onAddToken instead of onChangeTokens */\n onRemoveToken?: (tokenId: string) => void;\n\n /** Controls clicking on a token. When absent, clicking a token removes itself */\n onClickToken?(e: React.SyntheticEvent<Element, Event>, tokenId: string): void;\n\n /** Fine-grained control of the input text used to create tokens */\n onChange?: (e: React.SyntheticEvent<HTMLInputElement>, value: string) => void;\n\n /** Fine-grained control of pasted text */\n onPaste?: (e: React.ClipboardEvent<HTMLInputElement>, value: string) => void;\n onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;\n onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void;\n onKeyDown?: (e: React.KeyboardEvent<HTMLInputElement>, value: string) => void;\n onKeyUp?: (e: React.KeyboardEvent<HTMLInputElement>, value: string) => void;\n\n /** Attribute used to associate other elements that describe the Input, like an error */\n ariaDescribedby?: string;\n\n /** Label used to describe the input if not used with an accompanying visual label */\n ariaLabel?: string;\n\n /** Placeholder text for when value is undefined or empty */\n placeholder?: string;\n\n /** Will autofocus the element when mounted to the DOM */\n autoFocus?: boolean;\n\n /** HTML disabled attribute */\n disabled?: boolean;\n\n /** Whether or not the current contents of the input are invalid */\n isInvalid?: boolean;\n\n /** Whether or not the current contents of the input has any warnings */\n hasWarning?: boolean;\n\n /** HTML required attribute */\n required?: boolean;\n\n /** 16x16 element, such as an icon */\n elemBefore?: React.ReactNode;\n\n /** 16x16 element, such as an icon */\n elemAfter?: React.ReactNode;\n\n /** Max input text length */\n maxLength?: number;\n\n /** Max length of the token */\n tokenMaxLength?: number;\n\n /** Props to spread onto the underlying input element */\n inputProps?: React.ComponentPropsWithoutRef<\"input\">;\n\n /** Used to get a reference to the underlying input element */\n innerRef?: React.Ref<HTMLInputElement>;\n\n /** Ref forwarded to the root container element (used by Radix asChild) */\n containerRef?: React.Ref<HTMLDivElement>;\n qa?: object;\n\n /** Browser autocomplete support */\n autocomplete?: string;\n}\n\nexport interface TypeTokenInputProps\n extends TypeBaseTokenInputProps,\n TypeStyledComponentsCommonProps,\n TypeSystemCommonProps,\n Omit<\n React.ComponentPropsWithoutRef<\"div\">,\n keyof TypeBaseTokenInputProps | \"color\"\n > {}\n"],"mappings":"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","names":["TokenInput","React","React","import_styled_components","styled","props","uniqueId","import_react","import_styled_components","import_seeds_react_mixins","styled","import_jsx_runtime","import_jsx_runtime","styled","Token","Box","Icon","React","TokenInput"]}
1
+ {"version":3,"sources":["../src/index.ts","../src/TokenInput.tsx","../src/styles.ts","../src/util.ts","../src/TokenScreenReaderStatus.tsx","../../seeds-react-visually-hidden/src/VisuallyHiddenHybrid.tsx","../../seeds-react-visually-hidden/src/VisuallyHiddenStyled.tsx","../../seeds-react-visually-hidden/src/VisuallyHiddenTailwind.tsx","../../seeds-react-visually-hidden/src/VisuallyHidden.tsx","../../../node_modules/@emotion/memoize/dist/emotion-memoize.esm.js","../../../node_modules/@emotion/is-prop-valid/dist/emotion-is-prop-valid.esm.js","../src/TokenInputTypes.ts"],"sourcesContent":["import * as React from \"react\";\nimport TokenInputClass from \"./TokenInput\";\nimport type { TypeTokenInputProps } from \"./TokenInputTypes\";\n\n/**\n * Wraps the class-based TokenInput with forwardRef so that the standard React\n * `ref` prop resolves to the root Container DOM node. This is required for\n * Radix UI's `asChild` pattern (used by seeds-react-menu's Popout) which\n * expects triggerRef to be a DOM element for `.contains()` checks.\n *\n * The existing `innerRef` prop still forwards to the underlying `<input>`.\n */\nconst TokenInput = React.forwardRef<HTMLDivElement, TypeTokenInputProps>(\n (props, ref) =>\n React.createElement(TokenInputClass, { ...props, containerRef: ref })\n);\n\nTokenInput.displayName = \"TokenInput\";\n\nexport default TokenInput;\nexport { TokenInput };\nexport * from \"./TokenInputTypes\";\n","import * as React from \"react\";\nimport styled from \"styled-components\";\nimport { Accessory } from \"@sproutsocial/seeds-react-input\";\nimport Box from \"@sproutsocial/seeds-react-box\";\nimport Icon from \"@sproutsocial/seeds-react-icon\";\nimport Token from \"@sproutsocial/seeds-react-token\";\nimport Container from \"./styles\";\nimport { asTokenSpec, delimitersAsRegExp } from \"./util\";\nimport type { TypeTokenInputProps, TypeTokenSpec } from \"./TokenInputTypes\";\nimport { TokenScreenReaderStatus } from \"./TokenScreenReaderStatus\";\n\ntype TypeState = {\n prevProps: TypeTokenInputProps;\n hasFocus: boolean;\n activeToken: string | null | undefined;\n value: string;\n};\n\n// Simply using a styled input to allow passing the `as` prop\nconst StyledInput = styled(\"input\")``;\n\nconst DefaultDelimiters = [\",\", \"Enter\"];\nconst ControlledPropNames: (keyof TypeState)[] = [\n \"value\",\n \"hasFocus\",\n \"activeToken\",\n];\n\nexport default class TokenInput extends React.Component<\n TypeTokenInputProps,\n TypeState\n> {\n delimiterMatcher: RegExp;\n\n constructor(props: TypeTokenInputProps) {\n super(props);\n const { hasFocus, activeToken, value, delimiters } = props;\n this.delimiterMatcher = delimitersAsRegExp(delimiters || DefaultDelimiters);\n this.state = {\n prevProps: props,\n hasFocus: hasFocus || false,\n activeToken: activeToken,\n value: value || \"\",\n };\n }\n\n static getDerivedStateFromProps(\n props: Readonly<TypeTokenInputProps>,\n state: TypeState\n ) {\n const { prevProps } = state;\n const modifiedState: Partial<TypeState> = { prevProps: props };\n ControlledPropNames.forEach((propName) => {\n const currentProp = props[propName as keyof TypeTokenInputProps];\n\n // @ts-ignore: TODO - fix state types for prevProps\n if (currentProp !== prevProps[propName]) {\n modifiedState[propName] = currentProp;\n }\n });\n modifiedState.prevProps = props;\n return modifiedState;\n }\n\n isDelimiter(keyName: string) {\n const { delimiters = DefaultDelimiters } = this.props;\n return delimiters.includes(keyName);\n }\n\n spawnNewTokens(texts: string[]) {\n const {\n onAddToken,\n onChangeTokens,\n tokenMaxLength: max = Infinity,\n tokens = [],\n } = this.props;\n const tokenSpecs = texts.map((text) => asTokenSpec(text.slice(0, max)));\n\n if (onAddToken) {\n tokenSpecs.forEach(onAddToken);\n } else if (onChangeTokens) {\n onChangeTokens(tokens.concat(tokenSpecs));\n }\n\n this.setState({\n value: \"\",\n });\n }\n\n deleteToken(tokenId?: string) {\n const { onRemoveToken, onChangeTokens, tokens = [] } = this.props;\n const count = tokens.length;\n if (count === 0) return;\n const id = tokenId ?? tokens[count - 1]?.id;\n\n if (onRemoveToken) {\n onRemoveToken(id ? id : \"\");\n } else if (onChangeTokens) {\n onChangeTokens(tokens.filter((tokenSpec) => tokenSpec.id !== id));\n }\n\n this.setState({\n value: \"\",\n });\n }\n\n handleChangeText = (e: React.SyntheticEvent<HTMLInputElement>) => {\n const { value } = e.currentTarget;\n const { onChange } = this.props;\n this.setState({\n value,\n });\n onChange?.(e, value);\n };\n\n handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n const { onFocus } = this.props;\n this.setState({\n hasFocus: true,\n });\n onFocus?.(e);\n };\n\n handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n const { onBlur } = this.props;\n if (onBlur) onBlur(e);\n this.setState({\n hasFocus: false,\n });\n };\n\n handleKeyUp = (e: React.KeyboardEvent<HTMLInputElement>) => {\n this.props.onKeyUp?.(e, e.currentTarget.value);\n };\n\n handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n const { onKeyDown } = this.props;\n const { key, currentTarget } = e;\n const text = currentTarget.value;\n if (onKeyDown) onKeyDown(e, text);\n\n // keyPress event runs before change\n // Prevent event from bubbling up and calling change, which can lead to comma in value\n if (this.isDelimiter(key)) {\n if (text) {\n this.spawnNewTokens([text]);\n e.preventDefault();\n }\n } else if (key === \"Backspace\") {\n if (text === \"\") {\n this.deleteToken();\n }\n }\n };\n\n handlePaste = (e: React.ClipboardEvent<HTMLInputElement>) => {\n const text = e.clipboardData.getData(\"text\");\n const { onPaste } = this.props;\n if (onPaste) onPaste(e, text);\n const subtexts = text.split(this.delimiterMatcher);\n const texts = subtexts.filter((subtext) => subtext.length);\n\n if (texts.length > 1) {\n this.spawnNewTokens(texts);\n e.preventDefault();\n }\n };\n\n handleClickToken = (\n e: React.SyntheticEvent<Element, Event>,\n token: TypeTokenSpec\n ) => {\n const { onClickToken, disabled } = this.props;\n if (onClickToken) onClickToken(e, token.id);\n\n if (!disabled) {\n this.deleteToken(token.id);\n }\n };\n\n renderToken(token: TypeTokenSpec): React.ReactNode {\n const { iconName: defaultIconName, disabled } = this.props;\n const activeId = this.state.activeToken;\n const {\n id,\n iconName: tokenIconName,\n iconProps = { \"aria-hidden\": true },\n value,\n valid,\n hasWarning,\n tokenProps: { onClick, ...restTokenProps } = {},\n } = token;\n const iconName = tokenIconName || defaultIconName;\n const isActive = activeId === id;\n return (\n <Token\n id={id}\n onClick={(e) => {\n this.handleClickToken(e, token);\n onClick?.(e);\n }}\n valid={valid}\n hasWarning={hasWarning}\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n active={isActive}\n disabled={disabled}\n {...restTokenProps}\n >\n <Box display=\"flex\" alignItems=\"center\">\n {iconName && (\n <Icon name={iconName} size=\"mini\" pr={300} {...iconProps} />\n )}\n {value}\n </Box>\n </Token>\n );\n }\n\n renderTokens(tokens: TypeTokenSpec[]): React.ReactNode {\n return tokens.map<React.ReactNode>((token) => (\n <div key={token.id} className=\"TokenInput-token\">\n {this.renderToken(token)}\n </div>\n ));\n }\n\n override render() {\n const {\n autoFocus,\n autocomplete,\n disabled,\n isInvalid,\n hasWarning,\n id,\n name,\n placeholder,\n required,\n elemBefore,\n elemAfter,\n maxLength,\n ariaDescribedby,\n ariaLabel,\n innerRef,\n containerRef,\n // These functions are used in the class functions above, but need to be extracted in order for `rest` to be correct\n /* eslint-disable @typescript-eslint/no-unused-vars */\n value,\n onAddToken,\n onRemoveToken,\n onChangeTokens,\n onClickToken,\n onBlur,\n onChange,\n onFocus,\n onKeyDown,\n onKeyUp,\n onPaste,\n /* eslint-enable @typescript-eslint/no-unused-vars */\n inputProps = {},\n qa = {},\n tokens,\n ...rest\n } = this.props;\n const { state } = this;\n return (\n <Container\n ref={containerRef}\n hasBeforeElement={!!elemBefore}\n hasAfterElement={!!elemAfter}\n disabled={disabled}\n invalid={!!isInvalid}\n warning={hasWarning}\n focused={state.hasFocus}\n {...rest}\n >\n {elemBefore && <Accessory before>{elemBefore}</Accessory>}\n\n {tokens && this.renderTokens(tokens)}\n\n <TokenScreenReaderStatus tokens={tokens} />\n\n <StyledInput\n aria-describedby={ariaDescribedby}\n aria-invalid={!!isInvalid}\n aria-label={ariaLabel}\n autoFocus={autoFocus}\n autoComplete={autocomplete}\n disabled={disabled}\n id={id}\n name={name}\n placeholder={placeholder}\n type=\"text\"\n required={required}\n value={state.value}\n maxLength={maxLength}\n onBlur={this.handleBlur}\n onChange={this.handleChangeText}\n onFocus={this.handleFocus}\n onKeyDown={this.handleKeyDown}\n onKeyUp={this.handleKeyUp}\n onPaste={this.handlePaste}\n ref={innerRef}\n data-qa-input={name || \"\"}\n data-qa-input-isdisabled={!!disabled}\n data-qa-input-isrequired={!!required}\n {...qa}\n {...inputProps}\n />\n\n {elemAfter && <Accessory after>{elemAfter}</Accessory>}\n </Container>\n );\n }\n}\n","import styled, { css } from \"styled-components\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\nimport { focusRing } from \"@sproutsocial/seeds-react-mixins\";\nimport type { TypeInputContainerProps } from \"@sproutsocial/seeds-react-input\";\n\ninterface TypeTokenInputContainerProps\n extends Pick<\n TypeInputContainerProps,\n \"hasBeforeElement\" | \"hasAfterElement\" | \"disabled\" | \"invalid\" | \"warning\"\n > {\n focused?: boolean;\n}\n\nconst Container = styled.div<TypeTokenInputContainerProps>`\n box-sizing: border-box;\n position: relative;\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n align-content: center;\n cursor: text;\n width: 100%;\n border: 1px solid ${(props) => props.theme.colors.form.border.base};\n border-radius: ${(props) => props.theme.radii[500]};\n margin: 0;\n padding: ${(props) => props.theme.space[300]};\n padding-top: ${(props) => props.theme.space[200]};\n background-color: ${(props) => props.theme.colors.form.background.base};\n color: ${(props) => props.theme.colors.text.body};\n transition: border-color ${(props) => props.theme.duration.fast}\n ${(props) => props.theme.easing.ease_in},\n box-shadow ${(props) => props.theme.duration.fast}\n ${(props) => props.theme.easing.ease_in};\n ${(props) => props.theme.typography[200]};\n font-family: ${(props) => props.theme.fontFamily};\n font-weight: ${(props) => props.theme.fontWeights.normal};\n appearance: none;\n\n button {\n margin: ${(props) => props.theme.space[200]}\n ${(props) => props.theme.space[200]} 0 0;\n }\n\n input,\n textarea {\n ${(props) => props.theme.typography[200]};\n outline: none;\n border: none;\n flex: 1;\n padding: 0;\n padding-top: ${(props) => props.theme.space[100]};\n margin: ${(props) => props.theme.space[200]}\n ${(props) => props.theme.space[300]} ${(props) => props.theme.space[100]}\n 0;\n color: ${(props) => props.theme.colors.text.body};\n background-color: ${(props) => props.theme.colors.form.background.base};\n /** This matches the height of the token so size does not change as tokens are added */\n min-height: 20px;\n\n &::-webkit-search-cancel-button {\n appearance: none;\n }\n\n /* Explicitly removes double focus ring in environments where box-shadow focus styles have been specified (Seeds). Focus is passed up from the input to the parent container. */\n &:focus {\n box-shadow: none;\n }\n\n /* https://stackoverflow.com/questions/14007655/remove-ie10s-clear-field-x-button-on-certain-inputs */\n &::-ms-clear {\n display: none;\n }\n\n /* Fix for red ring when input is marked required in Firefox */\n &:not(output):not(:focus):-moz-ui-invalid {\n box-shadow: none;\n }\n\n &::placeholder {\n color: ${(props) => props.theme.colors.form.placeholder.base};\n font-style: italic;\n }\n\n ${(props) =>\n props.disabled &&\n css`\n opacity: 0.4;\n\n cursor: not-allowed;\n `}\n }\n\n textarea {\n font-family: ${(props) => props.theme.fontFamily};\n }\n\n ${(props) =>\n props.hasBeforeElement &&\n css`\n padding-left: 40px;\n `}\n\n ${(props) =>\n props.hasAfterElement &&\n css`\n padding-right: 40px;\n `}\n\n\n ${(props) =>\n props.disabled &&\n css`\n opacity: 0.4;\n\n cursor: not-allowed;\n `}\n\n ${(props) =>\n props.focused &&\n css`\n ${focusRing}\n `}\n\n ${(props) =>\n props.invalid &&\n css`\n border-color: ${(props) => props.theme.colors.form.border.error};\n `}\n\n\t${(props) =>\n props.warning &&\n css`\n border-color: ${(props) => props.theme.colors.form.border.warning};\n `}\n\n ${COMMON}\n`;\n\nContainer.displayName = \"TokenInputContainer\";\n\nexport default Container;\n","import uniqueId from \"lodash.uniqueid\";\nimport type { TypeTokenSpec } from \"./\";\n\nexport const asTokenSpec = (text: string): TypeTokenSpec => ({\n id: uniqueId(`${text}-`),\n value: text.trim(),\n});\n\nconst KeyNameToRegExpChar: { [key: string]: string } = {\n Enter: \"\\\\n\",\n};\n\nexport const delimitersAsRegExp = (delimiters: string[] | null | undefined) => {\n if (!delimiters) return /[,\\n]/;\n const chars = delimiters\n .map(\n (key) =>\n KeyNameToRegExpChar[key as keyof typeof KeyNameToRegExpChar] || key\n )\n .join(\"\");\n return RegExp(`[${chars}]`);\n};\n","import React from \"react\";\nimport { useEffect, useRef, useState } from \"react\";\nimport { VisuallyHidden } from \"@sproutsocial/seeds-react-visually-hidden\";\nimport type { TypeTokenInputProps } from \"./\";\n\nfunction usePrevious(value: TypeTokenInputProps[\"tokens\"]) {\n const ref = useRef<TypeTokenInputProps[\"tokens\"]>();\n\n useEffect(() => {\n ref.current = value;\n });\n\n return ref.current;\n}\n\nexport const TokenScreenReaderStatus = ({\n tokens,\n}: {\n tokens: TypeTokenInputProps[\"tokens\"];\n}) => {\n const prevTokens = usePrevious(tokens);\n const [tokenStatus, setTokenStatus] = useState(\"\");\n\n // TODO: Use callbacks so consumers can pass localized messaging to the screen reader\n useEffect(() => {\n if (prevTokens && tokens) {\n if (prevTokens.length > tokens.length) {\n setTokenStatus(\n `${\n prevTokens.filter((item) => tokens.indexOf(item) === -1)[0]?.value\n } has been removed`\n );\n }\n\n if (prevTokens.length < tokens.length) {\n setTokenStatus(`${tokens[tokens.length - 1]?.value} has been added.`);\n }\n }\n }, [prevTokens, tokens, tokenStatus]);\n\n return (\n <VisuallyHidden as=\"div\" role=\"status\">\n {tokenStatus}\n </VisuallyHidden>\n );\n};\n","import { needsStyledComponents } from \"@sproutsocial/seeds-react-system-props\";\nimport {\n VisuallyHiddenStyled,\n type VisuallyHiddenProps,\n} from \"./VisuallyHiddenStyled\";\nimport { VisuallyHiddenTailwind } from \"./VisuallyHiddenTailwind\";\n\nexport const VisuallyHiddenHybrid = (props: VisuallyHiddenProps) => {\n if (needsStyledComponents(props)) {\n return <VisuallyHiddenStyled {...props} />;\n }\n\n return <VisuallyHiddenTailwind {...props} />;\n};\n","import styled from \"styled-components\";\nimport { visuallyHidden } from \"@sproutsocial/seeds-react-mixins\";\nimport type { ComponentPropsWithRef } from \"react\";\n\nconst StyledVisuallyHidden = styled.span`\n ${visuallyHidden}\n`;\n\nexport type VisuallyHiddenProps = ComponentPropsWithRef<\n typeof StyledVisuallyHidden\n>;\n\nexport const VisuallyHiddenStyled = (props: VisuallyHiddenProps) => (\n <StyledVisuallyHidden {...props} />\n);\n","import isPropValid from \"@emotion/is-prop-valid\";\nimport * as React from \"react\";\nimport type { VisuallyHiddenProps } from \"./VisuallyHiddenStyled\";\n\nconst mergeClassNames = (...classes: Array<string | undefined>) =>\n classes.filter(Boolean).join(\" \");\n\nexport const VisuallyHiddenTailwind = ({\n as,\n children,\n className,\n ...rest\n}: VisuallyHiddenProps) => {\n const Element = (as ?? \"span\") as React.ElementType;\n const forwardedProps =\n typeof Element === \"string\"\n ? Object.fromEntries(\n Object.entries(rest).filter(([name]) => isPropValid(name))\n )\n : rest;\n\n return React.createElement(\n Element,\n {\n ...forwardedProps,\n className: mergeClassNames(\"seeds-visually-hidden\", className),\n },\n children\n );\n};\n\nVisuallyHiddenTailwind.displayName = \"VisuallyHiddenTailwind\";\n","import { VisuallyHiddenHybrid } from \"./VisuallyHiddenHybrid\";\nimport type { VisuallyHiddenProps } from \"./VisuallyHiddenStyled\";\n\nexport type { VisuallyHiddenProps };\n\n// This wrapper component is needed for react-docgen to work.\n// It has issues with generating docs for the implementation directly.\nexport const VisuallyHidden = (props: VisuallyHiddenProps) => (\n <VisuallyHiddenHybrid {...props} />\n);\n","function memoize(fn) {\n var cache = Object.create(null);\n return function (arg) {\n if (cache[arg] === undefined) cache[arg] = fn(arg);\n return cache[arg];\n };\n}\n\nexport { memoize as default };\n","import memoize from '@emotion/memoize';\n\nvar reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|abbr|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|enterKeyHint|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|translate|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|incremental|fallback|inert|itemProp|itemScope|itemType|itemID|itemRef|on|option|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23\n\nvar isPropValid = /* #__PURE__ */memoize(function (prop) {\n return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111\n /* o */\n && prop.charCodeAt(1) === 110\n /* n */\n && prop.charCodeAt(2) < 91;\n}\n/* Z+1 */\n);\n\nexport { isPropValid as default };\n","import * as React from \"react\";\nimport type {\n TypeStyledComponentsCommonProps,\n TypeSystemCommonProps,\n} from \"@sproutsocial/seeds-react-system-props\";\nimport type {\n TypeIconProps,\n TypeIconName,\n} from \"@sproutsocial/seeds-react-icon\";\nimport type { TypeTokenProps } from \"@sproutsocial/seeds-react-token\";\n\nexport interface TypeTokenSpec {\n id: string;\n iconName?: TypeIconName;\n iconProps?: Omit<TypeIconProps, \"name\">;\n value: string;\n valid?: boolean;\n hasWarning?: boolean;\n tokenProps?: Partial<TypeTokenProps>;\n}\n\nexport interface TypeBaseTokenInputProps {\n /** ID of the form element, should match the \"for\" value of the associated label */\n id: string;\n name: string;\n iconName?: TypeIconName;\n\n /** Array of delimiter key names */\n delimiters?: string[];\n\n /** Current input text. Required when controlling the input text */\n value?: string;\n\n /** Current focus state. Required when controlling the focus via onFocus and onBlur */\n hasFocus?: boolean;\n\n /** Id of the currently selected token */\n activeToken?: string;\n\n /** Array of current tokens */\n tokens?: TypeTokenSpec[];\n\n /** Standard control of changing tokens. For fine-grain control use onAddToken and onRemoveToken, instead */\n onChangeTokens?: (tokens: TypeTokenSpec[]) => void;\n\n /** Fine-grained control of adding tokens. Use with onRemoveToken instead of onChangeTokens */\n onAddToken?: (tokenSpec: TypeTokenSpec) => void;\n\n /** Fine-grained control of removing tokens. Use with onAddToken instead of onChangeTokens */\n onRemoveToken?: (tokenId: string) => void;\n\n /** Controls clicking on a token. When absent, clicking a token removes itself */\n onClickToken?(e: React.SyntheticEvent<Element, Event>, tokenId: string): void;\n\n /** Fine-grained control of the input text used to create tokens */\n onChange?: (e: React.SyntheticEvent<HTMLInputElement>, value: string) => void;\n\n /** Fine-grained control of pasted text */\n onPaste?: (e: React.ClipboardEvent<HTMLInputElement>, value: string) => void;\n onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;\n onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void;\n onKeyDown?: (e: React.KeyboardEvent<HTMLInputElement>, value: string) => void;\n onKeyUp?: (e: React.KeyboardEvent<HTMLInputElement>, value: string) => void;\n\n /** Attribute used to associate other elements that describe the Input, like an error */\n ariaDescribedby?: string;\n\n /** Label used to describe the input if not used with an accompanying visual label */\n ariaLabel?: string;\n\n /** Placeholder text for when value is undefined or empty */\n placeholder?: string;\n\n /** Will autofocus the element when mounted to the DOM */\n autoFocus?: boolean;\n\n /** HTML disabled attribute */\n disabled?: boolean;\n\n /** Whether or not the current contents of the input are invalid */\n isInvalid?: boolean;\n\n /** Whether or not the current contents of the input has any warnings */\n hasWarning?: boolean;\n\n /** HTML required attribute */\n required?: boolean;\n\n /** 16x16 element, such as an icon */\n elemBefore?: React.ReactNode;\n\n /** 16x16 element, such as an icon */\n elemAfter?: React.ReactNode;\n\n /** Max input text length */\n maxLength?: number;\n\n /** Max length of the token */\n tokenMaxLength?: number;\n\n /** Props to spread onto the underlying input element */\n inputProps?: React.ComponentPropsWithoutRef<\"input\">;\n\n /** Used to get a reference to the underlying input element */\n innerRef?: React.Ref<HTMLInputElement>;\n\n /** Ref forwarded to the root container element (used by Radix asChild) */\n containerRef?: React.Ref<HTMLDivElement>;\n qa?: object;\n\n /** Browser autocomplete support */\n autocomplete?: string;\n}\n\nexport interface TypeTokenInputProps\n extends TypeBaseTokenInputProps,\n TypeStyledComponentsCommonProps,\n TypeSystemCommonProps,\n Omit<\n React.ComponentPropsWithoutRef<\"div\">,\n keyof TypeBaseTokenInputProps | \"color\"\n > {}\n"],"mappings":"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","names":["TokenInput","React","React","import_styled_components","styled","props","uniqueId","import_react","import_seeds_react_system_props","import_styled_components","import_seeds_react_mixins","import_jsx_runtime","styled","jsx","import_jsx_runtime","import_jsx_runtime","styled","Token","Box","Icon","React","TokenInput"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sproutsocial/seeds-react-token-input",
3
- "version": "1.4.62",
3
+ "version": "1.4.64",
4
4
  "description": "Seeds React TokenInput",
5
5
  "author": "Sprout Social, Inc.",
6
6
  "license": "MIT",
@@ -18,13 +18,13 @@
18
18
  "test:watch": "jest --watch --coverage=false"
19
19
  },
20
20
  "dependencies": {
21
- "@sproutsocial/seeds-react-theme": "^4.4.0",
22
- "@sproutsocial/seeds-react-system-props": "^3.2.0",
23
- "@sproutsocial/seeds-react-mixins": "^4.3.14",
24
- "@sproutsocial/seeds-react-input": "^1.5.40",
25
- "@sproutsocial/seeds-react-box": "^1.1.30",
26
- "@sproutsocial/seeds-react-icon": "^2.5.0",
27
- "@sproutsocial/seeds-react-token": "^1.5.18",
21
+ "@sproutsocial/seeds-react-theme": "^4.5.1",
22
+ "@sproutsocial/seeds-react-system-props": "^3.2.1",
23
+ "@sproutsocial/seeds-react-mixins": "^4.3.16",
24
+ "@sproutsocial/seeds-react-input": "^1.5.42",
25
+ "@sproutsocial/seeds-react-box": "^1.1.32",
26
+ "@sproutsocial/seeds-react-icon": "^2.5.2",
27
+ "@sproutsocial/seeds-react-token": "^1.5.20",
28
28
  "lodash.uniqueid": "^4.0.1"
29
29
  },
30
30
  "devDependencies": {