@lumx/core 3.0.7 → 3.1.0

package/style-dictionary/properties/components/button.json

@@ -0,0 +1,206 @@
+{
+    "button": {
+        "height": "{size.m}",
+        "border-radius": "{border-radius}",
+        "emphasis-high": {
+            "state-default": {
+                "padding": {
+                    "horizontal": "{spacing.unit.big}"
+                },
+                "border-width": { "value": "0" },
+                "theme-light": {
+                    "background-color": "{color.primary.N}",
+                    "color": "{color.light.N}",
+                    "border-color": { "value": "transparent" }
+                },
+                "theme-dark": {
+                    "background-color": "{color.light.N}",
+                    "color": "{color.primary.N}",
+                    "border-color": { "value": "transparent" }
+                }
+            },
+            "state-hover": {
+                "padding": {
+                    "horizontal": "{spacing.unit.big}"
+                },
+                "border-width": { "value": "0" },
+                "theme-light": {
+                    "background-color": "{color.primary.D1}",
+                    "color": "{color.light.N}",
+                    "border-color": { "value": "transparent" }
+                },
+                "theme-dark": {
+                    "background-color": "{color.light.L1}",
+                    "color": "{color.primary.N}",
+                    "border-color": { "value": "transparent" }
+                }
+            },
+            "state-active": {
+                "padding": {
+                    "horizontal": "{spacing.unit.big}"
+                },
+                "border-width": { "value": "0" },
+                "theme-light": {
+                    "background-color": "{color.primary.D2}",
+                    "color": "{color.light.N}",
+                    "border-color": { "value": "transparent" }
+                },
+                "theme-dark": {
+                    "background-color": "{color.light.L2}",
+                    "color": "{color.primary.N}",
+                    "border-color": { "value": "transparent" }
+                }
+            }
+        },
+        "emphasis-medium": {
+            "state-default": {
+                "padding": {
+                    "horizontal": "{spacing.unit.big}"
+                },
+                "border-width": { "value": "0" },
+                "theme-light": {
+                    "background-color": "{color.dark.L5}",
+                    "color": "{color.dark.L1}",
+                    "border-color": { "value": "transparent" }
+                },
+                "theme-dark": {
+                    "background-color": "{color.light.L5}",
+                    "color": "{color.light.N}",
+                    "border-color": { "value": "transparent" }
+                }
+            },
+            "state-hover": {
+                "padding": {
+                    "horizontal": "{spacing.unit.big}"
+                },
+                "border-width": { "value": "0" },
+                "theme-light": {
+                    "background-color": "{color.dark.L4}",
+                    "color": "{color.dark.L1}",
+                    "border-color": { "value": "transparent" }
+                },
+                "theme-dark": {
+                    "background-color": "{color.light.L4}",
+                    "color": "{color.light.N}",
+                    "border-color": { "value": "transparent" }
+                }
+            },
+            "state-active": {
+                "padding": {
+                    "horizontal": "{spacing.unit.big}"
+                },
+                "border-width": { "value": "0" },
+                "theme-light": {
+                    "background-color": "{color.dark.L3}",
+                    "color": "{color.dark.L1}",
+                    "border-color": { "value": "transparent" }
+                },
+                "theme-dark": {
+                    "background-color": "{color.light.L3}",
+                    "color": "{color.light.N}",
+                    "border-color": { "value": "transparent" }
+                }
+            }
+        },
+        "emphasis-low": {
+            "state-default": {
+                "padding": {
+                    "horizontal": "{spacing.unit.regular}"
+                },
+                "border-width": { "value": "0" },
+                "theme-light": {
+                    "background-color": { "value": "transparent" },
+                    "color": "{color.dark.L1}",
+                    "border-color": { "value": "transparent" }
+                },
+                "theme-dark": {
+                    "background-color": { "value": "transparent" },
+                    "color": "{color.light.N}",
+                    "border-color": { "value": "transparent" }
+                }
+            },
+            "state-hover": {
+                "padding": {
+                    "horizontal": "{spacing.unit.regular}"
+                },
+                "border-width": { "value": "0" },
+                "theme-light": {
+                    "background-color": "{color.dark.L5}",
+                    "color": "{color.dark.L1}",
+                    "border-color": { "value": "transparent" }
+                },
+                "theme-dark": {
+                    "background-color": "{color.light.L5}",
+                    "color": "{color.light.N}",
+                    "border-color": { "value": "transparent" }
+                }
+            },
+            "state-active": {
+                "padding": {
+                    "horizontal": "{spacing.unit.regular}"
+                },
+                "border-width": { "value": "0" },
+                "theme-light": {
+                    "background-color": "{color.dark.L4}",
+                    "color": "{color.dark.L1}",
+                    "border-color": { "value": "transparent" }
+                },
+                "theme-dark": {
+                    "background-color": "{color.light.L4}",
+                    "color": "{color.light.N}",
+                    "border-color": { "value": "transparent" }
+                }
+            }
+        },
+        "emphasis-selected": {
+            "state-default": {
+                "padding": {
+                    "horizontal": "{spacing.unit.big}"
+                },
+                "border-width": { "value": "0" },
+                "theme-light": {
+                    "background-color": "{color.primary.L5}",
+                    "color": "{color.primary.D2}",
+                    "border-color": { "value": "transparent" }
+                },
+                "theme-dark": {
+                    "background-color": "{color.light.L3}",
+                    "color": "{color.light.N}",
+                    "border-color": { "value": "transparent" }
+                }
+            },
+            "state-hover": {
+                "padding": {
+                    "horizontal": "{spacing.unit.big}"
+                },
+                "border-width": { "value": "0" },
+                "theme-light": {
+                    "background-color": "{color.primary.L4}",
+                    "color": "{color.primary.D2}",
+                    "border-color": { "value": "transparent" }
+                },
+                "theme-dark": {
+                    "background-color": "{color.light.L4}",
+                    "color": "{color.light.N}",
+                    "border-color": { "value": "transparent" }
+                }
+            },
+            "state-active": {
+                "padding": {
+                    "horizontal": "{spacing.unit.big}"
+                },
+                "border-width": { "value": "0" },
+                "theme-light": {
+                    "background-color": "{color.primary.L3}",
+                    "color": "{color.primary.D2}",
+                    "border-color": { "value": "transparent" }
+                },
+                "theme-dark": {
+                    "background-color": "{color.light.L5}",
+                    "color": "{color.light.N}",
+                    "border-color": { "value": "transparent" }
+                }
+            }
+        }
+    }
+}

