@synergy-design-system/tokens 2.4.0 → 2.5.0

package/CHANGELOG.md

@@ -1,3 +1,10 @@
+# [@synergy-design-system/tokens-v2.5.0](https://github.com/synergy-design-system/synergy-design-system/compare/tokens/2.4.0...tokens/2.5.0) (2024-07-11)
+
+
+### Features
+
+* ✨ add table stylings ([#522](https://github.com/synergy-design-system/synergy-design-system/issues/522)) ([18a030b](https://github.com/synergy-design-system/synergy-design-system/commit/18a030be92344a9f0d038e5518c8347f0fbebb4e))
+
 # [@synergy-design-system/tokens-v2.4.0](https://github.com/synergy-design-system/synergy-design-system/compare/tokens/2.3.1...tokens/2.4.0) (2024-07-01)
 
 

package/dist/js/index.d.ts

@@ -1,5 +1,5 @@
 /**
- * @synergy-design-system/tokens version 2.3.1
+ * @synergy-design-system/tokens version 2.4.0
  * SICK Global UX Foundation
  */
 

package/dist/js/index.js

@@ -1,5 +1,5 @@
 /**
- * @synergy-design-system/tokens version 2.3.1
+ * @synergy-design-system/tokens version 2.4.0
  * SICK Global UX Foundation
  */
 

package/dist/scss/_tokens.scss

@@ -1,5 +1,5 @@
 /**
- * @synergy-design-system/tokens version 2.3.1
+ * @synergy-design-system/tokens version 2.4.0
  * SICK Global UX Foundation
  */
 $SynFontSizeXSmall: var(--syn-font-size-x-small) !default;

package/dist/themes/dark.css

@@ -1,8 +1,8 @@
 /**
- * @synergy-design-system/tokens version 2.3.1
+ * @synergy-design-system/tokens version 2.4.0
  * SICK Global UX Foundation
  * Do not edit directly
- * Generated on Mon, 01 Jul 2024 07:56:14 GMT
+ * Generated on Thu, 11 Jul 2024 09:34:17 GMT
  */
 
 :root, .syn-theme-dark {

package/dist/themes/light.css

@@ -1,8 +1,8 @@
 /**
- * @synergy-design-system/tokens version 2.3.1
+ * @synergy-design-system/tokens version 2.4.0
  * SICK Global UX Foundation
  * Do not edit directly
- * Generated on Mon, 01 Jul 2024 07:56:14 GMT
+ * Generated on Thu, 11 Jul 2024 09:34:17 GMT
  */
 
 :root, .syn-theme-light {

package/package.json

@@ -18,8 +18,8 @@
     "semantic-release-monorepo": "7.0.5",
     "style-dictionary": "^3.9.2",
     "stylelint": "^16.3.1",
-    "@synergy-design-system/eslint-config-syn": "0.1.0",
-    "@synergy-design-system/stylelint-config-syn": "0.1.0"
+    "@synergy-design-system/stylelint-config-syn": "0.1.0",
+    "@synergy-design-system/eslint-config-syn": "0.1.0"
   },
   "exports": {
     ".": {
@@ -101,7 +101,7 @@
   },
   "type": "module",
   "types": "./dist/js/index.d.ts",
-  "version": "2.4.0",
+  "version": "2.5.0",
   "scripts": {
     "build": "pnpm clean && node scripts/build.js",
     "clean": "rimraf build",

package/src/figma-tokens/_docs.json

@@ -2514,6 +2514,16 @@
           "value": "Contact Form",
           "type": "text"
         }
+      },
+      "table": {
+        "title": {
+          "value": "Table",
+          "type": "text"
+        },
+        "description": {
+          "value": "These examples demonstrate the usage of the syn-table-cell component in various contexts. The examples are intended solely for illustrating how syn-table-cell can be used to style tables.",
+          "type": "text"
+        }
       }
     },
     "nav-item": {
@@ -2751,6 +2761,58 @@
           "type": "text"
         }
       }
+    },
+    "table": {
+      "default": {
+        "title": {
+          "value": "Table-cell",
+          "type": "text"
+        },
+        "description": {
+          "value": "The syn-table-cell component offers basic styling for table cells. A table can be created by combining several cell components into columns and rows.\n\n DEV: Instead of a component we have multiple classes, to apply the table styling. More complex tables, such as applying the shadow styling and adding scrolling behavior, require additional CSS and JavaScript Code. See the table templates for examples.",
+          "type": "text"
+        }
+      },
+      "header": {
+        "title": {
+          "value": "Header",
+          "type": "text"
+        },
+        "description": {
+          "value": "Use the cell header attribute to help the user identify the top of the table. Table header can be used as column header and row Header, but not at the same time.",
+          "type": "text"
+        }
+      },
+      "alternating": {
+        "title": {
+          "value": "Alternating",
+          "type": "text"
+        },
+        "description": {
+          "value": "The alternating attribute helps the user to visually separate the rows, even when scrolling horizontally, and helps to compare the data.",
+          "type": "text"
+        }
+      },
+      "border": {
+        "title": {
+          "value": "Border",
+          "type": "text"
+        },
+        "description": {
+          "value": "Use the border attribute to define different borders in a cell. Borders can also be combined.",
+          "type": "text"
+        }
+      },
+      "scroll": {
+        "title": {
+          "value": "Scrolling Behaviour",
+          "type": "text"
+        },
+        "description": {
+          "value": "If the table contains a scrolling behavior the table cell gets a shadow.",
+          "type": "text"
+        }
+      }
     }
   },
   "assets": {
@@ -3135,4 +3197,4 @@
       }
     }
   }
-}
+}