IBX-11635: Use design-system text input component

.claude/settings.local.json

@@ -0,0 +1,26 @@
+{
+  "permissions": {
+    "allow": [
+      "Bash(git -C /Users/jakubbrzegowski/Sites/commerce-5-0-dev_15/vendor/ibexa/design-system-twig status)",
+      "Bash(git -C /Users/jakubbrzegowski/Sites/commerce-5-0-dev_15/vendor/ibexa/design-system-twig add src/bundle/Resources/views/themes/standard/design_system/components/button.html.twig)",
+      "Bash(git -C /Users/jakubbrzegowski/Sites/commerce-5-0-dev_15/vendor/ibexa/design-system-twig commit -m \"$\\(cat <<''EOF''\nAdd html_type parameter to button component\n\nAllow setting the HTML button type attribute \\(button, submit, reset\\)\nvia the html_type parameter, defaulting to ''button''.\n\nCo-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>\nEOF\n\\)\")",
+      "Bash(git add:*)",
+      "Bash(git commit:*)",
+      "Bash(php /Users/jakubbrzegowski/Sites/commerce-5-0-dev_15/bin/console cache:clear:*)",
+      "Bash(git status)",
+      "Bash(git diff)",
+      "Bash(git add *)",
+      "Bash(git commit *)",
+      "Bash(ls -R *)",
+      "Bash(grep *)",
+      "Bash(cat *)",
+      "Bash(php * bin/console lint:twig *)",
+      "Bash(php * bin/console cache:clear *)"
+    ],
+    "deny": [
+      "Bash(git push *)",
+      "Bash(gh pr *)",
+      "Bash(git remote *)"
+    ]
+  }
+}

.claude/skills/validate-frontend-changes.md

@@ -0,0 +1,115 @@
+# Validate Frontend Changes - Ibexa Admin UI
+
+## Description
+This skill validates Twig template and JavaScript changes in Ibexa packages, specifically after design system component migrations. It runs frontend tests, builds assets, and provides a testing checklist.
+
+## When to Use
+- After migrating HTML buttons to design system button components in Twig
+- After modifying JavaScript or TypeScript files
+- Before committing frontend changes
+- When troubleshooting build or runtime issues with UI components
+
+## Prerequisites
+- Node.js and Yarn installed
+- Assets may have been modified but not yet validated
+- Working directory should be the project root or admin-ui package
+
+## Validation Steps
+
+### 1. Frontend Code Quality Check
+**Location:** Run from the affected Ibexa package (e.g., `vendor/ibexa/admin-ui`)
+
+```bash
+cd vendor/ibexa/[package-name]
+yarn test           # Runs Prettier, TypeScript, ESLint
+```
+
+**What this validates:**
+- JavaScript/TypeScript syntax and type safety
+- Code formatting consistency
+- ESLint rules compliance
+- No TypeScript compilation errors
+
+**Expected result:** All tests pass with no errors
+
+### 2. Asset Build Process
+**Location:** Run from project root
+
+```bash
+cd /path/to/project-root
+yarn ibexa:dev      # Development build (faster)
+# OR
+yarn ibexa:build    # Production build (minified)
+```
+
+**What this validates:**
+- Webpack Encore compiles successfully
+- No missing dependencies
+- JavaScript bundles build correctly
+- SCSS compiles with new component styles
+- Entry points resolve properly
+
+**Expected result:** Build completes without errors, assets generated in `public/assets/ibexa/build/`
+
+### 3. Cache Clear
+```bash
+php bin/console cache:clear
+```
+
+**Purpose:** Ensures Symfony uses fresh asset manifests and templates
+
+## Common Issues and Solutions
+
+### Build Failures
+
+**Issue:** `yarn ibexa:dev` fails with module not found
+**Solution:**
+- Verify design system packages are installed
+
+**Issue:** TypeScript compilation errors
+**Solution:**
+- Run `yarn ts-test` in the package to see specific errors
+- Check type definitions for design system components
+- Verify `tsconfig.json` paths are correct
+
+## Package-Specific Notes
+
+### admin-ui Package
+- Entry points: `src/bundle/Resources/encore/ibexa.js.config.js` and `ibexa.css.config.js`
+
+## Quick Validation Script
+
+```bash
+#!/bin/bash
+# Run from project root
+
+PACKAGE_PATH="vendor/ibexa/admin-ui"  # Change as needed
+PROJECT_ROOT="/path/to/project"        # Change to actual path
+
+echo "=== Step 1: Frontend Code Quality ==="
+cd "$PROJECT_ROOT/$PACKAGE_PATH"
+yarn test || { echo "Frontend tests failed"; exit 1; }
+
+echo "=== Step 2: Build Assets ==="
+cd "$PROJECT_ROOT"
+yarn ibexa:dev || { echo "Build failed"; exit 1; }
+
+echo "=== Step 3: Clear Cache ==="
+php bin/console cache:clear
+
+echo "✅ Automated validation complete!"
+echo "👉 Now test manually in browser"
+```
+
+## Success Criteria
+- ✅ `yarn test` passes in the package
+- ✅ `yarn ibexa:dev` builds without errors
+- ✅ No console errors in browser
+- ✅ All button functionality works as before
+- ✅ Visual appearance matches design system
+- ✅ Cross-browser compatibility (if tested)
+
+## Next Steps After Validation
+1. Commit changes with descriptive message
+2. DO NOT PUSH changes to the repository
+3. DO NOT CREATE PULL REQUEST

