feat: add GitHub Direct Commit support (#333)

* feat: add GitHub Direct Commit support

- Add github_commit authentication type for direct file commits
- Implement GithubRepository module for GitHub API integration
- Add UI components for branch, filepath, and commit message configuration
- Update README documentation with github_commit auth option
- Supports automatic branch creation if not exists
- Handles both file creation and updates via GitHub API

* refactor: use URL object for more robust GitHub URL parsing

* docs: add GitHub Direct Commit URL examples to README

* refactor: remove simple owner/repo URL format support

- Remove simple owner/repo format from URL parsing logic
- Update README to document only supported URL formats
- Keep support for https://api.github.com/repos/owner/repo
- Keep support for https://github.com/owner/repo
- Remove :username/:repo format that fails HTML5 validation

* fix: update placeholder to show only supported GitHub URL formats

* docs: simplify GitHub Direct Commit URL format documentation

* fix: address code review feedback

- Add proper URI encoding for filenames with special characters
- Improve 422 status handling to only accept 'Reference already exists'
- Remove redundant targetBranch variable for code clarity

* test: add comprehensive tests for githubRepository module

- Test constructor initialization
- Test upload to existing branch with new/existing files
- Test branch creation when branch doesn't exist
- Test default commit message generation
- Test URL encoding for special characters and unicode
- Mock XMLHttpRequest for isolated unit testing
- Coverage increased from 1.76% to 46.01%

Addresses code review comment about test coverage decrease

* test: improve githubRepository test coverage to 50.44%

- Add tests for URL encoding with slashes
- Add tests for 422 Reference already exists handling
- Add tests for other 422 validation errors
- Add tests for invalid JSON in 422 responses
- Add tests for 401 and 403 error handling
- Coverage improved from 46.01% to 50.44%

This addresses the code review comment about test coverage decrease

* test: add comprehensive tests for githubRepository and urlExport

- Add 18 tests for githubRepository module covering upload, error handling, and URL encoding
- Add 6 tests for urlExport githubCommit auth type integration
- Improve githubRepository branch coverage from 22% to 40.74%
- Test URI encoding fix (encodeURIComponent)
- Test 422 error handling with 'Reference already exists' message
- Test URL parsing for both API and web URL formats

* style: remove extra blank line in githubRepository.ts

* style: remove trailing whitespace in test files

* build: rebuild dist files with latest changes

Author: igort78

README.md

@@ -1,10 +1,10 @@
 > [!WARNING]
-> **This plugin is only partially supported!**  
+> **This plugin is only partially supported!**
 > This means: I don't have capacity to add any features or really improve stuff. Bugfixes may be added if time allows.
 > I am also happy to discuss and merge PRs.
-> 
-> I personally have changed my opinion a long time ago to favor the source fo truth for design tokens to be in a json file. Figma should be a consumer so you only import tokens into figma. This is why I don't use plugins like this one anymore in my work. 
-> 
+>
+> I personally have changed my opinion a long time ago to favor the source fo truth for design tokens to be in a json file. Figma should be a consumer so you only import tokens into figma. This is why I don't use plugins like this one anymore in my work.
+>
 > → [Read more about the a better setup](https://medium.com/user-experience-design-1/the-ultimate-design-token-setup-cdf50dc841c8#:~:text=you%20are%20making.-,Source%20of%20truth,-There%20is%20some)
 
 
@@ -37,7 +37,7 @@ The **Design Tokens** plugin for Figma allows you to export design tokens into a
     - [Opacity token](#opacity)
   - [Available properties](#available-properties)
 - [Settings](#settings)
-  - [File Export Settings](#file-export-settings)  
+  - [File Export Settings](#file-export-settings)
   - [Push tokens to Github / Server](#push-to-server)
 - [Contribution](#contribution)
 
@@ -353,7 +353,7 @@ You can define any additional prefix via this option, e.g `*`. This can be helpf
 
 ### Reference mode in variables
 
-You can configure whether to include these mode names in the output JSON or not.  
+You can configure whether to include these mode names in the output JSON or not.
 By default, the mode names are not included in both the token names and the token values. You can turn on this behavior in the plug-in settings:
 
 - If you wish to include the mode name in the token names, but not in the token values, you can activate the "Add mode to token value".
@@ -449,7 +449,7 @@ The body of the request will look like the following:
 
 ```ts
   "event_type": "update-tokens", // or any string you defined
-  "client_payload": { 
+  "client_payload": {
     "tokens": "{...}", // the stringified json object holding all your design tokens
     "filename": "Design Tokens", // the Figma file name from which the tokens were exported
     "commitMessage": "Your commit message"
@@ -480,7 +480,9 @@ Overrides the content type header for the final HTTP request. Defaults to "plain
 
 ##### Pushing to Github
 
-If you push to github the server url must be in the format
+**Using GitHub Actions (workflow dispatch):**
+
+If you push to github using the `token` auth type, the server url must be in the format:
 
 ```
 https://api.github.com/repos/:username/:repo/dispatches
@@ -492,11 +494,19 @@ For the repository `lukasoppermann/design-token-transformer` this would be:
 https://api.github.com/repos/lukasoppermann/design-token-transformer/dispatches
 ```
 
+**Using GitHub Direct Commit:**
+
+If you use the `github_commit` auth type for direct file commits, the server url must be:
+
+- `https://api.github.com/repos/:username/:repo` or
+- `https://github.com/:username/:repo`
+
 #### **Auth header**
 
 This defines the authentication method used with the access token. The current choices are:
 
-- `token` (used for github)
+- `token` (used for github workflow triggers)
+- `github_commit` (used for direct file commits to GitHub)
 - `gitlab_token` (used for Gitlab requests)
 - `bearer` token
 - `basic` auth

dist/plugin.js

@@ -26,6 +26,7 @@ export default {
       token: 'token',
       gitlabToken: 'gitlab_token',
       gitlabCommit: 'gitlab_commit',
+      githubCommit: 'github_commit',
       basic: 'Basic',
       bearer: 'Bearer'
     }

dist/ui.html

@@ -151,6 +151,8 @@ export const UrlExportSettings = () => {
           placeholder={
             (settings.authType === config.key.authType.gitlabCommit &&
               'https://gitlab.com/api/v4/projects/:projectId') ||
+            (settings.authType === config.key.authType.githubCommit &&
+              'https://github.com/:username/:repo or https://api.github.com/repos/:username/:repo') ||
             'https://api.github.com/repos/:username/:repo/dispatches'
           }
           value={settings.serverUrl}
@@ -209,6 +211,10 @@ export const UrlExportSettings = () => {
               label: '(Github) token',
               value: config.key.authType.token
             },
+            {
+              label: '(Github) Direct Commit',
+              value: config.key.authType.githubCommit
+            },
             {
               label: '(Gitlab) token',
               value: config.key.authType.gitlabToken
@@ -270,6 +276,32 @@ export const UrlExportSettings = () => {
         </>
       )}
 
+      {config.key.authType.githubCommit === settings.authType && (
+        <>
+          <h3>
+            Branch
+            <Info
+              width={150}
+              label='The branch where the file will be committed. Only used when Github Direct Commit is selected for "Auth type"'
+            />
+          </h3>
+          <Row fill>
+            <Input
+              type="text"
+              required
+              pattern="\S+"
+              placeholder="main"
+              value={settings.reference}
+              onChange={(value) =>
+                updateSettings((draft) => {
+                  draft.reference = value
+                })
+              }
+            />
+          </Row>
+        </>
+      )}
+
       {config.key.authType.gitlabCommit === settings.authType && (
         <>
           <h3>