@arclux/arc-ui 1.5.0 → 1.5.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arclux/arc-ui",
-  "version": "1.5.0",
+  "version": "1.5.2",
   "description": "ARC UI — Lit Web Components implementing the Arclight design system.",
   "type": "module",
   "main": "src/index.js",

package/src/content/accordion.js

@@ -55,10 +55,13 @@ export class ArcAccordion extends LitElement {
 
       .accordion__chevron {
         color: var(--text-muted);
-        font-size: var(--text-sm);
+        width: 18px;
+        height: 18px;
         transition: transform 300ms ease;
         flex-shrink: 0;
-        display: inline-block;
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
       }
 
       .accordion__trigger[aria-expanded="true"] .accordion__chevron {
@@ -136,7 +139,9 @@ export class ArcAccordion extends LitElement {
                 @click=${() => this._toggle(i)}
               >
                 <span>${item.question}</span>
-                <span class="accordion__chevron">&#9662;</span>
+                <svg class="accordion__chevron" viewBox="0 0 16 16" fill="none" aria-hidden="true">
+                  <path d="M4 6l4 4 4-4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+                </svg>
               </button>
               <div class="accordion__content ${isOpen ? 'is-open' : ''}">
                 <div class="accordion__body">

package/src/content/data-table.js

@@ -5,8 +5,8 @@ import './column.js';
 export class ArcDataTable extends LitElement {
   static properties = {
     rows:          { type: Array },
-    sortable:      { type: Boolean },
-    selectable:    { type: Boolean },
+    sortable:      { type: Boolean, reflect: true },
+    selectable:    { type: Boolean, reflect: true },
     sortColumn:    { type: String, attribute: 'sort-column' },
     sortDirection: { type: String, reflect: true, attribute: 'sort-direction' },
     _columns:      { state: true },

package/src/feedback/alert.js

@@ -7,7 +7,7 @@ export class ArcAlert extends LitElement {
   static properties = {
     variant:     { type: String, reflect: true },
     compact:     { type: Boolean, reflect: true },
-    dismissible: { type: Boolean },
+    dismissible: { type: Boolean, reflect: true },
     heading:     { type: String },
   };
 

package/src/feedback/modal.js

@@ -7,7 +7,7 @@ export class ArcModal extends LitElement {
     heading:    { type: String },
     size:       { type: String, reflect: true },
     fullscreen: { type: Boolean, reflect: true },
-    closable:   { type: Boolean },
+    closable:   { type: Boolean, reflect: true },
   };
 
   static styles = [

package/src/input/file-upload.js

@@ -4,7 +4,7 @@ import { tokenStyles } from '../shared-styles.js';
 export class ArcFileUpload extends LitElement {
   static properties = {
     accept:    { type: String },
-    multiple:  { type: Boolean },
+    multiple:  { type: Boolean, reflect: true },
     maxSize:   { type: Number, attribute: 'max-size' },
     disabled:  { type: Boolean, reflect: true },
     _files:    { state: true },

package/src/input/form.js

@@ -5,10 +5,10 @@ export class ArcForm extends LitElement {
   static properties = {
     action:       { type: String },
     method:       { type: String },
-    novalidate:   { type: Boolean },
+    novalidate:   { type: Boolean, reflect: true },
     loading:      { type: Boolean, reflect: true },
     disabled:     { type: Boolean, reflect: true },
-    errorSummary: { type: Boolean, attribute: 'error-summary' },
+    errorSummary: { type: Boolean, reflect: true, attribute: 'error-summary' },
     _errors:      { state: true },
   };
 

package/src/input/input.js

@@ -13,10 +13,10 @@ export class ArcInput extends LitElement {
     placeholder: { type: String },
     value:       { type: String },
     disabled:    { type: Boolean, reflect: true },
-    required:    { type: Boolean },
+    required:    { type: Boolean, reflect: true },
     error:       { type: String },
     size:        { type: String, reflect: true },
-    multiline:   { type: Boolean },
+    multiline:   { type: Boolean, reflect: true },
     rows:        { type: Number },
     _hasPrefix:  { state: true },
     _hasSuffix:  { state: true },

package/src/navigation/link.js

@@ -7,7 +7,7 @@ export class ArcLink extends LitElement {
     variant:   { type: String, reflect: true },
     underline: { type: String, reflect: true },
     active:    { type: Boolean, reflect: true },
-    external:  { type: Boolean },
+    external:  { type: Boolean, reflect: true },
   };
 
   static styles = [

package/src/navigation/scroll-to-top.js

@@ -7,7 +7,7 @@ import { tokenStyles } from '../shared-styles.js';
 export class ArcScrollToTop extends LitElement {
   static properties = {
     threshold: { type: Number },
-    smooth:    { type: Boolean },
+    smooth:    { type: Boolean, reflect: true },
     position:  { type: String, reflect: true },
     offset:    { type: String },
     _visible:  { state: true },

package/src/shared-styles.js

@@ -11,6 +11,12 @@ import { css } from 'lit';
  * as fallback defaults.
  */
 export const tokenStyles = css`
+  *, *::before, *::after {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+  }
+
   :host {
     --font-body: 'Host Grotesk', system-ui, sans-serif;
     --font-accent: 'Tektur', system-ui, sans-serif;