package/style-dictionary/properties/components/material.json

@@ -0,0 +1,64 @@
+{
+    "material": {
+        "button": {
+            "text-transform": { "value": "none" },
+            "variant-icon-border-radius": {}
+        },
+        "checkbox": {
+            "wrapper-size": { "value": "20px" },
+            "control-size": { "value": "16px" }
+        },
+        "chip": {
+            "size-m": {
+                "height": { "value": "{size.m.value}" },
+                "border-radius": { "value": "18px" },
+                "padding-vertical": { "value": "{spacing.unit.big.value}" }
+            },
+            "size-s": {
+                "height": { "value": "{size.s.value}" },
+                "border-radius": { "value": "12px" },
+                "padding-vertical": { "value": "{spacing.unit.medium.value}" }
+            }
+        },
+        "input-helper": "{typography.interface.caption}",
+        "input-label": "{typography.interface.body1}",
+        "progress": {
+            "bounce": { "value": "block" },
+            "rotate": { "value": "none" }
+        },
+        "radio-button": {
+            "wrapper-size": { "value": "20px" },
+            "control-size": { "value": "16px" },
+            "indicator-size": { "value": "8px" }
+        },
+        "switch": {
+            "wrapper": {
+                "width": { "value": "30px" },
+                "height": { "value": "20px" }
+            },
+            "control": {
+                "width": { "value": "30px" },
+                "height": { "value": "16px" }
+            },
+            "indicator": {
+                "size": { "value": "8px" },
+                "offset": { "value": "4px" }
+            }
+        },
+        "text-field": {
+            "padding": {
+                "top": { "value": "0" },
+                "bottom": { "value": "0" }
+            },
+            "header": {
+                "wrapper": {
+                    "margin-bottom": { "value": "{spacing.unit.regular.value}" }
+                },
+                "label": "{typography.interface.body1}"
+            },
+            "input": {
+                "content": "{typography.interface.body1}"
+            }
+        }
+    }
+}

