@semcore/typography 5.53.0-prerelease.0 → 5.53.1-prerelease.0

package/lib/esm/style/hint.shadow.css

@@ -0,0 +1,51 @@
+SHint {
+  display: inline-block;
+  transition: all 0.15s ease-in-out;
+  text-decoration: none;
+  outline: none;
+  cursor: pointer;
+  color: var(--intergalactic-text-secondary, #6c6e79);
+
+  &[active],
+  &:active,
+  &:hover {
+    color: var(--intergalactic-text-hint-hover-active, #484a54);
+  }
+}
+
+SHint[keyboardFocused] {
+  box-shadow: var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5));
+}
+
+SHint[disabled] {
+  opacity: var(--intergalactic-disabled-opacity, 0.3);
+  cursor: default;
+  pointer-events: none; /* Disable hint interactions */
+}
+
+SAddon {
+  vertical-align: middle;
+  display: inline-flex;
+}
+
+SHint SAddon {
+  &:not(:only-child):first-child {
+    margin-right: var(--intergalactic-spacing-1x, 4px);
+  }
+
+  &:not(:only-child):last-child {
+    margin-left: var(--intergalactic-spacing-1x, 4px);
+  }
+}
+
+SText {
+  border-bottom-width: 1px;
+  border-bottom-style: dashed;
+  border-color: currentColor;
+}
+
+@media (prefers-reduced-motion) {
+  SHint {
+    transition: none;
+  }
+}

package/lib/esm/style/list.shadow.css

@@ -0,0 +1,28 @@
+SList {
+  padding: 0;
+  margin: 0;
+  list-style-type: none;
+}
+
+SContent {
+  overflow: inherit;
+  text-overflow: inherit;
+}
+
+SList SList {
+  margin-top: var(--intergalactic-spacing-2x, 8px);
+}
+
+SItem {
+  display: flex;
+}
+
+SItem + SItem {
+  margin-top: var(--intergalactic-spacing-2x, 8px);
+}
+
+SMarker {
+  margin-right: var(--intergalactic-spacing-2x, 8px);
+  color: var(--intergalactic-text-secondary, #6c6e79);
+  line-height: normal;
+}

package/lib/esm/style/text.shadow.css

@@ -0,0 +1,118 @@
+SText {
+  padding: 0;
+  margin: 0;
+}
+
+SText[size='100'] {
+  font-size: var(--intergalactic-fs-100, 12px);
+  line-height: var(--intergalactic-lh-100, 133%);
+}
+
+SText[size='200'] {
+  font-size: var(--intergalactic-fs-200, 14px);
+  line-height: var(--intergalactic-lh-200, 142%);
+}
+
+SText[size='300'] {
+  font-size: var(--intergalactic-fs-300, 16px);
+  line-height: var(--intergalactic-lh-300, 150%);
+}
+
+SText[size='400'] {
+  font-size: var(--intergalactic-fs-400, 20px);
+  line-height: var(--intergalactic-lh-400, 120%);
+}
+
+SText[size='500'] {
+  font-size: var(--intergalactic-fs-500, 24px);
+  line-height: var(--intergalactic-lh-500, 117%);
+}
+
+SText[size='600'] {
+  font-size: var(--intergalactic-fs-600, 32px);
+  line-height: var(--intergalactic-lh-600, 125%);
+}
+
+SText[size='700'] {
+  font-size: var(--intergalactic-fs-700, 36px);
+  line-height: var(--intergalactic-lh-700, 110%);
+}
+
+SText[size='800'] {
+  font-size: var(--intergalactic-fs-800, 48px);
+  line-height: var(--intergalactic-lh-800, 117%);
+}
+
+SText[noWrap] {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+SText[medium] {
+  font-weight: var(--intergalactic-medium, 500);
+}
+
+SText[semibold] {
+  font-weight: var(--intergalactic-semi-bold, 600);
+}
+
+SText[bold] {
+  font-weight: var(--intergalactic-bold, 700);
+}
+
+SText[italic] {
+  font-style: italic;
+}
+
+SText[monospace] {
+  font-family: Consolas, 'Roboto Mono', Menlo, Courier, monospace;
+}
+
+SText[uppercase] {
+  text-transform: uppercase;
+}
+
+SText[lowercase] {
+  text-transform: lowercase;
+}
+
+SText[capitalize] {
+  text-transform: capitalize;
+}
+
+SText[decoration] {
+  text-decoration: var(--decoration);
+}
+
+SText[color] {
+  color: var(--color);
+}
+
+SText[fontSize] {
+  font-size: var(--fontSize);
+}
+
+SText[lineHeight] {
+  line-height: var(--lineHeight);
+}
+
+SText[fontWeight] {
+  font-weight: var(--fontWeight);
+}
+
+SText[textAlign] {
+  text-align: var(--textAlign);
+}
+
+SText[use='primary'] {
+  color: var(--intergalactic-text-primary, #191b23);
+}
+
+SText[use='secondary'] {
+  color: var(--intergalactic-text-secondary, #6c6e79);
+}
+
+SText[disabled] {
+  opacity: var(--intergalactic-disabled-opacity, 0.3);
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@semcore/typography",
   "description": "Semrush Typography Component",
-  "version": "5.53.0-prerelease.0",
+  "version": "5.53.1-prerelease.0",
   "main": "lib/cjs/index.js",
   "module": "lib/es6/index.js",
   "typings": "lib/types/index.d.ts",
@@ -14,13 +14,13 @@
     "types": "./lib/types/index.d.ts"
   },
   "dependencies": {
-    "@semcore/utils": "4.48.2",
-    "@semcore/flex-box": "5.41.2",
-    "@semcore/icon": "4.61.0-prerelease.0",
+    "@semcore/utils": "4.48.4-prerelease.0",
+    "@semcore/flex-box": "5.41.3-prerelease.0",
+    "@semcore/icon": "4.62.0-prerelease.0",
     "csstype": "3.0.8"
   },
   "peerDependencies": {
-    "@semcore/core": "^2.17.5",
+    "@semcore/core": "^2.39.3-prerelease.0",
     "react": "16.8 - 18",
     "react-dom": "16.8 - 18"
   },