feat: first release of Saccade Keyboards (0.1.0)

.github/ISSUE_TEMPLATE/bug_report.yml

@@ -2,6 +2,22 @@ name: Bug report
 description: Report something that is not working as expected
 labels: [bug]
 body:
+  - type: dropdown
+    id: package
+    attributes:
+      label: Package
+      description: Which package shows the problem?
+      options:
+        - saccade-keyboards (the component and its options)
+        - saccade-en
+        - saccade-es
+        - saccade-fr
+        - saccade-hi
+        - saccade-te
+        - saccade-ur
+        - Not sure
+    validations:
+      required: true
   - type: textarea
     id: what-happened
     attributes:
@@ -13,18 +29,29 @@ body:
     id: steps
     attributes:
       label: Steps to reproduce
+      description: Include the language, arrangement and region you used, and any options such as `numpad`, `currencypad`, `theme`, `font` or `fontSize`.
       placeholder: |
         1. ...
         2. ...
     validations:
       required: true
+  - type: input
+    id: width
+    attributes:
+      label: Keyboard width
+      description: How wide the keyboard was when it happened, for example 480 px. Keys look different below 800 px.
   - type: input
     id: version
     attributes:
-      label: Version
-      description: Release or commit you are using.
+      label: Package version
+      description: The version of the package, for example 0.1.0.
+  - type: input
+    id: environment
+    attributes:
+      label: React version, browser and device
+      description: For example React 19.1, Chrome 130 on Windows, or Safari on iPhone.
   - type: textarea
     id: logs
     attributes:
       label: Logs or screenshots
-      description: Remove any secrets or personal information first.
+      description: A screenshot of the keyboard helps most. Remove any secrets or personal information first.

.github/ISSUE_TEMPLATE/config.yml

@@ -0,0 +1,5 @@
+blank_issues_enabled: false
+contact_links:
+  - name: Report a security vulnerability
+    url: https://github.com/coldsofttech/SaccadeKeyboards/security/advisories/new
+    about: Please report vulnerabilities privately, not in a public issue.

.github/ISSUE_TEMPLATE/feature_request.yml

@@ -2,6 +2,22 @@ name: Feature request
 description: Suggest an idea or improvement
 labels: [enhancement]
 body:
+  - type: dropdown
+    id: package
+    attributes:
+      label: Package
+      description: Which package is this about?
+      options:
+        - saccade-keyboards (the component and its options)
+        - saccade-en
+        - saccade-es
+        - saccade-fr
+        - saccade-hi
+        - saccade-te
+        - saccade-ur
+        - Not sure
+    validations:
+      required: true
   - type: textarea
     id: problem
     attributes:

.github/ISSUE_TEMPLATE/layout_fix.yml

@@ -0,0 +1,37 @@
+name: Layout fix
+description: A key is wrong, missing or in the wrong place on an existing keyboard
+title: 'Layout fix: '
+labels: [bug, layout]
+body:
+  - type: dropdown
+    id: package
+    attributes:
+      label: Language
+      options:
+        - English (saccade-en)
+        - Spanish (saccade-es)
+        - French (saccade-fr)
+        - Hindi (saccade-hi)
+        - Telugu (saccade-te)
+        - Urdu (saccade-ur)
+    validations:
+      required: true
+  - type: input
+    id: variant
+    attributes:
+      label: Arrangement and region
+      description: For example "French, FR, native" or "Hindi, InScript, devanagari digits".
+    validations:
+      required: true
+  - type: textarea
+    id: key
+    attributes:
+      label: Which key is wrong?
+      description: Say which key, which layer it is on (normal, Shift, AltGr or symbols), what it types now and what it should type.
+    validations:
+      required: true
+  - type: textarea
+    id: reference
+    attributes:
+      label: Reference
+      description: A link to the official layout, or a photo of a real keyboard, that shows the correct key.

.github/ISSUE_TEMPLATE/new_language.yml

@@ -0,0 +1,56 @@
+name: New language
+description: Ask for a keyboard for a language that is not here yet
+title: 'New language: '
+labels: [enhancement, language]
+body:
+  - type: markdown
+    attributes:
+      value: |
+        Keyboards are available for English, Spanish, French, Hindi, Telugu and Urdu. Each language is its own package, so a new one does not make the others bigger.
+  - type: input
+    id: language
+    attributes:
+      label: Language
+      description: The name and the language code, for example Tamil (ta).
+    validations:
+      required: true
+  - type: input
+    id: script
+    attributes:
+      label: Script
+      description: For example Latin, Devanagari, Arabic or Cyrillic. Say if it is written right to left.
+    validations:
+      required: true
+  - type: textarea
+    id: standard
+    attributes:
+      label: Keyboard layout to follow
+      description: The layout people already use, such as a national standard, InScript, or the one on their phone or computer. A link to its reference chart helps most.
+    validations:
+      required: true
+  - type: textarea
+    id: arrangements
+    attributes:
+      label: Other arrangements
+      description: For example a phonetic layout that maps Latin keys to the letters of the language, or an alphabetical order.
+  - type: textarea
+    id: regions
+    attributes:
+      label: Regions or digits
+      description: Countries whose keyboards differ, or digit styles (such as Latin and native digits) that people need.
+  - type: textarea
+    id: special
+    attributes:
+      label: Special characters
+      description: Letters, signs that sit on a letter, ligatures or punctuation that are easy to get wrong.
+  - type: dropdown
+    id: help
+    attributes:
+      label: Can you help review it?
+      description: A native speaker checking the keys is the best way to get a layout right.
+      options:
+        - Yes, I can check the layout
+        - Yes, and I can write the layout
+        - No, I only need it
+    validations:
+      required: true

