diff --git a/CHANGELOG.md b/CHANGELOG.md index 4f72b1a5f..636c5d753 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -3,6 +3,20 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.10.0](https://github.com/washingtonpost/wpds-ui-kit/compare/v2.9.0...v2.10.0) (2024-12-11) + +### Bug Fixes + +- allow controlled InputSearch to be cleared by passing empty string ([f874afd](https://github.com/washingtonpost/wpds-ui-kit/commit/f874afd58dba13d242e2d38330b4d7ffe6d0ef5a)) +- allow props on InputSearch ListItem to pass through for custom styling ([07b7bdc](https://github.com/washingtonpost/wpds-ui-kit/commit/07b7bdc23eb7e05d1e80465bfba1fc2189d6f70b)) +- honor disabled prop in InputSearch list item ([62f88ec](https://github.com/washingtonpost/wpds-ui-kit/commit/62f88ecfd087f02e5373b89c36a59a367c9536bc)) +- include onSelect callback in InputSelect selected documentation example ([f4697d5](https://github.com/washingtonpost/wpds-ui-kit/commit/f4697d5087f37cdfb93f462295bb4531fb347fe3)) +- safely escape strings passed to RegExp in InputSearch ([66fc814](https://github.com/washingtonpost/wpds-ui-kit/commit/66fc8143dc4c43aa555b718b507c50f017b90b44)) + +### Features + +- update wpds-assets ([#676](https://github.com/washingtonpost/wpds-ui-kit/issues/676)) ([0cb0ae6](https://github.com/washingtonpost/wpds-ui-kit/commit/0cb0ae65bcc9faac805f5ec295a6fe3548636278)) + # [2.9.0](https://github.com/washingtonpost/wpds-ui-kit/compare/v2.8.1...v2.9.0) (2024-12-09) ### Bug Fixes diff --git a/apps/nextjs13-approuter/CHANGELOG.md b/apps/nextjs13-approuter/CHANGELOG.md index bb8cf3f2b..f59eb0816 100644 --- a/apps/nextjs13-approuter/CHANGELOG.md +++ b/apps/nextjs13-approuter/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.10.0](https://github.com/washingtonpost/wpds-ui-kit/compare/v2.9.0...v2.10.0) (2024-12-11) + +**Note:** Version bump only for package nextjs13-approuter + # [2.9.0](https://github.com/washingtonpost/wpds-ui-kit/compare/v2.8.1...v2.9.0) (2024-12-09) **Note:** Version bump only for package nextjs13-approuter diff --git a/apps/nextjs13-approuter/package.json b/apps/nextjs13-approuter/package.json index d24ece270..268f39c1f 100644 --- a/apps/nextjs13-approuter/package.json +++ b/apps/nextjs13-approuter/package.json @@ -1,6 +1,6 @@ { "name": "nextjs13-approuter", - "version": "2.9.0", + "version": "2.10.0", "private": true, "scripts": { "dev": "next dev", @@ -9,8 +9,8 @@ "lint": "next lint" }, "dependencies": { - "@washingtonpost/wpds-kitchen-sink": "2.9.0", - "@washingtonpost/wpds-ui-kit": "2.9.0", + "@washingtonpost/wpds-kitchen-sink": "2.10.0", + "@washingtonpost/wpds-ui-kit": "2.10.0", "next": "13.5.6", "react": "^18.2.0", "react-dom": "^18.2.0" diff --git a/apps/nextjs13-pagerouter/CHANGELOG.md b/apps/nextjs13-pagerouter/CHANGELOG.md index 1e33d2d01..d5815f8b8 100644 --- a/apps/nextjs13-pagerouter/CHANGELOG.md +++ b/apps/nextjs13-pagerouter/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.10.0](https://github.com/washingtonpost/wpds-ui-kit/compare/v2.9.0...v2.10.0) (2024-12-11) + +**Note:** Version bump only for package nextjs13-pagerouter + # [2.9.0](https://github.com/washingtonpost/wpds-ui-kit/compare/v2.8.1...v2.9.0) (2024-12-09) **Note:** Version bump only for package nextjs13-pagerouter diff --git a/apps/nextjs13-pagerouter/package.json b/apps/nextjs13-pagerouter/package.json index 252d279df..6c8e2d870 100644 --- a/apps/nextjs13-pagerouter/package.json +++ b/apps/nextjs13-pagerouter/package.json @@ -1,6 +1,6 @@ { "name": "nextjs13-pagerouter", - "version": "2.9.0", + "version": "2.10.0", "private": true, "scripts": { "dev": "next dev", @@ -9,8 +9,8 @@ "lint": "next lint" }, "dependencies": { - "@washingtonpost/wpds-kitchen-sink": "2.9.0", - "@washingtonpost/wpds-ui-kit": "2.9.0", + "@washingtonpost/wpds-kitchen-sink": "2.10.0", + "@washingtonpost/wpds-ui-kit": "2.10.0", "next": "13.5.6", "react": "^18.2.0", "react-dom": "^18.2.0" diff --git a/apps/nextjs14-approuter/CHANGELOG.md b/apps/nextjs14-approuter/CHANGELOG.md index e46716ac4..111435c9d 100644 --- a/apps/nextjs14-approuter/CHANGELOG.md +++ b/apps/nextjs14-approuter/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.10.0](https://github.com/washingtonpost/wpds-ui-kit/compare/v2.9.0...v2.10.0) (2024-12-11) + +**Note:** Version bump only for package nextjs14-approuter + # [2.9.0](https://github.com/washingtonpost/wpds-ui-kit/compare/v2.8.1...v2.9.0) (2024-12-09) **Note:** Version bump only for package nextjs14-approuter diff --git a/apps/nextjs14-approuter/package.json b/apps/nextjs14-approuter/package.json index 332fa01d7..ca1c5b219 100644 --- a/apps/nextjs14-approuter/package.json +++ b/apps/nextjs14-approuter/package.json @@ -1,6 +1,6 @@ { "name": "nextjs14-approuter", - "version": "2.9.0", + "version": "2.10.0", "private": true, "scripts": { "dev": "next dev", @@ -9,8 +9,8 @@ "lint": "next lint" }, "dependencies": { - "@washingtonpost/wpds-kitchen-sink": "2.9.0", - "@washingtonpost/wpds-ui-kit": "2.9.0", + "@washingtonpost/wpds-kitchen-sink": "2.10.0", + "@washingtonpost/wpds-ui-kit": "2.10.0", "next": "14.0.3", "react": "^18.2.0", "react-dom": "^18.2.0" diff --git a/apps/nextjs14-pagerouter/CHANGELOG.md b/apps/nextjs14-pagerouter/CHANGELOG.md index 49b90107e..022feaddd 100644 --- a/apps/nextjs14-pagerouter/CHANGELOG.md +++ b/apps/nextjs14-pagerouter/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.10.0](https://github.com/washingtonpost/wpds-ui-kit/compare/v2.9.0...v2.10.0) (2024-12-11) + +**Note:** Version bump only for package nextjs14-pagerouter + # [2.9.0](https://github.com/washingtonpost/wpds-ui-kit/compare/v2.8.1...v2.9.0) (2024-12-09) **Note:** Version bump only for package nextjs14-pagerouter diff --git a/apps/nextjs14-pagerouter/package.json b/apps/nextjs14-pagerouter/package.json index fa18c30e4..af67956c0 100644 --- a/apps/nextjs14-pagerouter/package.json +++ b/apps/nextjs14-pagerouter/package.json @@ -1,6 +1,6 @@ { "name": "nextjs14-pagerouter", - "version": "2.9.0", + "version": "2.10.0", "private": true, "scripts": { "dev": "next dev", @@ -9,8 +9,8 @@ "lint": "next lint" }, "dependencies": { - "@washingtonpost/wpds-kitchen-sink": "2.9.0", - "@washingtonpost/wpds-ui-kit": "2.9.0", + "@washingtonpost/wpds-kitchen-sink": "2.10.0", + "@washingtonpost/wpds-ui-kit": "2.10.0", "next": "14.0.3", "react": "^18.2.0", "react-dom": "^18.2.0" diff --git a/build.washingtonpost.com/CHANGELOG.md b/build.washingtonpost.com/CHANGELOG.md index 9a700b2f8..b41d00d77 100644 --- a/build.washingtonpost.com/CHANGELOG.md +++ b/build.washingtonpost.com/CHANGELOG.md @@ -3,6 +3,16 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.10.0](https://github.com/washingtonpost/wpds-docs/compare/v2.9.0...v2.10.0) (2024-12-11) + +### Bug Fixes + +- include onSelect callback in InputSelect selected documentation example ([f4697d5](https://github.com/washingtonpost/wpds-docs/commit/f4697d5087f37cdfb93f462295bb4531fb347fe3)) + +### Features + +- update wpds-assets ([#676](https://github.com/washingtonpost/wpds-docs/issues/676)) ([0cb0ae6](https://github.com/washingtonpost/wpds-docs/commit/0cb0ae65bcc9faac805f5ec295a6fe3548636278)) + # [2.9.0](https://github.com/washingtonpost/wpds-docs/compare/v2.8.1...v2.9.0) (2024-12-09) ### Bug Fixes diff --git a/build.washingtonpost.com/docs/components/input-search.mdx b/build.washingtonpost.com/docs/components/input-search.mdx index 59ce89e3c..cd611441b 100644 --- a/build.washingtonpost.com/docs/components/input-search.mdx +++ b/build.washingtonpost.com/docs/components/input-search.mdx @@ -563,9 +563,18 @@ export default function Example() { const [term, setTerm] = useState(""); const results = searchCities(term); + const [selected, setSelected] = useState(""); + return ( - + + Selected value: {selected} + + setSelected(value)} + > { const componentsLookUptable = getNavigation().then((nav) => { const [foundations, components, resources] = nav; - const { - docs - } = components; + const { docs } = components; let componentList = docs.map((component) => { return component.slug.replace("/components/", ""); }); return componentList; - }); + }); const slug = componentsLookUptable[params.slug]; diff --git a/build.washingtonpost.com/pages/resources/[category]/[slug].js b/build.washingtonpost.com/pages/resources/[category]/[slug].js index 0503da60b..794f29d02 100644 --- a/build.washingtonpost.com/pages/resources/[category]/[slug].js +++ b/build.washingtonpost.com/pages/resources/[category]/[slug].js @@ -3,11 +3,7 @@ import { MDXRemote } from "next-mdx-remote"; import { NextSeo } from "~/components/next-seo"; import MDXStyling from "~/components/Markdown/Styling"; import Header from "~/components/Typography/Headers"; -import { - getNavigation, - getResource, - getHeadings, -} from "~/services"; +import { getNavigation, getResource, getHeadings } from "~/services"; import Breadcrumbs from "~/components/Breadcrumbs"; import TableofContents from "~/components/Markdown/Components/tableofcontents"; import { Box } from "@washingtonpost/wpds-ui-kit"; diff --git a/lerna.json b/lerna.json index cee53b20c..12e285cc1 100644 --- a/lerna.json +++ b/lerna.json @@ -28,5 +28,5 @@ "registry": "https://registry.npmjs.org/" } }, - "version": "2.9.0" + "version": "2.10.0" } diff --git a/package-lock.json b/package-lock.json index 2e24194c5..2c17fffa1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -115,10 +115,10 @@ } }, "apps/nextjs13-approuter": { - "version": "2.9.0", + "version": "2.10.0", "dependencies": { - "@washingtonpost/wpds-kitchen-sink": "2.9.0", - "@washingtonpost/wpds-ui-kit": "2.9.0", + "@washingtonpost/wpds-kitchen-sink": "2.10.0", + "@washingtonpost/wpds-ui-kit": "2.10.0", "next": "13.5.6", "react": "^18.2.0", "react-dom": "^18.2.0" @@ -199,10 +199,10 @@ } }, "apps/nextjs13-pagerouter": { - "version": "2.9.0", + "version": "2.10.0", "dependencies": { - "@washingtonpost/wpds-kitchen-sink": "2.9.0", - "@washingtonpost/wpds-ui-kit": "2.9.0", + "@washingtonpost/wpds-kitchen-sink": "2.10.0", + "@washingtonpost/wpds-ui-kit": "2.10.0", "next": "13.5.6", "react": "^18.2.0", "react-dom": "^18.2.0" @@ -283,20 +283,20 @@ } }, "apps/nextjs14-approuter": { - "version": "2.9.0", + "version": "2.10.0", "dependencies": { - "@washingtonpost/wpds-kitchen-sink": "2.9.0", - "@washingtonpost/wpds-ui-kit": "2.9.0", + "@washingtonpost/wpds-kitchen-sink": "2.10.0", + "@washingtonpost/wpds-ui-kit": "2.10.0", "next": "14.0.3", "react": "^18.2.0", "react-dom": "^18.2.0" } }, "apps/nextjs14-pagerouter": { - "version": "2.9.0", + "version": "2.10.0", "dependencies": { - "@washingtonpost/wpds-kitchen-sink": "2.9.0", - "@washingtonpost/wpds-ui-kit": "2.9.0", + "@washingtonpost/wpds-kitchen-sink": "2.10.0", + "@washingtonpost/wpds-ui-kit": "2.10.0", "next": "14.0.3", "react": "^18.2.0", "react-dom": "^18.2.0" @@ -310,7 +310,7 @@ }, "build.washingtonpost.com": { "name": "@washingtonpost/wpds-docs", - "version": "2.9.0", + "version": "2.10.0", "hasInstallScript": true, "dependencies": { "@babel/standalone": "^7.17.11", @@ -38803,10 +38803,10 @@ }, "packages/eslint-plugin": { "name": "@washingtonpost/eslint-plugin-wpds", - "version": "2.9.0", + "version": "2.10.0", "license": "MIT", "dependencies": { - "@washingtonpost/wpds-ui-kit": "2.9.0" + "@washingtonpost/wpds-ui-kit": "2.10.0" }, "devDependencies": { "jest": "^28.1.0" @@ -39784,7 +39784,7 @@ }, "packages/kit": { "name": "@washingtonpost/wpds-ui-kit", - "version": "2.9.0", + "version": "2.10.0", "license": "MIT", "dependencies": { "@popperjs/core": "^2.11.6", @@ -39852,11 +39852,11 @@ }, "packages/kitchen-sink": { "name": "@washingtonpost/wpds-kitchen-sink", - "version": "2.9.0", + "version": "2.10.0", "license": "MIT", "dependencies": { "@washingtonpost/wpds-assets": "^2.9.0", - "@washingtonpost/wpds-ui-kit": "2.9.0", + "@washingtonpost/wpds-ui-kit": "2.10.0", "nanoid": "^3.3.4" }, "devDependencies": { @@ -39871,10 +39871,10 @@ }, "packages/tailwind-theme": { "name": "@washingtonpost/wpds-tailwind-theme", - "version": "2.9.0", + "version": "2.10.0", "license": "MIT", "dependencies": { - "@washingtonpost/wpds-ui-kit": "2.9.0" + "@washingtonpost/wpds-ui-kit": "2.10.0" }, "devDependencies": { "autoprefixer": "^10.4.14", @@ -39888,11 +39888,11 @@ }, "packages/tokens": { "name": "@washingtonpost/wpds-tokens", - "version": "2.9.0", + "version": "2.10.0", "license": "MIT", "devDependencies": { "@washingtonpost/wpds-assets": "^2.9.0", - "@washingtonpost/wpds-ui-kit": "2.9.0", + "@washingtonpost/wpds-ui-kit": "2.10.0", "react": "^18.2.0", "react-dom": "^18.2.0" } diff --git a/packages/eslint-plugin/CHANGELOG.md b/packages/eslint-plugin/CHANGELOG.md index 273b970a4..d47c50e4e 100644 --- a/packages/eslint-plugin/CHANGELOG.md +++ b/packages/eslint-plugin/CHANGELOG.md @@ -3,6 +3,12 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.10.0](https://github.com/washingtonpost/wpds-ui-kit/compare/v2.9.0...v2.10.0) (2024-12-11) + +### Features + +- update wpds-assets ([#676](https://github.com/washingtonpost/wpds-ui-kit/issues/676)) ([0cb0ae6](https://github.com/washingtonpost/wpds-ui-kit/commit/0cb0ae65bcc9faac805f5ec295a6fe3548636278)) + # [2.9.0](https://github.com/washingtonpost/wpds-ui-kit/compare/v2.8.1...v2.9.0) (2024-12-09) **Note:** Version bump only for package @washingtonpost/eslint-plugin-wpds diff --git a/packages/eslint-plugin/package.json b/packages/eslint-plugin/package.json index 467fa202b..ca9614b43 100644 --- a/packages/eslint-plugin/package.json +++ b/packages/eslint-plugin/package.json @@ -1,6 +1,6 @@ { "name": "@washingtonpost/eslint-plugin-wpds", - "version": "2.9.0", + "version": "2.10.0", "description": "WPDS lint rules", "author": "WPDS Support ", "homepage": "https://github.com/washingtonpost/wpds-ui-kit#readme", @@ -28,10 +28,10 @@ "@washingtonpost/wpds-ui-kit": "2.9.0" }, "dependencies": { - "@washingtonpost/wpds-ui-kit": "2.9.0" + "@washingtonpost/wpds-ui-kit": "2.10.0" }, "devDependencies": { "jest": "^28.1.0" }, - "gitHead": "a51790c76489c2b2a24ccd29eb8addb83ce29d8e" + "gitHead": "8690322aa8bd22e196ac46a18563253f1dfbe994" } diff --git a/packages/kit/CHANGELOG.md b/packages/kit/CHANGELOG.md index 16624443b..0cbd4220f 100644 --- a/packages/kit/CHANGELOG.md +++ b/packages/kit/CHANGELOG.md @@ -3,6 +3,19 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.10.0](https://github.com/washingtonpost/wpds-ui-kit/compare/v2.9.0...v2.10.0) (2024-12-11) + +### Bug Fixes + +- allow controlled InputSearch to be cleared by passing empty string ([f874afd](https://github.com/washingtonpost/wpds-ui-kit/commit/f874afd58dba13d242e2d38330b4d7ffe6d0ef5a)) +- allow props on InputSearch ListItem to pass through for custom styling ([07b7bdc](https://github.com/washingtonpost/wpds-ui-kit/commit/07b7bdc23eb7e05d1e80465bfba1fc2189d6f70b)) +- honor disabled prop in InputSearch list item ([62f88ec](https://github.com/washingtonpost/wpds-ui-kit/commit/62f88ecfd087f02e5373b89c36a59a367c9536bc)) +- safely escape strings passed to RegExp in InputSearch ([66fc814](https://github.com/washingtonpost/wpds-ui-kit/commit/66fc8143dc4c43aa555b718b507c50f017b90b44)) + +### Features + +- update wpds-assets ([#676](https://github.com/washingtonpost/wpds-ui-kit/issues/676)) ([0cb0ae6](https://github.com/washingtonpost/wpds-ui-kit/commit/0cb0ae65bcc9faac805f5ec295a6fe3548636278)) + # [2.9.0](https://github.com/washingtonpost/wpds-ui-kit/compare/v2.8.1...v2.9.0) (2024-12-09) ### Features diff --git a/packages/kit/package.json b/packages/kit/package.json index 2670989b8..e285da991 100644 --- a/packages/kit/package.json +++ b/packages/kit/package.json @@ -1,6 +1,6 @@ { "name": "@washingtonpost/wpds-ui-kit", - "version": "2.9.0", + "version": "2.10.0", "description": "WPDS UI Kit", "author": "WPDS Support ", "homepage": "https://github.com/washingtonpost/wpds-ui-kit#readme", @@ -93,5 +93,5 @@ "./src/input-search/cities": "./src/input-search/cities.ts", "./src/theme/hexcodes.tokens.json": "./src/theme/hexcodes.tokens.json" }, - "gitHead": "a51790c76489c2b2a24ccd29eb8addb83ce29d8e" + "gitHead": "8690322aa8bd22e196ac46a18563253f1dfbe994" } diff --git a/packages/kit/src/input-search/InputSearchInput.tsx b/packages/kit/src/input-search/InputSearchInput.tsx index 97edc5e4e..0c8c9de10 100644 --- a/packages/kit/src/input-search/InputSearchInput.tsx +++ b/packages/kit/src/input-search/InputSearchInput.tsx @@ -62,13 +62,26 @@ export const InputSearchInput = React.forwardRef< } }, [state.selectionManager.focusedKey, setTempText]); - if (value) { + if (value !== undefined && value !== null) { inputProps.value = value; } + if (autocomplete && withKeyboard.current) { inputProps.value = tempText; } + const [, setRerender] = React.useState(false); + if (!inputProps.value && inputRef.current) { + const el = inputRef.current as HTMLInputElement; + if (el.value) { + // if a controlled input is passed an empty value, + // an extra render is needed to reset the input's internal state + requestAnimationFrame(() => { + setRerender((prev) => !prev); + }); + } + } + const handleKeyDown = (event: React.KeyboardEvent) => { if (event.key === "ArrowDown" || event.key === "ArrowUp") { withKeyboard.current = true; diff --git a/packages/kit/src/input-search/InputSearchListItem.tsx b/packages/kit/src/input-search/InputSearchListItem.tsx index 841a28139..9eec0f227 100644 --- a/packages/kit/src/input-search/InputSearchListItem.tsx +++ b/packages/kit/src/input-search/InputSearchListItem.tsx @@ -2,6 +2,7 @@ import React from "react"; import { Item } from "react-stately"; import { useOption } from "react-aria"; import { styled, theme } from "../theme"; +import { InputSearchContext } from "./InputSearchRoot"; import type { Node, ListState, ComboBoxState } from "react-stately"; @@ -75,6 +76,24 @@ interface ListItemProps { } export const ListItem = ({ item, state }: ListItemProps) => { + // eslint-disable-next-line @typescript-eslint/no-unused-vars + const { children, textValue, disabled, ...itemProps } = item.props; + + const { setDisabledKeys } = React.useContext(InputSearchContext); + React.useEffect(() => { + if (disabled && !state.disabledKeys.has(item.key)) { + setDisabledKeys((prev) => { + if (prev) { + const next = new Set(prev); + next.add(item.key); + return next; + } else { + return new Set([item.key]); + } + }); + } + }, [disabled, setDisabledKeys, state.disabledKeys]); + const ref = React.useRef(null); const { optionProps, isDisabled, isSelected, isFocused } = useOption( { @@ -85,15 +104,21 @@ export const ListItem = ({ item, state }: ListItemProps) => { ); let highlighted; + + const escape = (string) => { + return string.replace(/[.*+\-?^${}()|[\]\\]/g, "\\$&"); + }; + if (typeof item.rendered === "string") { - highlighted = item.rendered.replace( - new RegExp((state as ComboBoxState).inputValue, "gi"), - (match) => (match ? `${match}` : "") + const val = escape((state as ComboBoxState).inputValue); + highlighted = item.rendered.replace(new RegExp(val, "gi"), (match) => + match ? `${match}` : "" ); } return ( | undefined> >; + setDisabledKeys: React.Dispatch< + React.SetStateAction | undefined> + >; isDisabled?: boolean; setUsePortal: React.Dispatch>; setPortalDomNode: React.Dispatch>; @@ -76,9 +79,11 @@ export const InputSearchRoot = ({ }: InputSearchRootProps) => { const [collectionChildren, setCollectionChildren] = React.useState>(); + const [disabledKeys, setDisabledKeys] = React.useState>(); const state = useComboBoxState({ children: collectionChildren, + disabledKeys, allowsCustomValue: true, allowsEmptyCollection: true, menuTrigger: openOnFocus ? "focus" : "input", @@ -132,6 +137,7 @@ export const InputSearchRoot = ({ inputProps, listBoxProps, setCollectionChildren, + setDisabledKeys, setUsePortal, setPortalDomNode, isDisabled: disabled, diff --git a/packages/kit/src/input-search/play.stories.tsx b/packages/kit/src/input-search/play.stories.tsx index e808b50a8..9aaf01f08 100644 --- a/packages/kit/src/input-search/play.stories.tsx +++ b/packages/kit/src/input-search/play.stories.tsx @@ -192,15 +192,15 @@ export const Grouping = { }, }; -const ScrollTemplate: StoryFn = (args) => { +const DisabledTemplate: StoryFn = (args) => { return ( - + - + - + @@ -211,8 +211,8 @@ const ScrollTemplate: StoryFn = (args) => { ); }; -export const Scroll = { - render: ScrollTemplate, +export const Disabled = { + render: DisabledTemplate, args: {}, parameters: { @@ -220,26 +220,11 @@ export const Scroll = { }, }; -const ControlledTemplate: StoryFn = (args) => { - const [term, setTerm] = useState(""); +const ScrollTemplate: StoryFn = (args) => { return ( - - { - setTerm(value); - }} - > - { - setTerm(event.target.value); - }} - /> + + + @@ -254,6 +239,59 @@ const ControlledTemplate: StoryFn = (args) => { ); }; +export const Scroll = { + render: ScrollTemplate, + args: {}, + + parameters: { + chromatic: { disableSnapshot: true }, + }, +}; + +const ControlledTemplate: StoryFn = (args) => { + const [term, setTerm] = useState(""); + return ( + <> + +
+ + { + setTerm(value); + }} + > + { + setTerm(event.target.value); + }} + /> + + + + + + + + + + + + + ); +}; + export const Controlled = { render: ControlledTemplate, args: {}, @@ -298,7 +336,7 @@ export const ControlledKeyboardInteractions = { play: async () => { const input = await screen.findByLabelText("Search"); - await userEvent.type(input, "app", { + await userEvent.type(input, "test", { delay: 100, }); await userEvent.keyboard("[ArrowDown]"); @@ -310,5 +348,14 @@ export const ControlledKeyboardInteractions = { const clearButton = await screen.findByText("Clear"); await userEvent.click(clearButton); await expect(input).toHaveDisplayValue(""); + await userEvent.type(input, "test", { + delay: 100, + }); + await userEvent.keyboard("[ArrowDown]"); + await expect(input).toHaveDisplayValue("Apple"); + const externalClearButton = await screen.findByText("External Clear"); + await userEvent.click(externalClearButton); + await expect(input).toHaveDisplayValue(""); + // }, }; diff --git a/packages/kit/src/navigation-menu/NavigationMenuTrigger.tsx b/packages/kit/src/navigation-menu/NavigationMenuTrigger.tsx index a63568dee..a821766e7 100644 --- a/packages/kit/src/navigation-menu/NavigationMenuTrigger.tsx +++ b/packages/kit/src/navigation-menu/NavigationMenuTrigger.tsx @@ -19,6 +19,9 @@ const StyledNavigationMenuTrigger = styled(NavigationMenuPrimitive.Trigger, { fontSize: theme.fontSizes["100"], lineHeight: theme.lineHeights.meta, padding: theme.space["050"], + "&:disabled": { + color: "$onDisabled", + }, }); export type NavigationMenuTriggerProps = { diff --git a/packages/kit/src/navigation-menu/play.stories.tsx b/packages/kit/src/navigation-menu/play.stories.tsx index 5d69eeaca..1a1ef92c2 100644 --- a/packages/kit/src/navigation-menu/play.stories.tsx +++ b/packages/kit/src/navigation-menu/play.stories.tsx @@ -272,6 +272,62 @@ export const Vertical = { render: VerticalTemplate, }; +const DisabledTemplate: StoryFn = (args) => { + return ( + + + + + House + + + + + Governors + + + + + Results By State + &": { + transform: "rotate(-180deg)", + }, + }} + > + + + + + + + + Alabama + + + Alaska + + + Arizona + + + + + + + + ); +}; + +export const Disabled = { + render: DisabledTemplate, +}; + // eslint-disable-next-line @typescript-eslint/no-explicit-any const InteractionsTemplate: StoryFn = () => ( diff --git a/packages/kitchen-sink/CHANGELOG.md b/packages/kitchen-sink/CHANGELOG.md index f92f44ffd..07e05318a 100644 --- a/packages/kitchen-sink/CHANGELOG.md +++ b/packages/kitchen-sink/CHANGELOG.md @@ -3,6 +3,12 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.10.0](https://github.com/washingtonpost/wpds-ui-kit/compare/v2.9.0...v2.10.0) (2024-12-11) + +### Features + +- update wpds-assets ([#676](https://github.com/washingtonpost/wpds-ui-kit/issues/676)) ([0cb0ae6](https://github.com/washingtonpost/wpds-ui-kit/commit/0cb0ae65bcc9faac805f5ec295a6fe3548636278)) + # [2.9.0](https://github.com/washingtonpost/wpds-ui-kit/compare/v2.8.1...v2.9.0) (2024-12-09) **Note:** Version bump only for package @washingtonpost/wpds-kitchen-sink diff --git a/packages/kitchen-sink/package.json b/packages/kitchen-sink/package.json index 2f7ff5fb2..a78d0909b 100644 --- a/packages/kitchen-sink/package.json +++ b/packages/kitchen-sink/package.json @@ -1,6 +1,6 @@ { "name": "@washingtonpost/wpds-kitchen-sink", - "version": "2.9.0", + "version": "2.10.0", "description": "WPDS Kitchen Sink", "author": "WPDS Support ", "homepage": "https://github.com/washingtonpost/wpds-ui-kit#readme", @@ -42,8 +42,8 @@ }, "dependencies": { "@washingtonpost/wpds-assets": "^2.9.0", - "@washingtonpost/wpds-ui-kit": "2.9.0", + "@washingtonpost/wpds-ui-kit": "2.10.0", "nanoid": "^3.3.4" }, - "gitHead": "a51790c76489c2b2a24ccd29eb8addb83ce29d8e" + "gitHead": "8690322aa8bd22e196ac46a18563253f1dfbe994" } diff --git a/packages/tailwind-theme/CHANGELOG.md b/packages/tailwind-theme/CHANGELOG.md index 2601094f0..bf1f1688a 100644 --- a/packages/tailwind-theme/CHANGELOG.md +++ b/packages/tailwind-theme/CHANGELOG.md @@ -3,6 +3,12 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.10.0](https://github.com/washingtonpost/wpds-ui-kit/compare/v2.9.0...v2.10.0) (2024-12-11) + +### Features + +- update wpds-assets ([#676](https://github.com/washingtonpost/wpds-ui-kit/issues/676)) ([0cb0ae6](https://github.com/washingtonpost/wpds-ui-kit/commit/0cb0ae65bcc9faac805f5ec295a6fe3548636278)) + # [2.9.0](https://github.com/washingtonpost/wpds-ui-kit/compare/v2.8.1...v2.9.0) (2024-12-09) **Note:** Version bump only for package @washingtonpost/wpds-tailwind-theme diff --git a/packages/tailwind-theme/package.json b/packages/tailwind-theme/package.json index 3b5aeedfa..cdc635ab7 100644 --- a/packages/tailwind-theme/package.json +++ b/packages/tailwind-theme/package.json @@ -1,6 +1,6 @@ { "name": "@washingtonpost/wpds-tailwind-theme", - "version": "2.9.0", + "version": "2.10.0", "description": "WPDS Tailwind Theme", "author": "WPDS Support ", "license": "MIT", @@ -20,7 +20,7 @@ "@washingtonpost/wpds-ui-kit": "2.9.0" }, "dependencies": { - "@washingtonpost/wpds-ui-kit": "2.9.0" + "@washingtonpost/wpds-ui-kit": "2.10.0" }, "devDependencies": { "autoprefixer": "^10.4.14", @@ -28,5 +28,5 @@ "tailwindcss": "^3.3.2", "vite": "^4.3.9" }, - "gitHead": "a51790c76489c2b2a24ccd29eb8addb83ce29d8e" + "gitHead": "8690322aa8bd22e196ac46a18563253f1dfbe994" } diff --git a/packages/tokens/CHANGELOG.md b/packages/tokens/CHANGELOG.md index 73bc3bafc..4d41e341f 100644 --- a/packages/tokens/CHANGELOG.md +++ b/packages/tokens/CHANGELOG.md @@ -3,6 +3,12 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.10.0](https://github.com/washingtonpost/wpds-ui-kit/compare/v2.9.0...v2.10.0) (2024-12-11) + +### Features + +- update wpds-assets ([#676](https://github.com/washingtonpost/wpds-ui-kit/issues/676)) ([0cb0ae6](https://github.com/washingtonpost/wpds-ui-kit/commit/0cb0ae65bcc9faac805f5ec295a6fe3548636278)) + # [2.9.0](https://github.com/washingtonpost/wpds-ui-kit/compare/v2.8.1...v2.9.0) (2024-12-09) **Note:** Version bump only for package @washingtonpost/wpds-tokens diff --git a/packages/tokens/package.json b/packages/tokens/package.json index 79ed6563a..7a27aac23 100644 --- a/packages/tokens/package.json +++ b/packages/tokens/package.json @@ -1,6 +1,6 @@ { "name": "@washingtonpost/wpds-tokens", - "version": "2.9.0", + "version": "2.10.0", "description": "WPDS Tokens", "author": "WPDS Support ", "homepage": "https://github.com/washingtonpost/wpds-ui-kit#readme", @@ -27,9 +27,9 @@ "license": "MIT", "devDependencies": { "@washingtonpost/wpds-assets": "^2.9.0", - "@washingtonpost/wpds-ui-kit": "2.9.0", + "@washingtonpost/wpds-ui-kit": "2.10.0", "react": "^18.2.0", "react-dom": "^18.2.0" }, - "gitHead": "a51790c76489c2b2a24ccd29eb8addb83ce29d8e" + "gitHead": "8690322aa8bd22e196ac46a18563253f1dfbe994" }