SaaSquatch Search Package

packages/search-package/.gitignore

@@ -0,0 +1,2 @@
+dist/
+.out/

packages/search-package/.storybook/main.js

@@ -0,0 +1,39 @@
+module.exports = {
+  stories: ["../src/components/**/*.stories.@(js|jsx|ts|tsx|mdx)"],
+  addons: [
+    {
+      name: "@storybook/addon-docs",
+      options: {
+        configureJSX: true,
+        babelOptions: {},
+        sourceLoaderOptions: null,
+        transcludeMarkdown: true
+      }
+    }
+  ],
+  babel: async (options) => ({
+    ...options,
+
+    "plugins": [
+      "@babel/plugin-proposal-optional-chaining",
+      "@babel/plugin-transform-runtime",
+    ]
+  }),
+  webpackFinal: async (config) => {
+    config.module.rules[0].use[0].options.plugins[1] = [
+      '@babel/plugin-proposal-class-properties',
+      { loose: true }
+    ]
+
+    config.module.rules.push({
+      test: /\.(stories|story)\.[tj]sx?$/,
+      loader: require.resolve("@storybook/source-loader"),
+      exclude: [/node_modules/],
+      enforce: "pre"
+    });
+
+    config.resolve.extensions.push(".ts", ".tsx", ".mdx")
+
+    return config
+  }
+}

packages/search-package/.storybook/preview-head.html

@@ -0,0 +1 @@
+<link rel="stylesheet" href="https://i.icomoon.io/public/830a3260df/SaaSquatch/style.css">

packages/search-package/.storybook/preview.js

@@ -0,0 +1,24 @@
+import { DocsPage, DocsContainer } from "@storybook/addon-docs";
+import { GlobalStyle } from '@saasquatch/visual-dev';
+import React from "react";
+
+export const parameters = {
+  docs: {
+    container: DocsContainer,
+    page: DocsPage,
+  },
+  options: {
+    enableShortcuts: false,
+  },
+  viewMode: "docs",
+};
+
+const withGlobalStyles = (Story, context) => {
+  return (
+    <>
+      <GlobalStyle />
+      <Story {...context} />
+    </>
+  );
+};
+export const decorators = [withGlobalStyles];

packages/search-package/CHANGELOG.md

@@ -0,0 +1,65 @@
+# Changelog
+
+All notable changes to this project will be documented in this file.
+
+The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
+and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
+
+## [Unreleased]
+
+## [1.0.2] - 2022-08-02
+
+### Changed
+
+- Update global CSS variables to match new portal design system variables
+
+## [1.0.1] - 2022-07-21
+
+### Changed
+
+- Fix icons in safari by adding width to svg
+- Make Modal buttons more configurable
+- More SVG icon options added
+- Remove stopPropagation from select list to prevent conflict with Popper.js
+
+### Added
+
+## [1.0.0] - 2022-06-01
+
+### Added
+
+- New visual-dev components:
+  - \<Accordion>
+  - \<Alert>
+  - \<ArrayFieldTemplate>
+  - \<Avatar>
+  - \<Badge>
+  - \<Button>
+  - \<Card>
+  - \<Checkbox>
+  - \<Combobox>
+  - \<CopyWrapper>
+  - \<DataTable>
+  - \<Dropdown>
+  - \<ErrorListTemplate>
+  - \<FieldTemplate>
+  - \<Form>
+  - \<GlobalStyle>
+  - \<Input>
+  - \<List>
+  - \<Modal>
+  - \<ObjectFieldTemplate>
+  - \<Popover>
+  - \<Radio
+  - \<RadioAction>
+  - \<RadioCard>
+  - \<Select>
+  - \<Select2>
+  - \<Switch>
+  - \<Tabs>
+  - \<Tag>
+  - \<TextArea>
+  - \<Tooltip>
+
+[unreleased]: https://github.com/saasquatch/program-tools/compare/visual-dev%401.0.1...HEAD
+[1.0.1]: https://github.com/saasquatch/program-tools/releases/tag/%40saasquatch/visual-dev%401.0.1

packages/search-package/README.md

@@ -0,0 +1,26 @@
+# visual-dev
+
+Template repo for visual development for Saasquatch products.
+
+## Usage
+
+To install dependencies
+``` 
+$ npm install
+```
+
+To build
+```
+$ npm run build 
+```
+
+To run tests
+```
+$ npm run test
+```
+
+To run Storybook
+``` 
+$ npm run storybook
+```
+

packages/search-package/package.json

