From d7f9a77a03a725464a3406c5f8c2b5d8e566a08c Mon Sep 17 00:00:00 2001 From: jeffchew Date: Mon, 23 Oct 2023 16:59:35 -0400 Subject: [PATCH 1/3] feat(github): adding base github configurations --- .github/CODE_OF_CONDUCT.md | 112 ++++++ .github/CONTRIBUTING.md | 326 ++++++++++++++++++ .../ISSUE_TEMPLATE/ACCESSIBILITY_ISSUE.yaml | 113 ++++++ .github/ISSUE_TEMPLATE/BUG_REPORT.yaml | 92 +++++ .github/ISSUE_TEMPLATE/DESIGN_DEFECT.yaml | 69 ++++ .../FEATURE_REQUEST_OR_ENHANCEMENT.yaml | 68 ++++ .github/ISSUE_TEMPLATE/QUESTION.yaml | 54 +++ .github/ISSUE_TEMPLATE/USER_STORY.yaml | 56 +++ .github/ISSUE_TEMPLATE/config.yml | 1 + .github/PULL_REQUEST_TEMPLATE.md | 21 ++ .github/SUPPORT.md | 7 + .github/dependabot.yml | 7 + .github/renovate.json5 | 19 + .github/workflows/dco.yml | 44 +++ .gitignore | 1 + LICENSE | 201 +++++++++++ 16 files changed, 1191 insertions(+) create mode 100644 .github/CODE_OF_CONDUCT.md create mode 100644 .github/CONTRIBUTING.md create mode 100644 .github/ISSUE_TEMPLATE/ACCESSIBILITY_ISSUE.yaml create mode 100644 .github/ISSUE_TEMPLATE/BUG_REPORT.yaml create mode 100644 .github/ISSUE_TEMPLATE/DESIGN_DEFECT.yaml create mode 100644 .github/ISSUE_TEMPLATE/FEATURE_REQUEST_OR_ENHANCEMENT.yaml create mode 100644 .github/ISSUE_TEMPLATE/QUESTION.yaml create mode 100644 .github/ISSUE_TEMPLATE/USER_STORY.yaml create mode 100644 .github/ISSUE_TEMPLATE/config.yml create mode 100644 .github/PULL_REQUEST_TEMPLATE.md create mode 100644 .github/SUPPORT.md create mode 100644 .github/dependabot.yml create mode 100644 .github/renovate.json5 create mode 100644 .github/workflows/dco.yml create mode 100644 LICENSE diff --git a/.github/CODE_OF_CONDUCT.md b/.github/CODE_OF_CONDUCT.md new file mode 100644 index 00000000..73c9da00 --- /dev/null +++ b/.github/CODE_OF_CONDUCT.md @@ -0,0 +1,112 @@ +# Carbon Code of Conduct + +## TL;DR + +- **Be respectful & understanding.** Not all of us will agree all the time, but + disagreement is no excuse for poor behavior or poor manners. It is important + that we resolve disagreements and differing views constructively. + +* **Be welcoming.** We strive to be a community that welcomes and supports + people of all backgrounds and identities. + +## Our Pledge + +In the interest of fostering an open and welcoming environment, we as +contributors and maintainers pledge to making participation in our project and +our community a harassment-free experience for everyone, regardless of age, body +size, disability, ethnicity, sex characteristics, gender identity and +expression, level of experience, education, socio-economic status, nationality, +personal appearance, race, religion, or sexual identity and orientation. + +## Our Standards + +Examples of behavior that contributes to creating a positive environment +include: + +- Using welcoming and inclusive language +- Being respectful of differing viewpoints and experiences +- Gracefully accepting constructive criticism +- Focusing on what is best for the community +- Showing empathy towards other community members + +Examples of unacceptable behavior by participants include: + +- The use of sexualized language or imagery and unwelcome sexual attention or + advances +- Trolling, insulting/derogatory comments, and personal or political attacks +- Degrading, demeaning or disrespectful comments +- Public or private harassment +- Publishing others' private information, such as a physical or electronic + address, without explicit permission +- Other conduct which could reasonably be considered inappropriate in a + professional setting + +## Our Responsibilities + +Project maintainers are responsible for clarifying the standards of acceptable +behavior and are expected to take appropriate and fair corrective action in +response to any instances of unacceptable behavior. + +Project maintainers have the right and responsibility to remove, edit, or reject +comments, commits, code, wiki edits, issues, and other contributions that are +not aligned to this Code of Conduct, or to ban temporarily or permanently any +contributor for other behaviors that they deem inappropriate, threatening, +offensive, or harmful. + +## Scope + +This Code of Conduct applies within all project spaces, including _but not +limited to_ GitHub, e-mail and Slack. It also applies when an individual is +representing the project or its community in public spaces. Examples of +representing a project or community include using an official project e-mail +address, posting via an official social media account, or acting as an appointed +representative at an online or offline event. Representation of a project may be +further defined and clarified by project maintainers. + +## Enforcement + +Instances of abusive, harassing, or otherwise unacceptable behavior may be +reported by contacting the project team at carbon@us.ibm.com. All complaints +will be reviewed and investigated and will result in a response that is deemed +necessary and appropriate to the circumstances. The project team is obligated to +maintain confidentiality with regard to the reporter of an incident. Further +details of specific enforcement policies may be posted separately. + +Project maintainers who do not follow or enforce the Code of Conduct in good +faith may face temporary or permanent repercussions as determined by other +members of the project's leadership. + +## Slack + +1. Please, no `@here` or `@channel` unless it is a bug that is **breaking + production code.** We have communities in many different time zones, and we + would hate to disrupt someone not at the office. +2. There's no need to notify the Carbon team that you have made an issue in + Carbon's GitHub repositories. We check these several times a day, so we + promise we'll address your issue as soon as we can. +3. Reserve direct messages for sensitive discussions, such as privacy, legal, + or HR reasons. Otherwise, we encourage posting in public channels so people + with the same questions can benefit. +4. If you have a pressing bug fix, it is best to make a PR directly to get your + issues addressed. +5. `#carbon-components`: This channel is for questions about Carbon Components + only. It is not the place to ask general coding questions. Instead, use a + dev community like [StackOverflow](https://stackoverflow.com/). +6. `#carbon-design-system`: Please post any design questions with an in-context + screen shot (i.e. screen shot of the whole UI you are designing) with + background as to what you are trying to accomplish in this flow. We welcome + in-progress work to get community design feedback as well. + +## Attribution + +This Code of Conduct is adapted from the +[Contributor Covenant](https://www.contributor-covenant.org), version 1.4, +available +[here](https://www.contributor-covenant.org/version/1/4/code-of-conduct.html). +For answers to common questions about this code of conduct, see the Contributor +Covenant [FAQ](https://www.contributor-covenant.org/faq). + +
+ +If you have suggestions to improve this Code of Conduct, please submit an issue +or PR. diff --git a/.github/CONTRIBUTING.md b/.github/CONTRIBUTING.md new file mode 100644 index 00000000..63f3cc77 --- /dev/null +++ b/.github/CONTRIBUTING.md @@ -0,0 +1,326 @@ +# Contributing + +## Our contribution model + +Carbon Design System is an **open source** project at IBM. We pride ourselves in +open and inclusive design and development. If you're wondering more about our +contribution process, you're in the right place. First off, thank you for your +interest! This project is made possible not just by the core Carbon team, but +also by several community members who have invested their own time to give back +to the Carbon community. + +## Code of conduct + +We value all of our community members, and thus want to foster a positive +contributing environment. Please take a look at our +[code of conduct](./CODE_OF_CONDUCT.md) before engaging in our workspaces. + +## Prerequisites + +Before contributing to Carbon, you should make sure you have the following tools +installed: + +- [Node.js](https://nodejs.org/en/download/) v18 or above here or follow their + installation through a package manager + [here](https://nodejs.org/en/download/package-manager/)) + - If you're on macOS, we recommend using + [`nvm`](https://github.com/nvm-sh/nvm) to help manage different versions of + Node.js [nvm](https://github.com/nvm-sh/nvm/blob/master/README.md) as your + version manager for Node. +- Git + +You'll also need a code editor to make changes to Carbon. There are many to +choose from but some popular options are +[VSCode](https://code.visualstudio.com/), [Atom](https://atom.io), and +[Sublime](https://www.sublimetext.com/). + +With that all in place, you're ready to start contributing to Carbon! + +## Start contributing + +## - Setting up your environment - + +### 1. Fork the repo: + +Go to +[Carbon for AI's repository on GitHub](https://github.com/carbon-design-system/carbon-for-ai) +and click the `Fork` button in the top-right corner. This will create a copy +repo of Carbon associated with your account. + +### 2. Clone your fork: + +1. Go to your [GitHub Repositories](https://github.com/settings/repositories). +1. Click on `[your_github_username]/carbon-for-ai`. +1. Click on the `Code` button and copy the URL from the `Clone with SSH` + option. It should start with `git@github.com...` + +In your terminal: + +```sh +git clone git@github.com:[your_github_username]/carbon-for-ai.git +cd carbon +``` + +See [GitHub docs](https://help.github.com/articles/fork-a-repo/) for more +details. + +### 3. Add upstream remotes + +When you clone your forked repo, running `git remote -v` will show that the +`origin` is pointing to your forked repo by default. + +Now you need to add the `carbon-design-system/carbon-for-ai` repo as your upstream +remote branch: + +```sh +# Add the upstream remote to your repo +git remote add upstream git@github.com:carbon-design-system/carbon-for-ai.git + +# Verify the remote was added +git remote -v +``` + +Your terminal should output something like this: + +```sh +origin [your forked repo] (fetch) +origin [your forked repo] (push) +upstream git@github.com:carbon-design-system/carbon-for-ai.git (fetch) +upstream git@github.com:carbon-design-system/carbon-for-ai.git (push) +``` + +Great job on getting to this point! Now it's time to code :computer: + +## - Setting up your code - + +### 1. Find or create an issue + +Before you start coding, if you have an issue in mind that you'd like to tackle, +please first [search](https://github.com/carbon-design-system/carbon-for-ai/issues) the +issues to see if a similar issue you'd like to work on has already been +submitted. If a similar issue has been submitted, assign yourself or ask to be +assigned to the issue by posting a comment. + +If the issue does not exist, please make a new issue. Issues give us context +about what you are contributing and expedite the process to getting your +contributions merged into Carbon. It's a win for everybody :tada: + +If you have no idea what you'd like to contribute, take a look at our backlog of +issues and take your pick! Our issues with the label +[`good first issue`](https://github.com/carbon-design-system/carbon-for-ai/issues?q=is%3Aopen+is%3Aissue+label%3A%22good+first+issue+%F0%9F%91%8B%22) +are a great starting point. 👋 + +### 2. Work in a branch + +When contributing to Carbon, your work should always be done in a branch off of +your repo, this is also how you will submit your pull request when your work is +done. + +To create a new branch, ensure you are in your forked branch in your terminal +and run: + +```sh +git pull origin main +git checkout -b {your-branch-name} +``` + +### 3. Build and start the development server + +From the root directory of your fork, run: + +```sh +# To install the project's dependencies +pnpm install + +pnpm storybook +``` + +This will start a development server where you can see any changes you are +making to components in our web components Storybook. + +The command to start the server will differ depending on which package you are +working within. To find out which command you'll need to run, you can check the +`scripts` in the package's `package.json`. + +Once it's done building, you can edit source code or create new components. The +system is set up to automatically bundle your changes/additions. Visit +http://localhost:9000 to see the changes happen on the fly. + +For information about our coding style, such as how we name our classes and our +file structure, go to our +[developer handbook](https://github.com/carbon-design-system/carbon/blob/main/docs/developer-handbook.md#coding-style) + +### 4. Make a pull request + +When you're at a good stopping place and you're ready for feedback from other +contributors and maintainers, **push your commits to your fork**: + +To do so, go to your terminal and run: + +```sh +git add -A +git commit -m "YOUR COMMIT MESSAGE HERE" +``` + +#### Commit tip + +> **Writing commit messages** +> +> - `` indicates the type of commit that's being made. This can be: +> `feat`, `fix`, `perf`, `docs`, `chore`, `style`, `refactor` +> - `` The scope could be anything specifying place of the commit change +> or the thing(s) that changed. +> +> **Commit message format:** + +For more information about how to write your commit message, view our commit +conventions detailed in a our +[developer handbook](https://github.com/carbon-design-system/carbon/blob/main/docs/developer-handbook.md#commit-conventions). + +After your changes are committed, run: + +```sh +git push -u origin { YOUR_BRANCH_NAME } +``` + +In your browser, navigate to +[carbon-design-system/carbon-for-ai](https://github.com/carbon-design-system/carbon-for-ai) +and click the button that reads `Compare & pull request` + +Write a title and description then click `Create pull request` + +- [How to write the perfect pull request](https://github.com/blog/1943-how-to-write-the-perfect-pull-request) + +### 5. Updating a pull request + +Stay up to date with the activity in your pull request. Maintainers from the +Design System team will be reviewing your work and making comments, asking +questions and suggesting changes to be made before they merge your code. + +When you need to make a change, use the same method detailed above except you no +longer need to run `git push -u origin { YOUR_BRANCH_NAME }` just `git push`. + +Once all revisions to your pull request are complete, someone from Design +Systems will squash and merge your commits for you. + +## FAQ + +### Who can contribute? + +Anyone! We mean it. The one and only requirement is you'll need a +[public GitHub account](https://github.com/join), as all our assets live on +GitHub. + +- **Development:** If coding is your thing, you can help us by contributing bug + fixes or community components. Checkout our + [Developer Handbook](https://github.com/carbon-design-system/carbon/docs/developer-handbook.md) to get your dev + environment set up, read up on our best practices and more. +- **Design:** Design contributions can vary from visual assets, UX interactions, + motion design, Sketch kit bug fixes and more. +- **Content:** Our documentation is just as important as our design and code + assets. Whether it's updating our current docs, or adding new + [patterns](./patterns), anyone can contribute to our + [website content](https://github.com/carbon-design-system/carbon-website). +- **Research:** Carbon is made up of developers and designers, but + unfortunately, no dedicated researchers. If you're a researcher and have + findings that you think could improve Carbon users' experience, you're in the + right place. This kind of contribution is most effective if coupled with + design and development forces, which would be presented in a GitHub issue and + subsequent PR. + +### What is the contribution process? + +1. **Issue:** Check repo for an _existing_ issue related to your contribution + first. If none exist, open a new issue. Be sure to check the right repo. + (i.e. Don't open an issue for website documentation in the `carbon` + monorepo.) We reserve the right to close any issues that haven't been filled + out properly according to the issue template. +2. **Development environment:** If you haven't already, fork and clone whichever + repo you want to contribute to. Then, create a new branch and add your + contribution in it. Checkout our + [Developer Handbook](https://github.com/carbon-design-system/carbon/docs/developer-handbook.md) to read up on our best + coding practices and proper commit messages. +3. **Pull request:** Submit a PR. Be sure to fill out the template properly. +4. **Developer Certificate of Origin:** In order to contribute any code, we need + you to sign a Developer Certificate of Origin (DCO). Code doesn't just mean + "components"; if you're contributing to our website docs, you're contributing + code. Sign the + [DCO](https://github.com/carbon-design-system/carbon-dco/blob/main/dco.md) by + making a comment in the PR you just made. +5. **Approval:** Get PR approved by design and developers, or make any necessary + changes for approval. This process may be quick or take a few iterations of + feedback-update. +6. **Documentation:** After design and dev have approved and merged PR, update + any website documentation if necessary. One of the best examples for this is + if you're contributing to component work which has website documentation + related to your contribution. + +Here are some contribution quick tips: + +- **Do** check repos for existing issues. +- **Do** fill out the required template for contributions entirely; this + pertains to both issues and PRs. +- **Do** add or update tests for any contributions that require it. +- **Do** follow existing coding and writing styles. +- **Do** follow proper commit messages syntax. +- **Do not** branch off another branch. +- **Do not** include unrelated changes in the same PR. +- **Do not** create one massive PR if it can be broken up into smaller PRs. + +### What projects can I contribute to? + +- [`carbon-components`](https://github.com/carbon-design-system/carbon/tree/main/packages/components) +- [`carbon-components-react`](https://github.com/carbon-design-system/carbon/tree/main/packages/react) +- [`carbon-website`](https://github.com/carbon-design-system/carbon-website) +- [`gatsby-theme-carbon`](https://github.com/carbon-design-system/gatsby-theme-carbon) +- [`carbon-design-kit`](https://github.com/carbon-design-system/carbon-design-kit) +- [`@carbon/elements`](https://github.com/carbon-design-system/carbon/tree/main/packages/elements) +- [`@carbon/type`](https://github.com/carbon-design-system/carbon/tree/main/packages/type) +- [`@carbon/colors`](https://github.com/carbon-design-system/carbon/tree/main/packages/colors) +- [`@carbon/grid`](https://github.com/carbon-design-system/carbon/tree/main/packages/grid) +- [`@carbon/icons`](https://github.com/carbon-design-system/carbon/tree/main/packages/icons) +- [`@carbon/layout`](https://github.com/carbon-design-system/carbon/tree/main/packages/layout) +- [`@carbon/motion`](https://github.com/carbon-design-system/carbon/tree/main/packages/motion) +- [`@carbon/themes`](https://github.com/carbon-design-system/carbon/tree/main/packages/themes) +- [`@carbon/icons-react`](https://github.com/carbon-design-system/carbon/tree/main/packages/icons-react) + +And more! You can view a complete list of our packages +[here](https://github.com/carbon-design-system/carbon/tree/main/packages). + +### Besides some of the obvious contributions mentioned above, how else can I contribute? + +Great question! Contribution does not require creating or maintaining our +assets. Here are some other ways you can contribute, which don't require much +work: + +- **Join our slack community and interact with other users.** We have hundreds + of users world wide, and quite a small team in comparison. While we try our + best to answer questions on slack, it's not always possible to answer + everything. One of the easiest ways to help us it to jump in on slack + conversations if there's something you know the answer to! Some of our most + popular slack channels include `#carbon-for-ai`, `#carbon-components`, `#carbon-react`, + `#carbon-design-system`, `#carbon-ng`, `#carbon-vue`, `#carbon-announcements`, + `#carbon-community-components`. +- **Report bugs.** Even if you don't have the time to contribute a bug fix, + opening an issue alone makes a big difference! Be sure to completely fill out + the issue template to best help us understand what is going wrong. + +### If I'm contributing code, am I required to contribute it as web components? + +If you've been working with Carbon for a while, you know that we have code +assets in multiple frameworks. For the `Carbon for AI` initiative, the focus is to +deliver reusable components and patterns in a framework-agnostic approach. + +### How can I test-drive components or provide a bug reproduction? + +There are some fantastic tools out there today that provide a near fully-fledged +development environment in the browser. These are incredibly helpful for trying +out simple configurations or providing working code demonstrating bugs or +problems with the libraries. + +We've created a few templates, housed in the repo, that can be used on these +services: + +#### Stackblitz + +Coming soon! diff --git a/.github/ISSUE_TEMPLATE/ACCESSIBILITY_ISSUE.yaml b/.github/ISSUE_TEMPLATE/ACCESSIBILITY_ISSUE.yaml new file mode 100644 index 00000000..9a6df1ca --- /dev/null +++ b/.github/ISSUE_TEMPLATE/ACCESSIBILITY_ISSUE.yaml @@ -0,0 +1,113 @@ +name: Accessibility Issue ♿ +description: Report an accessibility or usability issue. +title: '[a11y]: ' +labels: 'type: a11y ♿' +body: + - type: markdown + attributes: + value: '## Welcome!' + - type: markdown + attributes: + value: + Thanks for taking the time to fill out this accessibility report. IBM + firmly believes that web and software experiences should be accessible + for everyone. Carbon is committed to following and complying with + accessibility best practices. + - type: dropdown + id: browser + attributes: + label: Browser + description: Which browser(s) are you experiencing the issue? + multiple: true + options: + - Chrome + - Safari + - Firefox + - Edge + - type: dropdown + id: os + attributes: + label: Operating System + description: Which operating system are you using? + multiple: true + options: + - Windows + - MacOS + - Other + - type: input + id: version + attributes: + label: Package version + description: 'Which version(s) are you using?' + placeholder: e.g. v10.42.0 + validations: + required: true + - type: input + id: framework-version + attributes: + label: React version + description: 'Which front-end framework and version are you using in your application?' + placeholder: e.g. React v17.0.2 + - type: input + id: tool + attributes: + label: Automated testing tool and ruleset + description: 'Which tool and ruleset uncovered the issue?' + placeholder: + e.g. IBM Equal Access Accessibility Checker - Latest Deployment + validations: + required: true + - type: input + id: technology + attributes: + label: Assistive technology + description: 'Did you experience the issue using an assistive technology?' + placeholder: e.g. JAWS, MacOS VoiceOver + - type: textarea + id: description + attributes: + label: Description + description: + "Tell us more about the accessibility issue that you're experiencing" + placeholder: What did you expect to happen? What happened instead? + validations: + required: true + - type: input + id: wcag + attributes: + label: WCAG 2.1 Violation + description: 'Does this violate a specific WCAG 2.1 checkpoint?' + placeholder: e.g Success Criterion 1.4.3 Contrast (Minimum) + - type: input + id: example-url + attributes: + label: Reproduction/example + description: + 'Use our + [template](https://stackblitz.com/github/carbon-design-system/carbon/tree/main/examples/vite?file=src%2FApp.jsx) + to re-create the issue' + validations: + required: true + - type: textarea + id: reproduce + attributes: + label: Steps to reproduce + description: + 'How do we reproduce the accessibility violation you described using the + reproduction/example link above?' + validations: + required: true + - type: checkboxes + id: terms + attributes: + label: Code of Conduct + description: Please confirm the following + options: + - label: + I agree to follow this project's [Code of + Conduct](https://github.com/carbon-design-system/carbon-for-ai/blob/main/.github/CODE_OF_CONDUCT.md) + required: true + - label: + I checked the [current + issues](https://github.com/carbon-design-system/carbon-for-ai/issues) for + duplicate problems diff --git a/.github/ISSUE_TEMPLATE/BUG_REPORT.yaml b/.github/ISSUE_TEMPLATE/BUG_REPORT.yaml new file mode 100644 index 00000000..54b13a2c --- /dev/null +++ b/.github/ISSUE_TEMPLATE/BUG_REPORT.yaml @@ -0,0 +1,92 @@ +name: Bug report 🐛 +description: + Something not working as expected? This is the place to report your issue. +title: '[Bug]: ' +labels: 'type: bug 🐛' +body: + - type: markdown + attributes: + value: '## Welcome!' + - type: markdown + attributes: + value: Thanks for taking the time to fill out this bug report. + - type: dropdown + id: browser + attributes: + label: Browser + description: Which browser(s) are you experiencing the issue? + multiple: true + options: + - Chrome + - Safari + - Firefox + - Edge + - type: input + id: version + attributes: + label: Package version + description: 'Which version(s) are you using?' + placeholder: e.g. v10.42.0 + validations: + required: true + - type: input + id: framework-version + attributes: + label: React version + description: 'Which front-end framework and version are you using in your application?' + placeholder: e.g. React v17.0.2 + - type: textarea + id: description + attributes: + label: Description + description: "Tell us more about the problem that you're running into" + placeholder: What did you see? What did you expect to see? + validations: + required: true + - type: input + id: example-url + attributes: + label: Reproduction/example + description: | + Re-create the issue using [CodeSandbox](https://codesandbox.io/) or [Stackblitz](https://stackblitz.com). + validations: + required: true + - type: textarea + id: reproduce + attributes: + label: Steps to reproduce + description: + 'How do we reproduce the error you described using the + reproduction/example link above?' + validations: + required: true + - type: dropdown + id: severity + attributes: + label: Suggested Severity + description: + 'Read more to understand our [severity levels](https://github.com/carbon-design-system/carbon/blob/main/docs/guides/support.md#severity)' + options: + - 'Severity 1 = Must be fixed ASAP. The response must be swift. Someone from the team must drop all current work and be immediately reassigned to address the issue.' + - 'Severity 2 = User cannot complete task, and/or no workaround within the user experience of a given component.' + - 'Severity 3 = User can complete task, and/or has a workaround within the user experience of a given component.' + - 'Severity 4 = Unrelated to a user task, has a workaround or does not need a workaround.' + - type: input + id: application + attributes: + label: Application/PAL + description: "What application and/or PAL do you work on?" + - type: checkboxes + id: terms + attributes: + label: Code of Conduct + description: Please confirm the following + options: + - label: + I agree to follow this project's [Code of + Conduct](https://github.com/carbon-design-system/carbon-for-ai/blob/main/.github/CODE_OF_CONDUCT.md) + required: true + - label: + I checked the [current + issues](https://github.com/carbon-design-system/carbon-for-ai/issues) for + duplicate problems diff --git a/.github/ISSUE_TEMPLATE/DESIGN_DEFECT.yaml b/.github/ISSUE_TEMPLATE/DESIGN_DEFECT.yaml new file mode 100644 index 00000000..df3c8416 --- /dev/null +++ b/.github/ISSUE_TEMPLATE/DESIGN_DEFECT.yaml @@ -0,0 +1,69 @@ +name: Design defect 🎨 +description: Report a visual design issue +title: '[Bug]: ' +labels: 'type: bug 🐛' +body: + - type: markdown + attributes: + value: '## Welcome!' + - type: markdown + attributes: + value: + Thanks for taking the time to fill out the details below for this design + defect. + - type: dropdown + id: browser + attributes: + label: Browser + description: Which browser(s) are you experiencing the issue? + multiple: true + options: + - Chrome + - Safari + - Firefox + - Edge + - type: input + id: version + attributes: + label: Package version + description: 'Which version(s) are you using?' + placeholder: e.g. v0.1.0 + validations: + required: true + - type: textarea + id: description + attributes: + label: Description + description: "Tell us more about the problem that you're running into" + placeholder: What did you see? What did you expect to see? + validations: + required: true + - type: textarea + id: example-url + attributes: + label: Screenshots + description: 'Provide screenshots of the problem' + validations: + required: true + - type: textarea + id: reproduce + attributes: + label: Steps to reproduce + description: + 'How do we reproduce the problem displayed in the screenshots above?' + validations: + required: true + - type: checkboxes + id: terms + attributes: + label: Code of Conduct + description: Please confirm the following + options: + - label: + I agree to follow this project's [Code of + Conduct](https://github.com/carbon-design-system/carbon-for-ai/blob/main/.github/CODE_OF_CONDUCT.md) + required: true + - label: + I checked the [current + issues](https://github.com/carbon-design-system/carbon-for-ai/issues) for + duplicate problems diff --git a/.github/ISSUE_TEMPLATE/FEATURE_REQUEST_OR_ENHANCEMENT.yaml b/.github/ISSUE_TEMPLATE/FEATURE_REQUEST_OR_ENHANCEMENT.yaml new file mode 100644 index 00000000..507295f5 --- /dev/null +++ b/.github/ISSUE_TEMPLATE/FEATURE_REQUEST_OR_ENHANCEMENT.yaml @@ -0,0 +1,68 @@ +name: Feature request or enhancement 💡 +description: Suggest an idea for this project. +title: '[Feature Request]: ' +labels: 'type: enhancement 💡' +body: + - type: markdown + attributes: + value: '## Welcome!' + - type: markdown + attributes: + value: + Use this template if you want to request a new feature, or a change to + an existing feature. If you are reporting a bug or problem, please use + the bug template instead. + - type: textarea + id: problem + attributes: + label: The problem + description: + 'Provide a clear and concise description of what the problem this new feature is trying to solve. (For example, I find it frustrating when...). Be sure to attach screenshots or videos to illustrate the problem.' + validations: + required: true + - type: textarea + id: solution + attributes: + label: The solution + description: 'Provide a clear and concise description of what you would like to happen instead. Be sure to attach screenshots or videos to illustrate the solution if possible. Design specs are highly encouraged.' + validations: + required: true + - type: textarea + id: user-research + attributes: + label: Examples + description: Provide sample content, references, or audits of solutions solving the same problem in other applications/websites. + - type: input + id: application + attributes: + label: Application/Product + description: "What application/product do you work on?" + - type: dropdown + id: priority + attributes: + label: Business priority + options: + - 'High Priority = pressing release' + - 'Medium Priority = upcoming release but is not pressing' + - 'Low Priority = release date is not dependent on fix or not upcoming' + - type: input + id: resources + attributes: + label: Available extra resources + description: 'What resources do you have to assist this effort?' + - type: markdown + attributes: + value: + '_Carbon is a collaborative system. We encourage teams to build + components and submit them for integration as either add-ons or core + components. To better understand our feature request process and what happens after you submit this issue, [check out the docs](https://github.com/carbon-design-system/carbon/blob/main/docs/guides/support.md#type-enhancement-) on Github._' + - type: checkboxes + id: terms + attributes: + label: Code of Conduct + description: Please confirm the following + options: + - label: + I agree to follow this project's [Code of + Conduct](https://github.com/carbon-design-system/carbon-for-ai/blob/main/.github/CODE_OF_CONDUCT.md) + required: true diff --git a/.github/ISSUE_TEMPLATE/QUESTION.yaml b/.github/ISSUE_TEMPLATE/QUESTION.yaml new file mode 100644 index 00000000..aa3d07f5 --- /dev/null +++ b/.github/ISSUE_TEMPLATE/QUESTION.yaml @@ -0,0 +1,54 @@ +name: Question ❓ +description: Usage question or discussion about Carbon components. +title: '[Question]: ' +labels: 'type: question ❓' +body: + - type: markdown + attributes: + value: '## Hi there! 👋' + - type: markdown + attributes: + value: + Hope everything is going okay using projects from the Carbon Design + System. It looks like you might have a question about our work, so we + wanted to share a couple of resources that you could use if you haven't + tried them yet 🙂 + - type: markdown + attributes: + value: + If you're an IBMer, we have a couple of Slack channels available across + all IBM Workspaces. + - type: markdown + attributes: + value: '- `#carbon-design-system` for questions about the Design System.' + - type: markdown + attributes: + value: '- `#carbon-react` for questions about the Carbon React library.' + - type: markdown + attributes: + value: '- `#carbon-web-components` for questions about the Carbon Web Components library.' + - type: markdown + attributes: + value: '- `#carbon-for-ai` for questions about the Carbon for AI library.' + - type: markdown + attributes: + value: + "For non-IBMer's, you can ask a question on our [GitHub Discussions + board](https://github.com/carbon-design-system/carbon-for-ai/discussions/new)." + - type: textarea + id: summary + attributes: + label: Question for Carbon + description: 'Let us know how we can help!' + validations: + required: true + - type: checkboxes + id: terms + attributes: + label: Code of Conduct + description: Please confirm the following + options: + - label: + I agree to follow this project's [Code of + Conduct](https://github.com/carbon-design-system/carbon-for-ai/blob/main/.github/CODE_OF_CONDUCT.md) + required: true diff --git a/.github/ISSUE_TEMPLATE/USER_STORY.yaml b/.github/ISSUE_TEMPLATE/USER_STORY.yaml new file mode 100644 index 00000000..d82dc7bf --- /dev/null +++ b/.github/ISSUE_TEMPLATE/USER_STORY.yaml @@ -0,0 +1,56 @@ +name: (Carbon for AI team ONLY) User story +description: + Write a user story to begin solving their needs. +title: '[YOUR TITLE]: Brief description' +body: + - type: markdown + attributes: + value: "Avoid any type of solutions in this user story." + - type: markdown + attributes: + value: "Consider the following when writing Acceptance criteria for this story: + + - Each product backlog item or user story should have at least one Acceptance criteria. + + - Acceptance criteria defines a deliverable that can be completed in a single sprint. + + - Each Acceptance criterion is independently testable. + + - Include functional as well as non-functional criteria – when relevant. + + - Team members write Acceptance criteria and the Product Owner verifies it." + - type: textarea + id: user-story + attributes: + label: User story + value: "> As a `[user role below]`: + + + > I need to: + + + > so that I can:" + validations: + required: true + - type: textarea + id: additional-information + attributes: + label: Additional information + value: "- _{{user research}}_ + +- _{{user insights}}_ + +- _{{user metrics}}_" + validations: + required: true + - type: textarea + id: acceptance-criteria + attributes: + label: Acceptance criteria + value: "- [ ] _{{State acceptance criteria}}_ + +- [ ] _{{State another}}_ + +- [ ] _{{And another}}_" + validations: + required: true diff --git a/.github/ISSUE_TEMPLATE/config.yml b/.github/ISSUE_TEMPLATE/config.yml new file mode 100644 index 00000000..0086358d --- /dev/null +++ b/.github/ISSUE_TEMPLATE/config.yml @@ -0,0 +1 @@ +blank_issues_enabled: true diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md new file mode 100644 index 00000000..8f80decb --- /dev/null +++ b/.github/PULL_REQUEST_TEMPLATE.md @@ -0,0 +1,21 @@ +Closes # + +{{short description}} + +#### Changelog + +**New** + +- {{new thing}} + +**Changed** + +- {{change thing}} + +**Removed** + +- {{removed thing}} + +#### Testing / Reviewing + +{{ Add descriptions, steps or a checklist for how reviewers can verify this PR works or not }} diff --git a/.github/SUPPORT.md b/.github/SUPPORT.md new file mode 100644 index 00000000..7f2bd2a3 --- /dev/null +++ b/.github/SUPPORT.md @@ -0,0 +1,7 @@ +# Support + +If you run into an issue, sorry about that! We definitely want to make sure that +your experience using the Carbon Design System is the best that it can be. + +When this happens, just create an issue on GitHub by filling out the template +and we'll try our best to respond in a reasonable time. diff --git a/.github/dependabot.yml b/.github/dependabot.yml new file mode 100644 index 00000000..3eddd09a --- /dev/null +++ b/.github/dependabot.yml @@ -0,0 +1,7 @@ +version: 2 +updates: + # Maintain dependencies for GitHub Actions + - package-ecosystem: 'github-actions' + directory: '/' + schedule: + interval: 'daily' diff --git a/.github/renovate.json5 b/.github/renovate.json5 new file mode 100644 index 00000000..b59e46b5 --- /dev/null +++ b/.github/renovate.json5 @@ -0,0 +1,19 @@ +{ + "extends": [ + // https://docs.renovatebot.com/presets-config/#configjs-lib + "config:js-lib", + + // https://docs.renovatebot.com/presets-default/#maintainlockfilesweekly + ":maintainLockFilesWeekly", + + // https://docs.renovatebot.com/presets-default/#preservesemverranges + ":preserveSemverRanges", + + // https://docs.renovatebot.com/presets-npm/#npmunpublishsafe + "npm:unpublishSafe", + + // https://docs.renovatebot.com/presets-schedule/#scheduledaily + "schedule:earlyMondays", + ], + "rebaseWhen": "never", +} diff --git a/.github/workflows/dco.yml b/.github/workflows/dco.yml new file mode 100644 index 00000000..d448d2f6 --- /dev/null +++ b/.github/workflows/dco.yml @@ -0,0 +1,44 @@ +name: 'DCO Assistant' +on: + issue_comment: + types: [created] + pull_request_target: + types: [opened, closed, synchronize] + merge_group: + types: [checks_requested] + +jobs: + DCO: + runs-on: ubuntu-latest + steps: + - name: 'DCO Assistant' + if: + (github.event.comment.body == 'recheck' || github.event.comment.body + == 'I have read the DCO document and I hereby sign the DCO.') || + github.event_name == 'pull_request_target' + uses: cla-assistant/github-action@a895a435fcce79ecf28fbce61a4ef0f0dabc9853 #v2.3.1 + env: + GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} + PERSONAL_ACCESS_TOKEN: ${{ secrets.PERSONAL_ACCESS_TOKEN }} + with: + path-to-signatures: 'dco-signatures.json' + path-to-document: 'https://github.com/carbon-design-system/carbon-dco/blob/main/dco.md' + branch: 'main' + allowlist: bot* + remote-organization-name: carbon-design-system + remote-repository-name: carbon-dco + create-file-commit-message: + 'chore: create file to store dco signatures' + signed-commit-message: + 'chore: $contributorName has signed the dco in #$pullRequestNo' + custom-notsigned-prcomment: + 'Thanks for your submission! We ask that $you sign our [Developer + Certificate of + Origin](https://github.com/carbon-design-system/carbon-dco/blob/main/dco.md) + before we can accept your contribution. You can sign the DCO by + adding a comment below using this text:' + custom-pr-sign-comment: + 'I have read the DCO document and I hereby sign the DCO.' + custom-allsigned-prcomment: 'All contributors have signed the DCO.' + lock-pullrequest-aftermerge: false + use-dco-flag: true diff --git a/.gitignore b/.gitignore index a547bf36..a5269486 100644 --- a/.gitignore +++ b/.gitignore @@ -11,6 +11,7 @@ node_modules dist dist-ssr *.local +storybook-static # Editor directories and files .vscode/* diff --git a/LICENSE b/LICENSE new file mode 100644 index 00000000..7a9284b0 --- /dev/null +++ b/LICENSE @@ -0,0 +1,201 @@ + Apache License + Version 2.0, January 2004 + http://www.apache.org/licenses/ + + TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION + + 1. Definitions. + + "License" shall mean the terms and conditions for use, reproduction, + and distribution as defined by Sections 1 through 9 of this document. + + "Licensor" shall mean the copyright owner or entity authorized by + the copyright owner that is granting the License. + + "Legal Entity" shall mean the union of the acting entity and all + other entities that control, are controlled by, or are under common + control with that entity. For the purposes of this definition, + "control" means (i) the power, direct or indirect, to cause the + direction or management of such entity, whether by contract or + otherwise, or (ii) ownership of fifty percent (50%) or more of the + outstanding shares, or (iii) beneficial ownership of such entity. + + "You" (or "Your") shall mean an individual or Legal Entity + exercising permissions granted by this License. + + "Source" form shall mean the preferred form for making modifications, + including but not limited to software source code, documentation + source, and configuration files. + + "Object" form shall mean any form resulting from mechanical + transformation or translation of a Source form, including but + not limited to compiled object code, generated documentation, + and conversions to other media types. + + "Work" shall mean the work of authorship, whether in Source or + Object form, made available under the License, as indicated by a + copyright notice that is included in or attached to the work + (an example is provided in the Appendix below). + + "Derivative Works" shall mean any work, whether in Source or Object + form, that is based on (or derived from) the Work and for which the + editorial revisions, annotations, elaborations, or other modifications + represent, as a whole, an original work of authorship. For the purposes + of this License, Derivative Works shall not include works that remain + separable from, or merely link (or bind by name) to the interfaces of, + the Work and Derivative Works thereof. + + "Contribution" shall mean any work of authorship, including + the original version of the Work and any modifications or additions + to that Work or Derivative Works thereof, that is intentionally + submitted to Licensor for inclusion in the Work by the copyright owner + or by an individual or Legal Entity authorized to submit on behalf of + the copyright owner. For the purposes of this definition, "submitted" + means any form of electronic, verbal, or written communication sent + to the Licensor or its representatives, including but not limited to + communication on electronic mailing lists, source code control systems, + and issue tracking systems that are managed by, or on behalf of, the + Licensor for the purpose of discussing and improving the Work, but + excluding communication that is conspicuously marked or otherwise + designated in writing by the copyright owner as "Not a Contribution." + + "Contributor" shall mean Licensor and any individual or Legal Entity + on behalf of whom a Contribution has been received by Licensor and + subsequently incorporated within the Work. + + 2. Grant of Copyright License. Subject to the terms and conditions of + this License, each Contributor hereby grants to You a perpetual, + worldwide, non-exclusive, no-charge, royalty-free, irrevocable + copyright license to reproduce, prepare Derivative Works of, + publicly display, publicly perform, sublicense, and distribute the + Work and such Derivative Works in Source or Object form. + + 3. Grant of Patent License. Subject to the terms and conditions of + this License, each Contributor hereby grants to You a perpetual, + worldwide, non-exclusive, no-charge, royalty-free, irrevocable + (except as stated in this section) patent license to make, have made, + use, offer to sell, sell, import, and otherwise transfer the Work, + where such license applies only to those patent claims licensable + by such Contributor that are necessarily infringed by their + Contribution(s) alone or by combination of their Contribution(s) + with the Work to which such Contribution(s) was submitted. If You + institute patent litigation against any entity (including a + cross-claim or counterclaim in a lawsuit) alleging that the Work + or a Contribution incorporated within the Work constitutes direct + or contributory patent infringement, then any patent licenses + granted to You under this License for that Work shall terminate + as of the date such litigation is filed. + + 4. Redistribution. You may reproduce and distribute copies of the + Work or Derivative Works thereof in any medium, with or without + modifications, and in Source or Object form, provided that You + meet the following conditions: + + (a) You must give any other recipients of the Work or + Derivative Works a copy of this License; and + + (b) You must cause any modified files to carry prominent notices + stating that You changed the files; and + + (c) You must retain, in the Source form of any Derivative Works + that You distribute, all copyright, patent, trademark, and + attribution notices from the Source form of the Work, + excluding those notices that do not pertain to any part of + the Derivative Works; and + + (d) If the Work includes a "NOTICE" text file as part of its + distribution, then any Derivative Works that You distribute must + include a readable copy of the attribution notices contained + within such NOTICE file, excluding those notices that do not + pertain to any part of the Derivative Works, in at least one + of the following places: within a NOTICE text file distributed + as part of the Derivative Works; within the Source form or + documentation, if provided along with the Derivative Works; or, + within a display generated by the Derivative Works, if and + wherever such third-party notices normally appear. The contents + of the NOTICE file are for informational purposes only and + do not modify the License. You may add Your own attribution + notices within Derivative Works that You distribute, alongside + or as an addendum to the NOTICE text from the Work, provided + that such additional attribution notices cannot be construed + as modifying the License. + + You may add Your own copyright statement to Your modifications and + may provide additional or different license terms and conditions + for use, reproduction, or distribution of Your modifications, or + for any such Derivative Works as a whole, provided Your use, + reproduction, and distribution of the Work otherwise complies with + the conditions stated in this License. + + 5. Submission of Contributions. Unless You explicitly state otherwise, + any Contribution intentionally submitted for inclusion in the Work + by You to the Licensor shall be under the terms and conditions of + this License, without any additional terms or conditions. + Notwithstanding the above, nothing herein shall supersede or modify + the terms of any separate license agreement you may have executed + with Licensor regarding such Contributions. + + 6. Trademarks. This License does not grant permission to use the trade + names, trademarks, service marks, or product names of the Licensor, + except as required for reasonable and customary use in describing the + origin of the Work and reproducing the content of the NOTICE file. + + 7. Disclaimer of Warranty. Unless required by applicable law or + agreed to in writing, Licensor provides the Work (and each + Contributor provides its Contributions) on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or + implied, including, without limitation, any warranties or conditions + of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A + PARTICULAR PURPOSE. You are solely responsible for determining the + appropriateness of using or redistributing the Work and assume any + risks associated with Your exercise of permissions under this License. + + 8. Limitation of Liability. In no event and under no legal theory, + whether in tort (including negligence), contract, or otherwise, + unless required by applicable law (such as deliberate and grossly + negligent acts) or agreed to in writing, shall any Contributor be + liable to You for damages, including any direct, indirect, special, + incidental, or consequential damages of any character arising as a + result of this License or out of the use or inability to use the + Work (including but not limited to damages for loss of goodwill, + work stoppage, computer failure or malfunction, or any and all + other commercial damages or losses), even if such Contributor + has been advised of the possibility of such damages. + + 9. Accepting Warranty or Additional Liability. While redistributing + the Work or Derivative Works thereof, You may choose to offer, + and charge a fee for, acceptance of support, warranty, indemnity, + or other liability obligations and/or rights consistent with this + License. However, in accepting such obligations, You may act only + on Your own behalf and on Your sole responsibility, not on behalf + of any other Contributor, and only if You agree to indemnify, + defend, and hold each Contributor harmless for any liability + incurred by, or claims asserted against, such Contributor by reason + of your accepting any such warranty or additional liability. + + END OF TERMS AND CONDITIONS + + APPENDIX: How to apply the Apache License to your work. + + To apply the Apache License to your work, attach the following + boilerplate notice, with the fields enclosed by brackets "[]" + replaced with your own identifying information. (Don't include + the brackets!) The text should be enclosed in the appropriate + comment syntax for the file format. We also recommend that a + file or class name and description of purpose be included on the + same "printed page" as the copyright notice for easier + identification within third-party archives. + + Copyright 2019 IBM Corp. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with 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. From c1aebd7bbde930b4424cb76ff7be01bb21367741 Mon Sep 17 00:00:00 2001 From: jeffchew Date: Mon, 30 Oct 2023 11:54:23 -0400 Subject: [PATCH 2/3] feat(components): separating class and templates in structure --- src/components/test-input/src/test-input.js | 37 ++++++++++++++++++ .../test-input/src/test-input.template.js | 20 ++++++++++ src/components/test-input/test-input.js | 39 ++----------------- 3 files changed, 61 insertions(+), 35 deletions(-) create mode 100644 src/components/test-input/src/test-input.js create mode 100644 src/components/test-input/src/test-input.template.js diff --git a/src/components/test-input/src/test-input.js b/src/components/test-input/src/test-input.js new file mode 100644 index 00000000..c44ad219 --- /dev/null +++ b/src/components/test-input/src/test-input.js @@ -0,0 +1,37 @@ +/** + * @license + * + * Copyright IBM Corp. 2023 + * + * This source code is licensed under the Apache-2.0 license found in the + * LICENSE file in the root directory of this source tree. + */ + +import { LitElement } from 'lit'; +import { SearchTypeaheadAPI } from '../../../services/SearchTypeahead/index.js'; + +/** + * Input component using search typeahead api + */ +export default class testInput extends LitElement { + static properties = { + searchResults: { attribute: false }, + }; + + constructor() { + super(); + this.searchResults; + } + + async getResults(searchQuery) { + const response = await SearchTypeaheadAPI.getResults(searchQuery); + return response.map((res) => res[0]); + } + + _handleInput(event) { + const { value } = event.target; + this.getResults(value).then((res) => { + this.searchResults = res; + }); + } +} diff --git a/src/components/test-input/src/test-input.template.js b/src/components/test-input/src/test-input.template.js new file mode 100644 index 00000000..f13b15a0 --- /dev/null +++ b/src/components/test-input/src/test-input.template.js @@ -0,0 +1,20 @@ +/** + * @license + * + * Copyright IBM Corp. 2023 + * + * This source code is licensed under the Apache-2.0 license found in the + * LICENSE file in the root directory of this source tree. + */ +import { html } from 'lit'; + +export function testInputTemplate(cls) { + const { _handleInput: handleInput } = cls; + return html`
+ + + ${cls.searchResults + ? cls.searchResults.map((result) => html`

${result}

`) + : undefined} +
`; +} diff --git a/src/components/test-input/test-input.js b/src/components/test-input/test-input.js index 993d331a..8241be25 100644 --- a/src/components/test-input/test-input.js +++ b/src/components/test-input/test-input.js @@ -8,45 +8,14 @@ */ import settings from '../../globals/settings.js'; -import { LitElement, html } from 'lit'; -import { SearchTypeaheadAPI } from '../../services/SearchTypeahead/index.js'; +import testInput from './src/test-input.js'; +import { testInputTemplate } from './src/test-input.template.js'; const { stablePrefix: c4aiPrefix } = settings; -/** - * Input component using search typeahead api - */ -export default class C4AITestInput extends LitElement { - static properties = { - searchResults: { attribute: false }, - }; - - constructor() { - super(); - this.searchResults; - } - - async getResults(searchQuery) { - const response = await SearchTypeaheadAPI.getResults(searchQuery); - return response.map((res) => res[0]); - } - - _handleInput(event) { - const { value } = event.target; - this.getResults(value).then((res) => { - this.searchResults = res; - }); - } - +class C4AITestInput extends testInput { render() { - const { _handleInput: handleInput } = this; - return html`
- - - ${this.searchResults - ? this.searchResults.map((result) => html`

${result}

`) - : undefined} -
`; + return testInputTemplate(this); } } From 866c7dc23f7471bbeb35efb08c4777832955b5c8 Mon Sep 17 00:00:00 2001 From: jeffchew Date: Mon, 30 Oct 2023 12:28:27 -0400 Subject: [PATCH 3/3] feat(github): initial github templates --- src/components/test-input/src/test-input.js | 37 ------------------ .../test-input/src/test-input.template.js | 20 ---------- src/components/test-input/test-input.js | 39 +++++++++++++++++-- 3 files changed, 35 insertions(+), 61 deletions(-) delete mode 100644 src/components/test-input/src/test-input.js delete mode 100644 src/components/test-input/src/test-input.template.js diff --git a/src/components/test-input/src/test-input.js b/src/components/test-input/src/test-input.js deleted file mode 100644 index c44ad219..00000000 --- a/src/components/test-input/src/test-input.js +++ /dev/null @@ -1,37 +0,0 @@ -/** - * @license - * - * Copyright IBM Corp. 2023 - * - * This source code is licensed under the Apache-2.0 license found in the - * LICENSE file in the root directory of this source tree. - */ - -import { LitElement } from 'lit'; -import { SearchTypeaheadAPI } from '../../../services/SearchTypeahead/index.js'; - -/** - * Input component using search typeahead api - */ -export default class testInput extends LitElement { - static properties = { - searchResults: { attribute: false }, - }; - - constructor() { - super(); - this.searchResults; - } - - async getResults(searchQuery) { - const response = await SearchTypeaheadAPI.getResults(searchQuery); - return response.map((res) => res[0]); - } - - _handleInput(event) { - const { value } = event.target; - this.getResults(value).then((res) => { - this.searchResults = res; - }); - } -} diff --git a/src/components/test-input/src/test-input.template.js b/src/components/test-input/src/test-input.template.js deleted file mode 100644 index f13b15a0..00000000 --- a/src/components/test-input/src/test-input.template.js +++ /dev/null @@ -1,20 +0,0 @@ -/** - * @license - * - * Copyright IBM Corp. 2023 - * - * This source code is licensed under the Apache-2.0 license found in the - * LICENSE file in the root directory of this source tree. - */ -import { html } from 'lit'; - -export function testInputTemplate(cls) { - const { _handleInput: handleInput } = cls; - return html`
- - - ${cls.searchResults - ? cls.searchResults.map((result) => html`

${result}

`) - : undefined} -
`; -} diff --git a/src/components/test-input/test-input.js b/src/components/test-input/test-input.js index 8241be25..993d331a 100644 --- a/src/components/test-input/test-input.js +++ b/src/components/test-input/test-input.js @@ -8,14 +8,45 @@ */ import settings from '../../globals/settings.js'; -import testInput from './src/test-input.js'; -import { testInputTemplate } from './src/test-input.template.js'; +import { LitElement, html } from 'lit'; +import { SearchTypeaheadAPI } from '../../services/SearchTypeahead/index.js'; const { stablePrefix: c4aiPrefix } = settings; -class C4AITestInput extends testInput { +/** + * Input component using search typeahead api + */ +export default class C4AITestInput extends LitElement { + static properties = { + searchResults: { attribute: false }, + }; + + constructor() { + super(); + this.searchResults; + } + + async getResults(searchQuery) { + const response = await SearchTypeaheadAPI.getResults(searchQuery); + return response.map((res) => res[0]); + } + + _handleInput(event) { + const { value } = event.target; + this.getResults(value).then((res) => { + this.searchResults = res; + }); + } + render() { - return testInputTemplate(this); + const { _handleInput: handleInput } = this; + return html`
+ + + ${this.searchResults + ? this.searchResults.map((result) => html`

${result}

`) + : undefined} +
`; } }