@okta/odyssey-react-mui 1.34.0 → 1.35.2

package/dist/esm/labs/OdysseyPickers/SearchDropdown.js

@@ -0,0 +1,263 @@
+/*!
+ * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.
+ * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
+ *
+ * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *
+ * See the License for the specific language governing permissions and limitations under the License.
+ */
+
+import { memo, useCallback, useMemo } from "react";
+import styled from "@emotion/styled";
+import { ComposablePicker } from "./ComposablePicker.js";
+import { useOdysseyDesignTokens } from "../../OdysseyDesignTokensContext.js";
+import { Option, OptionDescriptionComponent, OptionLabelContainer, OptionMetadataComponent } from "./Picker.js";
+import { Heading6 } from "../../Typography.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const OptionAdornmentContainer = styled("div", {
+  shouldForwardProp: prop => prop !== "odysseyDesignTokens" && prop !== "adornmentSize" && prop !== "isTagContainer"
+})(({
+  adornmentSize = "small",
+  isTagContainer = false,
+  odysseyDesignTokens,
+  position = "left"
+}) => ({
+  position: "relative",
+  bottom: "1px",
+  alignSelf: "flex-start",
+  width: odysseyDesignTokens.Spacing5,
+  height: odysseyDesignTokens.Spacing5,
+  overflow: "hidden",
+  ...(position === "left" && {
+    marginInlineEnd: odysseyDesignTokens.Spacing3
+  }),
+  ...(position === "right" && {
+    marginInlineStart: odysseyDesignTokens.Spacing3
+  }),
+  svg: {
+    width: "100%",
+    height: "auto"
+  },
+  img: {
+    position: "absolute",
+    top: "50%",
+    left: "50%",
+    width: "100%",
+    transform: "translate(-50%, -50%)"
+  },
+  ...(adornmentSize === "large" && !isTagContainer && {
+    bottom: 0,
+    width: odysseyDesignTokens.Spacing8,
+    height: odysseyDesignTokens.Spacing8
+  }),
+  ...(isTagContainer && {
+    bottom: 0,
+    alignSelf: "center",
+    width: odysseyDesignTokens.Spacing4,
+    height: "auto",
+    maxHeight: odysseyDesignTokens.Spacing4,
+    marginInlineEnd: odysseyDesignTokens.Spacing2,
+    svg: {
+      display: "flex",
+      width: "100%",
+      height: "auto"
+    }
+  })
+}));
+const CustomOptionContainer = styled("div", {
+  shouldForwardProp: prop => prop !== "odysseyDesignTokens"
+})(() => ({
+  display: "flex",
+  justifyContent: "space-between",
+  width: "100%"
+}));
+const CustomOptionLeftContainer = styled("div", {
+  shouldForwardProp: prop => prop !== "odysseyDesignTokens"
+})(() => ({
+  display: "flex"
+}));
+const OptionAdornment = ({
+  adornment,
+  adornmentSize,
+  odysseyDesignTokens
+}) => {
+  const isImageAdornment = typeof adornment === "string";
+  if (isImageAdornment) {
+    return _jsx(OptionAdornmentContainer, {
+      adornmentSize: adornmentSize,
+      odysseyDesignTokens: odysseyDesignTokens,
+      children: _jsx("img", {
+        src: adornment,
+        alt: "",
+        role: "presentation"
+      })
+    });
+  } else {
+    return _jsx(OptionAdornmentContainer, {
+      adornmentSize: adornmentSize,
+      odysseyDesignTokens: odysseyDesignTokens,
+      children: adornment
+    });
+  }
+};
+const Extra = ({
+  content,
+  size,
+  odysseyDesignTokens,
+  onClick
+}) => {
+  const handleClick = useCallback(event => {
+    event.stopPropagation();
+    onClick();
+  }, [onClick]);
+  return _jsx(OptionAdornmentContainer, {
+    adornmentSize: size,
+    odysseyDesignTokens: odysseyDesignTokens,
+    onClick: handleClick,
+    children: content
+  });
+};
+const CustomOption = ({
+  adornmentSize,
+  muiProps,
+  odysseyDesignTokens,
+  option
+}) => {
+  const {
+    adornment,
+    description,
+    label,
+    metaData,
+    extra,
+    value,
+    onClick,
+    isInteractive = true
+  } = option;
+  const handleOptionClick = useCallback(event => {
+    if (!isInteractive) {
+      event.preventDefault();
+      return;
+    }
+    event.stopPropagation();
+    onClick?.();
+  }, [onClick, isInteractive]);
+  const extendedMuiProps = useMemo(() => {
+    return {
+      ...muiProps,
+      onClick: isInteractive ? handleOptionClick : undefined,
+      "aria-disabled": !isInteractive ? "true" : undefined,
+      role: "option"
+    };
+  }, [muiProps, isInteractive, handleOptionClick]);
+  return _jsx(Option, {
+    hasAdornment: true,
+    muiProps: extendedMuiProps,
+    children: _jsxs(CustomOptionContainer, {
+      odysseyDesignTokens: odysseyDesignTokens,
+      children: [_jsxs(CustomOptionLeftContainer, {
+        odysseyDesignTokens: odysseyDesignTokens,
+        children: [_jsx(OptionAdornment, {
+          adornment: adornment,
+          adornmentSize: adornmentSize,
+          odysseyDesignTokens: odysseyDesignTokens
+        }), _jsxs("div", {
+          children: [_jsxs(OptionLabelContainer, {
+            odysseyDesignTokens: odysseyDesignTokens,
+            children: [_jsx(Heading6, {
+              component: "p",
+              children: label
+            }), _jsx(OptionDescriptionComponent, {
+              description: description,
+              odysseyDesignTokens: odysseyDesignTokens
+            })]
+          }), metaData && _jsx(OptionMetadataComponent, {
+            metaData: metaData,
+            odysseyDesignTokens: odysseyDesignTokens
+          })]
+        })]
+      }), extra && _jsx(Extra, {
+        content: extra.content,
+        size: extra.size || adornmentSize,
+        onClick: extra.onClick,
+        odysseyDesignTokens: odysseyDesignTokens
+      })]
+    })
+  }, value);
+};
+const SearchDropdown = ({
+  adornmentSize = "small",
+  ariaDescribedBy,
+  defaultValue,
+  errorMessage,
+  errorMessageList,
+  getIsOptionEqualToValue,
+  groupOptionsBy,
+  id: idOverride,
+  inputValue,
+  isCustomValueAllowed,
+  isDisabled,
+  isFullWidth = false,
+  isLoading,
+  isOptional = false,
+  isReadOnly,
+  isVirtualized: isVirtualizedProp = false,
+  hint,
+  HintLinkComponent,
+  label,
+  name: nameOverride,
+  onBlur,
+  onChange: onChangeProp,
+  onInputChange: onInputChangeProp,
+  onFocus,
+  options,
+  value,
+  testId,
+  translate
+}) => {
+  const odysseyDesignTokens = useOdysseyDesignTokens();
+  const customOptionRender = useCallback((muiProps, option) => {
+    return _jsx(CustomOption, {
+      adornmentSize: adornmentSize,
+      muiProps: muiProps,
+      odysseyDesignTokens: odysseyDesignTokens,
+      option: option
+    });
+  }, [adornmentSize, odysseyDesignTokens]);
+  return _jsx(ComposablePicker, {
+    ariaDescribedBy: ariaDescribedBy,
+    defaultValue: defaultValue,
+    errorMessage: errorMessage,
+    errorMessageList: errorMessageList,
+    getIsOptionEqualToValue: getIsOptionEqualToValue,
+    groupOptionsBy: groupOptionsBy,
+    id: idOverride,
+    inputValue: inputValue,
+    isCustomValueAllowed: isCustomValueAllowed,
+    isDisabled: isDisabled,
+    isFullWidth: isFullWidth,
+    isLoading: isLoading,
+    isOptional: isOptional,
+    isReadOnly: isReadOnly,
+    isVirtualized: isVirtualizedProp,
+    hint: hint,
+    HintLinkComponent: HintLinkComponent,
+    label: label,
+    name: nameOverride,
+    onBlur: onBlur,
+    onChange: onChangeProp,
+    onInputChange: onInputChangeProp,
+    onFocus: onFocus,
+    options: options,
+    renderOption: customOptionRender,
+    value: value,
+    testId: testId,
+    translate: translate
+  });
+};
+const MemoizedSearchDropdown = memo(SearchDropdown);
+MemoizedSearchDropdown.displayName = "MemoizedSearchDropdown";
+export { MemoizedSearchDropdown as SearchDropdown };
+//# sourceMappingURL=SearchDropdown.js.map