package/style-dictionary/properties/components/navigation.json

@@ -0,0 +1,207 @@
+{
+    "navigation": {
+        "item": {
+            "padding": {
+                "horizontal": "{spacing.unit.regular}"
+            },
+            "min-height": "{size.m}",
+            "border-radius": "{border-radius}",
+            "emphasis-low": {
+                "state-default": {
+                    "border": {
+                        "top": {
+                            "width": { "value": "0" }
+                        },
+                        "right": {
+                            "width": { "value": "0" }
+                        },
+                        "bottom": {
+                            "width": { "value": "0" }
+                        },
+                        "left": {
+                            "width": { "value": "0" }
+                        }
+                    },
+                    "theme-light": {
+                        "background-color": { "value": "transparent" },
+                        "border-color": "{color.dark.L5}",
+                        "icon-color": "{color.dark.L1}",
+                        "label-color": "{color.dark.N}",
+                        "chevron-background-color": { "value": "transparent" },
+                        "chevron-color": "{color.dark.L1}"
+                    },
+                    "theme-dark": {
+                        "background-color": { "value": "transparent" },
+                        "border-color": "{color.light.L5}",
+                        "icon-color": "{color.light.N}",
+                        "label-color": "{color.light.N}",
+                        "chevron-background-color": { "value": "transparent" },
+                        "chevron-color": "{color.light.N}"
+                    }
+                },
+                "state-hover": {
+                    "border": {
+                        "top": {
+                            "width": { "value": "0" }
+                        },
+                        "right": {
+                            "width": { "value": "0" }
+                        },
+                        "bottom": {
+                            "width": { "value": "0" }
+                        },
+                        "left": {
+                            "width": { "value": "0" }
+                        }
+                    },
+                    "theme-light": {
+                        "background-color": "{color.dark.L5}",
+                        "border-color": "{color.dark.L5}",
+                        "icon-color": "{color.dark.L1}",
+                        "label-color": "{color.dark.N}",
+                        "chevron-background-color": "{color.dark.L5}",
+                        "chevron-color": "{color.dark.L1}"
+                    },
+                    "theme-dark": {
+                        "background-color": "{color.light.L5}",
+                        "border-color": "{color.light.L5}",
+                        "icon-color": "{color.light.N}",
+                        "label-color": "{color.light.N}",
+                        "chevron-background-color": "{color.light.L5}",
+                        "chevron-color": "{color.light.N}"
+                    }
+                },
+                "state-active": {
+                    "border": {
+                        "top": {
+                            "width": { "value": "0" }
+                        },
+                        "right": {
+                            "width": { "value": "0" }
+                        },
+                        "bottom": {
+                            "width": { "value": "0" }
+                        },
+                        "left": {
+                            "width": { "value": "0" }
+                        }
+                    },
+                    "theme-light": {
+                        "background-color": "{color.dark.L4}",
+                        "border-color": "{color.dark.L5}",
+                        "icon-color": "{color.dark.L1}",
+                        "label-color": "{color.dark.N}",
+                        "chevron-background-color": "{color.dark.L4}",
+                        "chevron-color": "{color.dark.L1}"
+                    },
+                    "theme-dark": {
+                        "background-color": "{color.light.L4}",
+                        "border-color": "{color.light.L5}",
+                        "icon-color": "{color.light.N}",
+                        "label-color": "{color.light.N}",
+                        "chevron-background-color": "{color.light.L4}",
+                        "chevron-color": "{color.light.N}"
+                    }
+                }
+            },
+            "emphasis-selected": {
+                "state-default": {
+                    "border": {
+                        "top": {
+                            "width": { "value": "0" }
+                        },
+                        "right": {
+                            "width": { "value": "0" }
+                        },
+                        "bottom": {
+                            "width": { "value": "0" }
+                        },
+                        "left": {
+                            "width": { "value": "0" }
+                        }
+                    },
+                    "theme-light": {
+                        "background-color": "{color.primary.L5}",
+                        "border-color": "{color.primary.N}",
+                        "icon-color": "{color.primary.D2}",
+                        "label-color": "{color.primary.D2}",
+                        "chevron-background-color": { "value": "transparent" },
+                        "chevron-color": "{color.primary.D2}"
+                    },
+                    "theme-dark": {
+                        "background-color": "{color.light.L3}",
+                        "border-color": "{color.light.L5}",
+                        "icon-color": "{color.light.N}",
+                        "label-color": "{color.light.N}",
+                        "chevron-background-color": { "value": "transparent" },
+                        "chevron-color": "{color.light.N}"
+                    }
+                },
+                "state-hover": {
+                    "border": {
+                        "top": {
+                            "width": { "value": "0" }
+                        },
+                        "right": {
+                            "width": { "value": "0" }
+                        },
+                        "bottom": {
+                            "width": { "value": "0" }
+                        },
+                        "left": {
+                            "width": { "value": "0" }
+                        }
+                    },
+                    "theme-light": {
+                        "background-color": "{color.primary.L4}",
+                        "border-color": "{color.primary.N}",
+                        "icon-color": "{color.primary.D2}",
+                        "label-color": "{color.primary.D2}",
+                        "chevron-background-color": "{color.primary.L4}",
+                        "chevron-color": "{color.primary.D2}"
+                    },
+                    "theme-dark": {
+                        "background-color": "{color.light.L4}",
+                        "border-color": "{color.light.L5}",
+                        "icon-color": "{color.light.N}",
+                        "label-color": "{color.light.N}",
+                        "chevron-background-color": "{color.light.L4}",
+                        "chevron-color": "{color.light.N}"
+                    }
+                },
+                "state-active": {
+                    "border": {
+                        "top": {
+                            "width": { "value": "0" }
+                        },
+                        "right": {
+                            "width": { "value": "0" }
+                        },
+                        "bottom": {
+                            "width": { "value": "0" }
+                        },
+                        "left": {
+                            "width": { "value": "0" }
+                        }
+                    },
+                    "theme-light": {
+                        "background-color": "{color.primary.L3}",
+                        "border-color": "{color.primary.N}",
+                        "icon-color": "{color.primary.D2}",
+                        "label-color": "{color.primary.D2}",
+                        "chevron-background-color": "{color.primary.L3}",
+                        "chevron-color": "{color.primary.D2}"
+                    },
+                    "theme-dark": {
+                        "background-color": "{color.light.L5}",
+                        "border-color": "{color.light.L5}",
+                        "icon-color": "{color.light.N}",
+                        "label-color": "{color.light.N}",
+                        "chevron-background-color": "{color.light.L5}",
+                        "chevron-color": "{color.light.N}"
+                    }
+                }
+            }
+        }
+    }
+}