.github/ISSUE_TEMPLATE/new_region.yml

@@ -0,0 +1,50 @@
+name: Region-specific layout
+description: Ask for a regional variant of a keyboard that already exists
+title: 'Region: '
+labels: [enhancement, region]
+body:
+  - type: dropdown
+    id: language
+    attributes:
+      label: Language
+      options:
+        - English
+        - Spanish
+        - French
+        - Hindi
+        - Telugu
+        - Urdu
+        - Another language
+    validations:
+      required: true
+  - type: input
+    id: region
+    attributes:
+      label: Region
+      description: The country or area, for example Ireland for English or Germany for French.
+    validations:
+      required: true
+  - type: textarea
+    id: difference
+    attributes:
+      label: How does the keyboard differ?
+      description: Which keys sit in other places or type other characters compared with the closest layout we have, for example AZERTY instead of QWERTY, or a different @ or currency key.
+    validations:
+      required: true
+  - type: textarea
+    id: reference
+    attributes:
+      label: Reference
+      description: A link to the official layout or a picture of a real keyboard from that region.
+    validations:
+      required: true
+  - type: dropdown
+    id: help
+    attributes:
+      label: Can you help review it?
+      options:
+        - Yes, I can check the layout
+        - Yes, and I can write the layout
+        - No, I only need it
+    validations:
+      required: true

.github/PULL_REQUEST_TEMPLATE.md

@@ -2,6 +2,10 @@
 
 <!-- Briefly describe the change and why it is needed. -->
 
+## Packages affected
+
+<!-- e.g. saccade-keyboards, saccade-fr -->
+
 ## Related issues
 
 <!-- e.g. Closes #123 -->
@@ -10,5 +14,6 @@
 
 - [ ] The change is focused on one thing
 - [ ] `CHANGELOG.md` has a short `[Unreleased]` entry
-- [ ] README or docs are updated if behavior changed
+- [ ] Tests are added or updated, including an `axe` check for new components and `validateLayout` for a new or changed layout
+- [ ] The package README is updated if exports or props changed
 - [ ] No secrets or personal data are included

.github/social-preview.html

@@ -0,0 +1,82 @@
+<!doctype html><meta charset="utf-8" /><style>
+  html,
+  body {
+    margin: 0;
+    width: 1280px;
+    height: 640px;
+    background: #0d1117;
+    font-family: 'Segoe UI', Arial, sans-serif;
+    overflow: hidden;
+  }
+  .t {
+    position: absolute;
+    left: 80px;
+    top: 90px;
+    color: #fff;
+  }
+  h1 {
+    margin: 0;
+    font-size: 112px;
+    font-weight: 700;
+    line-height: 1;
+    letter-spacing: -2px;
+  }
+  h1 span {
+    color: #fbbf24;
+  }
+  p {
+    margin: 30px 0 0;
+    font-size: 42px;
+    color: #c9d1d9;
+  }
+  .c {
+    display: flex;
+    gap: 14px;
+    margin-top: 44px;
+  }
+  .c b {
+    font-weight: 600;
+    font-size: 26px;
+    color: #fbbf24;
+    border: 2px solid #fbbf24;
+    border-radius: 999px;
+    padding: 8px 22px;
+  }
+  svg {
+    position: absolute;
+    right: 70px;
+    top: 100px;
+  }
+</style>
+<div class="t">
+  <h1>Saccade<br /><span>Keyboards</span></h1>
+  <p>On-screen keyboards for React</p>
+  <div class="c"><b>6 languages</b><b>Light &amp; dark</b><b>Accessible</b></div>
+</div>
+<svg
+  width="400"
+  height="440"
+  viewBox="0 0 400 440"
+  fill="none"
+  stroke="#FBBF24"
+  stroke-width="8"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <circle cx="200" cy="220" r="170" stroke-opacity=".25" />
+  <circle cx="200" cy="220" r="125" stroke-opacity=".5" />
+  <rect x="60" y="160" width="280" height="160" rx="18" fill="#161B22" />
+  <g stroke="#fff" stroke-width="5">
+    <rect x="82" y="182" width="36" height="30" rx="6" />
+    <rect x="126" y="182" width="36" height="30" rx="6" />
+    <rect x="170" y="182" width="36" height="30" rx="6" />
+    <rect x="214" y="182" width="36" height="30" rx="6" />
+    <rect x="258" y="182" width="36" height="30" rx="6" />
+    <rect x="104" y="222" width="36" height="30" rx="6" />
+    <rect x="148" y="222" width="36" height="30" rx="6" />
+    <rect x="192" y="222" width="36" height="30" rx="6" />
+    <rect x="236" y="222" width="36" height="30" rx="6" />
+    <rect x="104" y="262" width="192" height="30" rx="6" />
+  </g>
+  <path d="M310 330l55 55" stroke-width="14" />
+</svg>