package/dist/esm/labs/OdysseyPickers/SearchDropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchDropdown.js","names":["memo","useCallback","useMemo","styled","ComposablePicker","useOdysseyDesignTokens","Option","OptionDescriptionComponent","OptionLabelContainer","OptionMetadataComponent","Heading6","jsx","_jsx","jsxs","_jsxs","OptionAdornmentContainer","shouldForwardProp","prop","adornmentSize","isTagContainer","odysseyDesignTokens","position","bottom","alignSelf","width","Spacing5","height","overflow","marginInlineEnd","Spacing3","marginInlineStart","svg","img","top","left","transform","Spacing8","Spacing4","maxHeight","Spacing2","display","CustomOptionContainer","justifyContent","CustomOptionLeftContainer","OptionAdornment","adornment","isImageAdornment","children","src","alt","role","Extra","content","size","onClick","handleClick","event","stopPropagation","CustomOption","muiProps","option","description","label","metaData","extra","value","isInteractive","handleOptionClick","preventDefault","extendedMuiProps","undefined","hasAdornment","component","SearchDropdown","ariaDescribedBy","defaultValue","errorMessage","errorMessageList","getIsOptionEqualToValue","groupOptionsBy","id","idOverride","inputValue","isCustomValueAllowed","isDisabled","isFullWidth","isLoading","isOptional","isReadOnly","isVirtualized","isVirtualizedProp","hint","HintLinkComponent","name","nameOverride","onBlur","onChange","onChangeProp","onInputChange","onInputChangeProp","onFocus","options","testId","translate","customOptionRender","renderOption","MemoizedSearchDropdown","displayName"],"sources":["../../../../src/labs/OdysseyPickers/SearchDropdown.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport {\n  HTMLAttributes,\n  memo,\n  ReactElement,\n  ReactNode,\n  useCallback,\n  useMemo,\n} from \"react\";\nimport styled from \"@emotion/styled\";\n\nimport {\n  ComposablePicker,\n  type AdornmentSize,\n  type BasePickerProps,\n  type BasePickerType,\n} from \"./ComposablePicker.js\";\nimport {\n  useOdysseyDesignTokens,\n  DesignTokens,\n} from \"../../OdysseyDesignTokensContext.js\";\nimport {\n  type BaseOptionProps,\n  type LabelDescription,\n  type Metadata,\n  Option,\n  OptionDescriptionComponent,\n  OptionLabelContainer,\n  OptionMetadataComponent,\n  OptionProps,\n} from \"./Picker.js\";\nimport { Heading6 } from \"../../Typography.js\";\n\ntype Adornment = ReactNode | string;\ntype ExtraType = {\n  content: ReactNode | string;\n  size?: AdornmentSize;\n  onClick: () => void;\n};\n\ntype AdornmentLabelDescription = LabelDescription & {\n  adornment: Adornment;\n  extra?: ExtraType;\n  onClick?: () => void;\n  isInteractive?: boolean;\n};\n\nexport type CustomOptionType = AdornmentLabelDescription & Partial<Metadata>;\n\nconst OptionAdornmentContainer = styled(\"div\", {\n  shouldForwardProp: (prop) =>\n    prop !== \"odysseyDesignTokens\" &&\n    prop !== \"adornmentSize\" &&\n    prop !== \"isTagContainer\",\n})<{\n  adornmentSize?: AdornmentSize;\n  isTagContainer?: boolean;\n  odysseyDesignTokens: DesignTokens;\n  position?: \"left\" | \"right\";\n}>(\n  ({\n    adornmentSize = \"small\",\n    isTagContainer = false,\n\n    odysseyDesignTokens,\n    position = \"left\",\n  }) => ({\n    position: \"relative\",\n    // push icon up by one px for better visual alignment\n    bottom: \"1px\",\n    alignSelf: \"flex-start\",\n    width: odysseyDesignTokens.Spacing5,\n    height: odysseyDesignTokens.Spacing5,\n    overflow: \"hidden\",\n\n    ...(position === \"left\" && {\n      marginInlineEnd: odysseyDesignTokens.Spacing3,\n    }),\n    ...(position === \"right\" && {\n      marginInlineStart: odysseyDesignTokens.Spacing3,\n    }),\n\n    svg: {\n      width: \"100%\",\n      height: \"auto\",\n    },\n\n    img: {\n      position: \"absolute\",\n      top: \"50%\",\n      left: \"50%\",\n      width: \"100%\",\n      transform: \"translate(-50%, -50%)\",\n    },\n\n    ...(adornmentSize === \"large\" &&\n      !isTagContainer && {\n        bottom: 0,\n        width: odysseyDesignTokens.Spacing8,\n        height: odysseyDesignTokens.Spacing8,\n      }),\n\n    ...(isTagContainer && {\n      bottom: 0,\n      alignSelf: \"center\",\n      width: odysseyDesignTokens.Spacing4,\n      height: \"auto\",\n      maxHeight: odysseyDesignTokens.Spacing4,\n      marginInlineEnd: odysseyDesignTokens.Spacing2,\n\n      svg: {\n        display: \"flex\",\n        width: \"100%\",\n        height: \"auto\",\n      },\n    }),\n  }),\n);\n\ntype OptionAdornmentProps = {\n  adornment: Adornment;\n  adornmentSize: AdornmentSize;\n  odysseyDesignTokens: DesignTokens;\n};\n\ntype ExtraProps = {\n  content: Adornment;\n  size?: AdornmentSize;\n  odysseyDesignTokens: DesignTokens;\n  onClick: () => void;\n};\n\nconst CustomOptionContainer = styled(\"div\", {\n  shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(() => ({\n  display: \"flex\",\n  justifyContent: \"space-between\",\n  width: \"100%\",\n}));\n\nconst CustomOptionLeftContainer = styled(\"div\", {\n  shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(() => ({\n  display: \"flex\",\n}));\n\nconst OptionAdornment = ({\n  adornment,\n  adornmentSize,\n  odysseyDesignTokens,\n}: OptionAdornmentProps) => {\n  const isImageAdornment = typeof adornment === \"string\";\n\n  if (isImageAdornment) {\n    return (\n      <OptionAdornmentContainer\n        adornmentSize={adornmentSize}\n        odysseyDesignTokens={odysseyDesignTokens}\n      >\n        <img src={adornment} alt=\"\" role=\"presentation\" />\n      </OptionAdornmentContainer>\n    );\n  } else {\n    return (\n      <OptionAdornmentContainer\n        adornmentSize={adornmentSize}\n        odysseyDesignTokens={odysseyDesignTokens}\n      >\n        {adornment}\n      </OptionAdornmentContainer>\n    );\n  }\n};\n\nconst Extra = ({ content, size, odysseyDesignTokens, onClick }: ExtraProps) => {\n  const handleClick = useCallback(\n    (event: React.MouseEvent) => {\n      event.stopPropagation();\n      onClick();\n    },\n    [onClick],\n  );\n\n  return (\n    <OptionAdornmentContainer\n      adornmentSize={size}\n      odysseyDesignTokens={odysseyDesignTokens}\n      onClick={handleClick}\n    >\n      {content}\n    </OptionAdornmentContainer>\n  );\n};\n\nconst CustomOption = <OptionType extends CustomOptionType>({\n  adornmentSize,\n  muiProps,\n  odysseyDesignTokens,\n  option,\n}: BaseOptionProps &\n  OptionProps<OptionType> & {\n    adornmentSize: AdornmentSize;\n  }) => {\n  const {\n    adornment,\n    description,\n    label,\n    metaData,\n    extra,\n    value,\n    onClick,\n    isInteractive = true,\n  } = option;\n\n  const handleOptionClick = useCallback(\n    (event: React.MouseEvent) => {\n      if (!isInteractive) {\n        event.preventDefault();\n        return;\n      }\n      event.stopPropagation();\n      onClick?.();\n    },\n    [onClick, isInteractive],\n  );\n\n  const extendedMuiProps = useMemo(() => {\n    return {\n      ...muiProps,\n      onClick: isInteractive ? handleOptionClick : undefined,\n      \"aria-disabled\": !isInteractive ? \"true\" : undefined,\n      role: \"option\",\n    } as HTMLAttributes<HTMLLIElement>;\n  }, [muiProps, isInteractive, handleOptionClick]);\n\n  return (\n    <Option hasAdornment key={value} muiProps={extendedMuiProps}>\n      <CustomOptionContainer odysseyDesignTokens={odysseyDesignTokens}>\n        <CustomOptionLeftContainer odysseyDesignTokens={odysseyDesignTokens}>\n          <OptionAdornment\n            adornment={adornment}\n            adornmentSize={adornmentSize}\n            odysseyDesignTokens={odysseyDesignTokens}\n          />\n          <div>\n            <OptionLabelContainer odysseyDesignTokens={odysseyDesignTokens}>\n              <Heading6 component=\"p\">{label}</Heading6>\n              <OptionDescriptionComponent\n                description={description}\n                odysseyDesignTokens={odysseyDesignTokens}\n              />\n            </OptionLabelContainer>\n            {metaData && (\n              <OptionMetadataComponent\n                metaData={metaData}\n                odysseyDesignTokens={odysseyDesignTokens}\n              />\n            )}\n          </div>\n        </CustomOptionLeftContainer>\n        {extra && (\n          <Extra\n            content={extra.content}\n            size={extra.size || adornmentSize}\n            onClick={extra.onClick}\n            odysseyDesignTokens={odysseyDesignTokens}\n          />\n        )}\n      </CustomOptionContainer>\n    </Option>\n  );\n};\n\nexport type SearchDropdownProps<\n  OptionType extends CustomOptionType,\n  HasMultipleChoices extends boolean | undefined,\n  IsCustomValueAllowed extends boolean | undefined,\n> = BasePickerProps<OptionType, HasMultipleChoices, IsCustomValueAllowed> & {\n  adornmentSize?: AdornmentSize;\n};\n\ntype PickerWithOptionAdornmentComponentType = {\n  <\n    OptionType extends CustomOptionType,\n    HasMultipleChoices extends boolean | undefined,\n    IsCustomValueAllowed extends boolean | undefined,\n  >(\n    props: SearchDropdownProps<\n      OptionType,\n      HasMultipleChoices,\n      IsCustomValueAllowed\n    >,\n  ): ReactElement;\n  <\n    OptionType extends CustomOptionType,\n    HasMultipleChoices extends boolean | undefined,\n    IsCustomValueAllowed extends boolean | undefined,\n  >(\n    props: SearchDropdownProps<\n      OptionType,\n      HasMultipleChoices,\n      IsCustomValueAllowed\n    >,\n  ): ReactElement;\n};\n\nconst SearchDropdown: PickerWithOptionAdornmentComponentType = <\n  OptionType extends CustomOptionType,\n  HasMultipleChoices extends boolean | undefined,\n  IsCustomValueAllowed extends boolean | undefined,\n>({\n  adornmentSize = \"small\",\n  ariaDescribedBy,\n  defaultValue,\n  errorMessage,\n  errorMessageList,\n  getIsOptionEqualToValue,\n  groupOptionsBy,\n  id: idOverride,\n  inputValue,\n  isCustomValueAllowed,\n  isDisabled,\n  isFullWidth = false,\n  isLoading,\n  isOptional = false,\n  isReadOnly,\n  isVirtualized: isVirtualizedProp = false,\n  hint,\n  HintLinkComponent,\n  label,\n  name: nameOverride,\n  onBlur,\n  onChange: onChangeProp,\n  onInputChange: onInputChangeProp,\n  onFocus,\n  options,\n  value,\n  testId,\n  translate,\n}: SearchDropdownProps<\n  OptionType,\n  HasMultipleChoices,\n  IsCustomValueAllowed\n>) => {\n  const odysseyDesignTokens = useOdysseyDesignTokens();\n\n  const customOptionRender = useCallback<\n    (props: HTMLAttributes<HTMLLIElement>, option: OptionType) => ReactNode\n  >(\n    (muiProps, option) => {\n      return (\n        <CustomOption\n          adornmentSize={adornmentSize}\n          muiProps={muiProps}\n          odysseyDesignTokens={odysseyDesignTokens}\n          option={option}\n        />\n      );\n    },\n    [adornmentSize, odysseyDesignTokens],\n  );\n\n  return (\n    <ComposablePicker<OptionType, HasMultipleChoices, IsCustomValueAllowed>\n      ariaDescribedBy={ariaDescribedBy}\n      defaultValue={defaultValue}\n      errorMessage={errorMessage}\n      errorMessageList={errorMessageList}\n      getIsOptionEqualToValue={getIsOptionEqualToValue}\n      groupOptionsBy={groupOptionsBy}\n      id={idOverride}\n      inputValue={inputValue}\n      isCustomValueAllowed={isCustomValueAllowed}\n      isDisabled={isDisabled}\n      isFullWidth={isFullWidth}\n      isLoading={isLoading}\n      isOptional={isOptional}\n      isReadOnly={isReadOnly}\n      isVirtualized={isVirtualizedProp}\n      hint={hint}\n      HintLinkComponent={HintLinkComponent}\n      label={label}\n      name={nameOverride}\n      onBlur={onBlur}\n      onChange={onChangeProp}\n      onInputChange={onInputChangeProp}\n      onFocus={onFocus}\n      options={options}\n      renderOption={customOptionRender}\n      value={value}\n      testId={testId}\n      translate={translate}\n    />\n  );\n};\n\n// Need the `as BasePickerType` because generics don't get passed through\nconst MemoizedSearchDropdown = memo(SearchDropdown) as BasePickerType;\n\nMemoizedSearchDropdown.displayName = \"MemoizedSearchDropdown\";\n\nexport { MemoizedSearchDropdown as SearchDropdown };\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/labs/OdysseyPickers/index.js