@@ -0,0 +1,84 @@
+{
+  "name": "@saasquatch/squatch-search",
+  "version": "0.1.0-16",
+  "description": "SaaSquatch search",
+  "main": "dist/index.js",
+  "module": "dist/visual-dev.esm.js",
+  "typings": "dist/index.d.ts",
+  "files": [
+    "dist",
+    "src"
+  ],
+  "scripts": {
+    "start": "tsdx watch",
+    "build": "tsdx build",
+    "test": "tsdx test --passWithNoTests",
+    "lint": "tsdx lint",
+    "storybook": "cross-env NODE_ENV=storybook start-storybook -p 9001 -c .storybook",
+    "storybook:build": "cross-env NODE_ENV=storybook build-storybook -c .storybook -o .out"
+  },
+  "keywords": [],
+  "author": "SaaSquatch Team",
+  "license": "MIT",
+  "dependencies": {
+    "@saasquatch/visual-dev": "^1.0.3-2",
+    "jquery": "^3.6.0",
+    "react-shadow": "^19.0.2",
+    "use-debounce": "^8.0.3"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.16.12",
+    "@rjsf/core": "^2.4.1",
+    "@storybook/addon-a11y": "^6.3.8",
+    "@storybook/addon-docs": "^6.3.8",
+    "@storybook/addon-knobs": "^6.3.1",
+    "@storybook/addon-viewport": "^6.3.8",
+    "@storybook/react": "^6.3.8",
+    "@testing-library/jest-dom": "^5.12.0",
+    "@testing-library/react": "^10.0.4",
+    "@types/jest": "^25.2.1",
+    "@types/json-schema": "^7.0.9",
+    "@types/marked": "^3.0.1",
+    "@types/react": "^16.14.6",
+    "@types/react-dom": "^16.9.12",
+    "@types/react-select": "^3.1.2",
+    "@types/styled-components": "^5.1.9",
+    "awesome-typescript-loader": "^5.2.1",
+    "babel-loader": "^8.2.2",
+    "cross-env": "^7.0.3",
+    "downshift": "^6.1.7",
+    "jest": "^25.5.1",
+    "marked": "^3.0.4",
+    "prettier-standard": "^16.3.0",
+    "react": "^16.13.1",
+    "react-dom": "^16.13.1",
+    "react-router-hash-link": "^1.2.2",
+    "storybook-addon-matrix": "^1.6.0",
+    "styled-components": "^5.3.0",
+    "ts-jest": "^25.5.1",
+    "ts-loader": "^7.0.3",
+    "tsdx": "^0.14.1",
+    "tslib": "^2.3.1",
+    "typescript": "^3.9.9"
+  },
+  "peerDependencies": {
+    "react": ">=16.8.0",
+    "react-dom": ">=16.8.0",
+    "styled-components": ">=5.3.0"
+  },
+  "jest": {
+    "preset": "ts-jest",
+    "testEnvironment": "jsdom",
+    "testPathIgnorePatterns": [
+      "dist/"
+    ]
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/saasquatch/program-tools.git"
+  },
+  "bugs": {
+    "url": "https://github.com/saasquatch/program-tools/issues"
+  },
+  "homepage": "https://github.com/saasquatch/program-tools#readme"
+}

packages/search-package/src/components/Search/Results.stories.tsx

@@ -0,0 +1,63 @@
+import React from "react";
+import { Results, ResultsProps } from "./Results";
+import { isBlank } from "./SearchFunctions";
+
+export default {
+  title: "Results",
+  component: Results,
+};
+
+const defaultProps: ResultsProps = {
+  response: {
+    title: "test",
+    items: [
+      {
+        cacheId: "test",
+        displayLink: "docs.saasquatch.com",
+        formattedUrl: "https://docs.saasquatch.com",
+        htmlFormattedUrl: "https://docs.saasquatch.com",
+        htmlSnippet: "Testing...",
+        htmlTitle: "Test",
+        kind: "customsearch#result",
+        link: "https://docs.saasquatch.com",
+        pagemap: "",
+      },
+			{
+        cacheId: "test",
+        displayLink: "docs.saasquatch.com",
+        formattedUrl: "https://docs.saasquatch.com",
+        htmlFormattedUrl: "https://docs.saasquatch.com",
+        htmlSnippet: "Testing...",
+        htmlTitle: "Test",
+        kind: "customsearch#result",
+        link: "https://docs.saasquatch.com/something/bread/",
+        pagemap: "",
+      },
+			{
+        cacheId: "test",
+        displayLink: "docs.saasquatch.com",
+        formattedUrl: "https://docs.saasquatch.com",
+        htmlFormattedUrl: "https://docs.saasquatch.com",
+        htmlSnippet: "Testing...",
+        htmlTitle: "Test",
+        kind: "customsearch#result",
+        link: "https://docs.saasquatch.com",
+        pagemap: "",
+      },
+    ],
+    kind: "customsearch#search",
+    searchInformation: {
+      formattedSearchTime: "0.12",
+      formattedTotalResults: "0",
+      searchTime: 0.123753,
+      totalResults: "0",
+    },
+  },
+  setStartIndex: "",
+  query: "test",
+  onIsBlank: isBlank,
+};
+
+export const MultipleItems = () => {
+  return <Results {...defaultProps} />;
+};