package/style-dictionary/properties/components/tabs.json

@@ -0,0 +1,168 @@
+{
+    "tabs": {
+        "link": {
+            "height": { "value": "48px" },
+            "border-radius": { "value": "0" },
+            "emphasis-low": {
+                "state-default": {
+                    "border": {
+                        "top": {
+                            "width": { "value": "0" }
+                        },
+                        "right": {
+                            "width": { "value": "0" }
+                        },
+                        "bottom": {
+                            "width": { "value": "2px" }
+                        },
+                        "left": {
+                            "width": { "value": "0" }
+                        }
+                    },
+                    "theme-light": {
+                        "background-color": { "value": "transparent" },
+                        "color": "{color.dark.L1}",
+                        "border-color": "{color.dark.L5}"
+                    },
+                    "theme-dark": {
+                        "background-color": { "value": "transparent" },
+                        "color": "{color.light.N}",
+                        "border-color": "{color.light.L5}"
+                    }
+                },
+                "state-hover": {
+                    "border": {
+                        "top": {
+                            "width": { "value": "0" }
+                        },
+                        "right": {
+                            "width": { "value": "0" }
+                        },
+                        "bottom": {
+                            "width": { "value": "2px" }
+                        },
+                        "left": {
+                            "width": { "value": "0" }
+                        }
+                    },
+                    "theme-light": {
+                        "background-color": "{color.dark.L5}",
+                        "color": "{color.dark.L1}",
+                        "border-color": "{color.dark.L5}"
+                    },
+                    "theme-dark": {
+                        "background-color": "{color.light.L5}",
+                        "color": "{color.light.N}",
+                        "border-color": "{color.light.L5}"
+                    }
+                },
+                "state-active": {
+                    "border": {
+                        "top": {
+                            "width": { "value": "0" }
+                        },
+                        "right": {
+                            "width": { "value": "0" }
+                        },
+                        "bottom": {
+                            "width": { "value": "2px" }
+                        },
+                        "left": {
+                            "width": { "value": "0" }
+                        }
+                    },
+                    "theme-light": {
+                        "background-color": "{color.dark.L4}",
+                        "color": "{color.dark.L1}",
+                        "border-color": "{color.dark.L5}"
+                    },
+                    "theme-dark": {
+                        "background-color": "{color.light.L4}",
+                        "color": "{color.light.N}",
+                        "border-color": "{color.light.L5}"
+                    }
+                }
+            },
+            "emphasis-selected": {
+                "state-default": {
+                    "border": {
+                        "top": {
+                            "width": { "value": "0" }
+                        },
+                        "right": {
+                            "width": { "value": "0" }
+                        },
+                        "bottom": {
+                            "width": { "value": "2px" }
+                        },
+                        "left": {
+                            "width": { "value": "0" }
+                        }
+                    },
+                    "theme-light": {
+                        "background-color": { "value": "transparent" },
+                        "color": "{color.dark.L1}",
+                        "border-color": "{color.primary.N}"
+                    },
+                    "theme-dark": {
+                        "background-color": { "value": "transparent" },
+                        "color": "{color.light.N}",
+                        "border-color": "{color.light.N}"
+                    }
+                },
+                "state-hover": {
+                    "border": {
+                        "top": {
+                            "width": { "value": "0" }
+                        },
+                        "right": {
+                            "width": { "value": "0" }
+                        },
+                        "bottom": {
+                            "width": { "value": "2px" }
+                        },
+                        "left": {
+                            "width": { "value": "0" }
+                        }
+                    },
+                    "theme-light": {
+                        "background-color": "{color.dark.L5}",
+                        "color": "{color.dark.L1}",
+                        "border-color": "{color.primary.N}"
+                    },
+                    "theme-dark": {
+                        "background-color": "{color.light.L5}",
+                        "color": "{color.light.N}",
+                        "border-color": "{color.light.N}"
+                    }
+                },
+                "state-active": {
+                    "border": {
+                        "top": {
+                            "width": { "value": "0" }
+                        },
+                        "right": {
+                            "width": { "value": "0" }
+                        },
+                        "bottom": {
+                            "width": { "value": "2px" }
+                        },
+                        "left": {
+                            "width": { "value": "0" }
+                        }
+                    },
+                    "theme-light": {
+                        "background-color": "{color.dark.L4}",
+                        "color": "{color.dark.L1}",
+                        "border-color": "{color.primary.N}"
+                    },
+                    "theme-dark": {
+                        "background-color": "{color.light.L4}",
+                        "color": "{color.light.N}",
+                        "border-color": "{color.light.N}"
+                    }
+                }
+            }
+        }
+    }
+}