.opencode/opencode.json

@@ -0,0 +1,60 @@
+{
+  "$schema": "https://opencode.ai/config.json",
+  "permission": {
+    "external_directory": {
+      "~/Sites/commerce-5-0-dev_19/vendor/ibexa/**": "allow",
+      "~/Sites/commerce-5-0-dev_15/vendor/ibexa/**": "allow",
+      "/Users/jakubbrzegowski/Sites/design-system/**": "allow"
+    },
+    "bash": {
+      "*": "ask",
+      "git push *": "deny",
+      "gh pr *": "deny",
+      "git remote *": "deny",
+      "git status": "allow",
+      "git diff": "allow",
+      "git add *": "allow",
+      "git commit *": "allow",
+      "ls *": "allow",
+      "php * bin/console lint:twig *": "allow",
+      "php * bin/console cache:clear *": "allow",
+      "npm run *": "allow",
+      "yarn run *": "allow",
+
+      "rg *": "allow",
+      "grep *": "allow",
+      "sort *": "allow",
+      "head *": "allow",
+      "echo *": "allow",
+      "sed *": "allow",
+      "cat *": "allow",
+      "awk *": "allow",
+      "wc *": "allow",
+      "tr *": "allow",
+      "find *": "allow",
+      "printf *": "allow",
+      "xargs *": "allow",
+      "tail *": "allow",
+      "uniq *": "allow",
+
+      "git checkout *": "allow",
+      "git log *": "allow",
+      "git branch *": "allow",
+      "git reset *": "allow",
+      "git cherry-pick *": "allow",
+      "git rev-parse *": "allow",
+      "git show *": "allow",
+      "git merge-base *": "allow",
+      "git status *": "allow",
+      "git revert *": "allow",
+      "git diff *": "allow",
+      "git grep *": "allow",
+      "git reflog *": "allow",
+      "git worktree *": "allow",
+      "git swwtich *": "allow",
+
+      "git -C *": "allow",
+      "cd *": "allow"
+    }
+  }
+}

.opencode/permissions.json

@@ -0,0 +1,24 @@
+{
+  "permissions": {
+    "allow": [
+      "Bash(git status)",
+      "Bash(git diff)",
+      "Bash(git add *)",
+      "Bash(git commit -m *)",
+      "Bash(ls -R *)",
+      "Bash(grep -r *)",
+      "Bash(cat *)",
+      "Bash(php * bin/console lint:twig *)",
+      "Bash(php * bin/console cache:clear *)",
+      "Bash(npm run *)",
+      "Bash(yarn run *)"
+    ],
+    "deny": [
+      "Bash(git push *)",
+      "Bash(gh pr *)",
+      "Bash(git remote *)",
+      "Bash(curl *)",
+      "Bash(wget *)"
+    ]
+  }
+}