@@ -13,4 +13,5 @@
 export { adornmentSizeValues } from "./ComposablePicker.js";
 export * from "./Picker.js";
 export * from "./PickerWithOptionAdornment.js";
+export { SearchDropdown } from "./SearchDropdown.js";
 //# sourceMappingURL=index.js.map

package/dist/esm/labs/OdysseyPickers/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["adornmentSizeValues"],"sources":["../../../../src/labs/OdysseyPickers/index.ts"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nexport { adornmentSizeValues } from \"./ComposablePicker.js\";\nexport * from \"./Picker.js\";\nexport * from \"./PickerWithOptionAdornment.js\";\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,mBAAmB,QAAQ,uBAAuB;AAC3D,cAAc,aAAa;AAC3B,cAAc,gCAAgC","ignoreList":[]}
+{"version":3,"file":"index.js","names":["adornmentSizeValues","SearchDropdown"],"sources":["../../../../src/labs/OdysseyPickers/index.ts"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nexport { adornmentSizeValues } from \"./ComposablePicker.js\";\nexport * from \"./Picker.js\";\nexport * from \"./PickerWithOptionAdornment.js\";\nexport { SearchDropdown } from \"./SearchDropdown.js\";\nexport type {\n  SearchDropdownProps,\n  CustomOptionType,\n} from \"./SearchDropdown.js\";\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,mBAAmB,QAAQ,uBAAuB;AAC3D,cAAc,aAAa;AAC3B,cAAc,gCAAgC;AAC9C,SAASC,cAAc,QAAQ,qBAAqB","ignoreList":[]}

package/dist/esm/theme/StringWithValue.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=StringWithValue.js.map

package/dist/esm/theme/StringWithValue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StringWithValue.js","names":[],"sources":["../../../src/theme/StringWithValue.ts"],"sourcesContent":["/*!\n * Copyright (c) 2025-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nexport type StringWithValue<T extends string> = T extends \"\" ? never : T;\n"],"mappings":"","ignoreList":[]}