chore(ui-components): add README (#8356)

* chore(ui-components): add README

* Apply suggestion from @Copilot

Co-authored-by: Copilot <[email protected]>
Signed-off-by: Brian Muenzenmeyer <[email protected]>

---------

Signed-off-by: Brian Muenzenmeyer <[email protected]>
Co-authored-by: Brian Muenzenmeyer <[email protected]>
Co-authored-by: Copilot <[email protected]>

Author: 3 people

packages/ui-components/README.md

@@ -0,0 +1,10 @@
+# Node.js UI Components
+
+This package is comprised of UI components for use in the Node.js website, documentation,
+and other aspects of the project.
+
+The components are based on [this design file](https://www.figma.com/design/a10cjjw3MzvRQMPT9FP3xz/Node.js).
+
+Most components in this package are available on [Chromatic](https://www.chromatic.com/library?appId=64c7d71358830e9105808652).
+
+For additional details regarding specific components, refer to the [nodejs/nodejs.org](https://github.com/nodejs/nodejs.org) repository.

packages/ui-components/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@node-core/ui-components",
-  "version": "1.3.0",
+  "version": "1.4.0",
   "type": "module",
   "exports": {
     "./*": [

packages/ui-components/scripts/publish.mjs

@@ -1,5 +1,5 @@
 import { spawnSync } from 'node:child_process';
-import { writeFile } from 'node:fs/promises';
+import { writeFile, copyFile } from 'node:fs/promises';
 
 import pkg from '../package.json' with { type: 'json' };
 
@@ -17,6 +17,8 @@ await writeFile(
   'utf8'
 );
 
+await copyFile('README.md', 'dist/README.md');
+
 // Now, publish the generated `dist` folder
 const { status, error } = spawnSync('pnpm', ['publish', '--no-git-checks'], {
   cwd: 'dist',

packages/ui-components/src/Common/Search/README.md

@@ -0,0 +1,23 @@
+# Orama Search Components
+
+This directory contains components for creating a Node.js-styled Orama Search Box.
+
+A search modal is constructed using the following format, but additional components can also be used.
+
+```jsx
+<SearchModal client={myOramaClient} placeholder={'Search for something...'}>
+  <SearchResults
+    noResultsTitle={'No results found for'}
+    onHit={hit => <MySearchItemComponent hit={hit} />}
+  >
+    {/* If you want to include search suggestions, there's a SearchSuggestions
+    component */}
+    <SearchSuggestions
+      suggestions={['You should search this', 'or this']}
+      label={'Suggestions'}
+    />
+  </SearchResults>
+</SearchModal>
+```
+
+(For this example, `myOramaClient` and `MySearchItemComponent` refer to the Orama client, and search item component, respectively. These variables **are not** included in @node-core/ui-components at this time)