npm - @gravity-ui/navigation - Versions diffs - 7.0.0-beta.0 → 7.0.0-beta.1 - Mend

@gravity-ui/navigation 7.0.0-beta.0 → 7.0.0-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (50) hide show

package/build/esm/components/AsideHeader/density.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { ITEM_HEIGHT, ASIDE_HEADER_ICON_SIZE, ASIDE_HEADER_COMPACT_WIDTH, ASIDE_HEADER_EXPANDED_WIDTH } from '../constants.js';
+import { HEADER_DIVIDER_HEIGHT, ASIDE_HEADER_COMPACT_WIDTH, ITEM_HEIGHT, ASIDE_HEADER_ICON_SIZE, ASIDE_HEADER_EXPANDED_WIDTH } from '../constants.js';
 const ASIDE_HEADER_DENSITY_CONFIG = {
     default: {
@@ -47,12 +47,17 @@ function getAsideHeaderDensityCssProperties(density = 'default') {
         '--_--gn-aside-header-density-item-margin-inline': `${config.itemMarginInline}px`,
         '--_--gn-aside-header-density-icon-background-size': `${config.iconBackgroundSize}px`,
         '--_--gn-aside-header-density-compact-width': `${config.compactWidth}px`,
+        '--_--gn-aside-header-density-header-divider-height': `${getAsideHeaderDecorationHeight(density)}px`,
         '--_--gn-aside-header-density-item-expanded-radius': `${config.itemExpandedRadius}px`,
         '--_--gn-aside-header-density-item-collapsed-radius': `${config.itemCollapsedRadius}px`,
         '--_--gn-aside-header-density-item-title-gap': `${config.itemTitleGap}px`,
         '--_--gn-aside-header-density-item-title-gap-end': `${config.itemTitleGapEnd}px`,
     };
 }
+function getAsideHeaderDecorationHeight(density = 'default') {
+    const { compactWidth } = getAsideHeaderDensityConfig(density);
+    return (HEADER_DIVIDER_HEIGHT * compactWidth) / ASIDE_HEADER_COMPACT_WIDTH;
+}
-export { getAsideHeaderDensityConfig, getAsideHeaderDensityCssProperties };
+export { getAsideHeaderDecorationHeight, getAsideHeaderDensityConfig, getAsideHeaderDensityCssProperties };
 //# sourceMappingURL=density.js.map

package/build/esm/components/AsideHeader/density.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"density.js","sources":["../../../../../src/components/AsideHeader/density.ts"],"sourcesContent":["import type {CSSProperties} from 'react';\n\nimport {\n ASIDE_HEADER_COMPACT_WIDTH,\n ASIDE_HEADER_EXPANDED_WIDTH,\n ASIDE_HEADER_ICON_SIZE,\n ITEM_HEIGHT,\n} from '../constants';\n\nexport type AsideHeaderMenuDensity = 'default' \| 'compact';\n\ninterface AsideHeaderDensityConfig {\n itemHeight: number;\n twoLineItemHeight: number;\n actionSize: number;\n actionItemHeight: number;\n iconSize: number;\n itemMarginInline: number;\n iconBackgroundSize: number;\n compactWidth: number;\n expandedWidth: number;\n footerItemHeight: number;\n itemExpandedRadius: number;\n itemCollapsedRadius: number;\n itemTitleGap: number;\n itemTitleGapEnd: number;\n}\n\nconst ASIDE_HEADER_DENSITY_CONFIG: Record<AsideHeaderMenuDensity, AsideHeaderDensityConfig> = {\n default: {\n itemHeight: ITEM_HEIGHT,\n twoLineItemHeight: 56,\n actionSize: 36,\n actionItemHeight: 50,\n iconSize: ASIDE_HEADER_ICON_SIZE,\n itemMarginInline: 8,\n iconBackgroundSize: 38,\n compactWidth: ASIDE_HEADER_COMPACT_WIDTH,\n expandedWidth: ASIDE_HEADER_EXPANDED_WIDTH,\n footerItemHeight: ITEM_HEIGHT,\n itemExpandedRadius: 8,\n itemCollapsedRadius: 7,\n itemTitleGap: 8,\n itemTitleGapEnd: 16,\n },\n compact: {\n itemHeight: 32,\n twoLineItemHeight: 45,\n actionSize: 32,\n actionItemHeight: 46,\n iconSize: 16,\n itemMarginInline: 6,\n iconBackgroundSize: 32,\n compactWidth: 44,\n expandedWidth: 220,\n footerItemHeight: 32,\n itemExpandedRadius: 6,\n itemCollapsedRadius: 6,\n itemTitleGap: 4,\n itemTitleGapEnd: 8,\n },\n};\n\nexport function getAsideHeaderDensityConfig(\n density: AsideHeaderMenuDensity = 'default',\n): AsideHeaderDensityConfig {\n return ASIDE_HEADER_DENSITY_CONFIG[density];\n}\n\nexport function getAsideHeaderDensityCssProperties(\n density: AsideHeaderMenuDensity = 'default',\n): CSSProperties {\n const config = getAsideHeaderDensityConfig(density);\n\n return {\n '--_--gn-aside-header-density-item-height': `${config.itemHeight}px`,\n '--_--gn-aside-header-density-action-size': `${config.actionSize}px`,\n '--_--gn-aside-header-density-icon-size': `${config.iconSize}px`,\n '--_--gn-aside-header-density-footer-item-height': `${config.footerItemHeight}px`,\n '--_--gn-aside-header-density-item-margin-inline': `${config.itemMarginInline}px`,\n '--_--gn-aside-header-density-icon-background-size': `${config.iconBackgroundSize}px`,\n '--_--gn-aside-header-density-compact-width': `${config.compactWidth}px`,\n '--_--gn-aside-header-density-item-expanded-radius': `${config.itemExpandedRadius}px`,\n '--_--gn-aside-header-density-item-collapsed-radius': `${config.itemCollapsedRadius}px`,\n '--_--gn-aside-header-density-item-title-gap': `${config.itemTitleGap}px`,\n '--_--gn-aside-header-density-item-title-gap-end': `${config.itemTitleGapEnd}px`,\n } as CSSProperties;\n}\n"],"names":[],"mappings":";;~~AA4BA~~,MAAM,2BAA2B,GAA6D;AAC1F,IAAA,OAAO,EAAE;AACL,QAAA,UAAU,EAAE,WAAW;AACvB,QAAA,iBAAiB,EAAE,EAAE;AACrB,QAAA,UAAU,EAAE,EAAE;AACd,QAAA,gBAAgB,EAAE,EAAE;AACpB,QAAA,QAAQ,EAAE,sBAAsB;AAChC,QAAA,gBAAgB,EAAE,CAAC;AACnB,QAAA,kBAAkB,EAAE,EAAE;AACtB,QAAA,YAAY,EAAE,0BAA0B;AACxC,QAAA,aAAa,EAAE,2BAA2B;AAC1C,QAAA,gBAAgB,EAAE,WAAW;AAC7B,QAAA,kBAAkB,EAAE,CAAC;AACrB,QAAA,mBAAmB,EAAE,CAAC;AACtB,QAAA,YAAY,EAAE,CAAC;AACf,QAAA,eAAe,EAAE,EAAE;AACtB,KAAA;AACD,IAAA,OAAO,EAAE;AACL,QAAA,UAAU,EAAE,EAAE;AACd,QAAA,iBAAiB,EAAE,EAAE;AACrB,QAAA,UAAU,EAAE,EAAE;AACd,QAAA,gBAAgB,EAAE,EAAE;AACpB,QAAA,QAAQ,EAAE,EAAE;AACZ,QAAA,gBAAgB,EAAE,CAAC;AACnB,QAAA,kBAAkB,EAAE,EAAE;AACtB,QAAA,YAAY,EAAE,EAAE;AAChB,QAAA,aAAa,EAAE,GAAG;AAClB,QAAA,gBAAgB,EAAE,EAAE;AACpB,QAAA,kBAAkB,EAAE,CAAC;AACrB,QAAA,mBAAmB,EAAE,CAAC;AACtB,QAAA,YAAY,EAAE,CAAC;AACf,QAAA,eAAe,EAAE,CAAC;AACrB,KAAA;CACJ;AAEe,SAAA,2BAA2B,CACvC,OAAA,GAAkC,SAAS,EAAA;AAE3C,IAAA,OAAO,2BAA2B,CAAC,OAAO,CAAC;AAC/C;AAEgB,SAAA,kCAAkC,CAC9C,OAAA,GAAkC,SAAS,EAAA;AAE3C,IAAA,MAAM,MAAM,GAAG,2BAA2B,CAAC,OAAO,CAAC;IAEnD,OAAO;AACH,QAAA,0CAA0C,EAAE,CAAA,EAAG,MAAM,CAAC,UAAU,CAAI,EAAA,CAAA;AACpE,QAAA,0CAA0C,EAAE,CAAA,EAAG,MAAM,CAAC,UAAU,CAAI,EAAA,CAAA;AACpE,QAAA,wCAAwC,EAAE,CAAA,EAAG,MAAM,CAAC,QAAQ,CAAI,EAAA,CAAA;AAChE,QAAA,iDAAiD,EAAE,CAAA,EAAG,MAAM,CAAC,gBAAgB,CAAI,EAAA,CAAA;AACjF,QAAA,iDAAiD,EAAE,CAAA,EAAG,MAAM,CAAC,gBAAgB,CAAI,EAAA,CAAA;AACjF,QAAA,mDAAmD,EAAE,CAAA,EAAG,MAAM,CAAC,kBAAkB,CAAI,EAAA,CAAA;AACrF,QAAA,4CAA4C,EAAE,CAAA,EAAG,MAAM,CAAC,YAAY,CAAI,EAAA,CAAA;AACxE,QAAA,mDAAmD,EAAE,CAAA,EAAG,MAAM,CAAC,kBAAkB,CAAI,EAAA,CAAA;AACrF,QAAA,oDAAoD,EAAE,CAAA,EAAG,MAAM,CAAC,mBAAmB,CAAI,EAAA,CAAA;AACvF,QAAA,6CAA6C,EAAE,CAAA,EAAG,MAAM,CAAC,YAAY,CAAI,EAAA,CAAA;AACzE,QAAA,iDAAiD,EAAE,CAAA,EAAG,MAAM,CAAC,eAAe,CAAI,EAAA,CAAA;KAClE;AACtB;;;;"}
1	+ {"version":3,"file":"density.js","sources":["../../../../../src/components/AsideHeader/density.ts"],"sourcesContent":["import type {CSSProperties} from 'react';\n\nimport {\n ASIDE_HEADER_COMPACT_WIDTH,\n ASIDE_HEADER_EXPANDED_WIDTH,\n ASIDE_HEADER_ICON_SIZE,\n HEADER_DIVIDER_HEIGHT,\n ITEM_HEIGHT,\n} from '../constants';\n\nexport type AsideHeaderMenuDensity = 'default' \| 'compact';\n\ninterface AsideHeaderDensityConfig {\n itemHeight: number;\n twoLineItemHeight: number;\n actionSize: number;\n actionItemHeight: number;\n iconSize: number;\n itemMarginInline: number;\n iconBackgroundSize: number;\n compactWidth: number;\n expandedWidth: number;\n footerItemHeight: number;\n itemExpandedRadius: number;\n itemCollapsedRadius: number;\n itemTitleGap: number;\n itemTitleGapEnd: number;\n}\n\nconst ASIDE_HEADER_DENSITY_CONFIG: Record<AsideHeaderMenuDensity, AsideHeaderDensityConfig> = {\n default: {\n itemHeight: ITEM_HEIGHT,\n twoLineItemHeight: 56,\n actionSize: 36,\n actionItemHeight: 50,\n iconSize: ASIDE_HEADER_ICON_SIZE,\n itemMarginInline: 8,\n iconBackgroundSize: 38,\n compactWidth: ASIDE_HEADER_COMPACT_WIDTH,\n expandedWidth: ASIDE_HEADER_EXPANDED_WIDTH,\n footerItemHeight: ITEM_HEIGHT,\n itemExpandedRadius: 8,\n itemCollapsedRadius: 7,\n itemTitleGap: 8,\n itemTitleGapEnd: 16,\n },\n compact: {\n itemHeight: 32,\n twoLineItemHeight: 45,\n actionSize: 32,\n actionItemHeight: 46,\n iconSize: 16,\n itemMarginInline: 6,\n iconBackgroundSize: 32,\n compactWidth: 44,\n expandedWidth: 220,\n footerItemHeight: 32,\n itemExpandedRadius: 6,\n itemCollapsedRadius: 6,\n itemTitleGap: 4,\n itemTitleGapEnd: 8,\n },\n};\n\nexport function getAsideHeaderDensityConfig(\n density: AsideHeaderMenuDensity = 'default',\n): AsideHeaderDensityConfig {\n return ASIDE_HEADER_DENSITY_CONFIG[density];\n}\n\nexport function getAsideHeaderDensityCssProperties(\n density: AsideHeaderMenuDensity = 'default',\n): CSSProperties {\n const config = getAsideHeaderDensityConfig(density);\n\n return {\n '--_--gn-aside-header-density-item-height': `${config.itemHeight}px`,\n '--_--gn-aside-header-density-action-size': `${config.actionSize}px`,\n '--_--gn-aside-header-density-icon-size': `${config.iconSize}px`,\n '--_--gn-aside-header-density-footer-item-height': `${config.footerItemHeight}px`,\n '--_--gn-aside-header-density-item-margin-inline': `${config.itemMarginInline}px`,\n '--_--gn-aside-header-density-icon-background-size': `${config.iconBackgroundSize}px`,\n '--_--gn-aside-header-density-compact-width': `${config.compactWidth}px`,\n '--_--gn-aside-header-density-header-divider-height': `${getAsideHeaderDecorationHeight(density)}px`,\n '--_--gn-aside-header-density-item-expanded-radius': `${config.itemExpandedRadius}px`,\n '--_--gn-aside-header-density-item-collapsed-radius': `${config.itemCollapsedRadius}px`,\n '--_--gn-aside-header-density-item-title-gap': `${config.itemTitleGap}px`,\n '--_--gn-aside-header-density-item-title-gap-end': `${config.itemTitleGapEnd}px`,\n } as CSSProperties;\n}\n\nexport function getAsideHeaderDecorationHeight(density: AsideHeaderMenuDensity = 'default') {\n const {compactWidth} = getAsideHeaderDensityConfig(density);\n\n return (HEADER_DIVIDER_HEIGHT * compactWidth) / ASIDE_HEADER_COMPACT_WIDTH;\n}\n"],"names":[],"mappings":";;AA6BA,MAAM,2BAA2B,GAA6D;AAC1F,IAAA,OAAO,EAAE;AACL,QAAA,UAAU,EAAE,WAAW;AACvB,QAAA,iBAAiB,EAAE,EAAE;AACrB,QAAA,UAAU,EAAE,EAAE;AACd,QAAA,gBAAgB,EAAE,EAAE;AACpB,QAAA,QAAQ,EAAE,sBAAsB;AAChC,QAAA,gBAAgB,EAAE,CAAC;AACnB,QAAA,kBAAkB,EAAE,EAAE;AACtB,QAAA,YAAY,EAAE,0BAA0B;AACxC,QAAA,aAAa,EAAE,2BAA2B;AAC1C,QAAA,gBAAgB,EAAE,WAAW;AAC7B,QAAA,kBAAkB,EAAE,CAAC;AACrB,QAAA,mBAAmB,EAAE,CAAC;AACtB,QAAA,YAAY,EAAE,CAAC;AACf,QAAA,eAAe,EAAE,EAAE;AACtB,KAAA;AACD,IAAA,OAAO,EAAE;AACL,QAAA,UAAU,EAAE,EAAE;AACd,QAAA,iBAAiB,EAAE,EAAE;AACrB,QAAA,UAAU,EAAE,EAAE;AACd,QAAA,gBAAgB,EAAE,EAAE;AACpB,QAAA,QAAQ,EAAE,EAAE;AACZ,QAAA,gBAAgB,EAAE,CAAC;AACnB,QAAA,kBAAkB,EAAE,EAAE;AACtB,QAAA,YAAY,EAAE,EAAE;AAChB,QAAA,aAAa,EAAE,GAAG;AAClB,QAAA,gBAAgB,EAAE,EAAE;AACpB,QAAA,kBAAkB,EAAE,CAAC;AACrB,QAAA,mBAAmB,EAAE,CAAC;AACtB,QAAA,YAAY,EAAE,CAAC;AACf,QAAA,eAAe,EAAE,CAAC;AACrB,KAAA;CACJ;AAEe,SAAA,2BAA2B,CACvC,OAAA,GAAkC,SAAS,EAAA;AAE3C,IAAA,OAAO,2BAA2B,CAAC,OAAO,CAAC;AAC/C;AAEgB,SAAA,kCAAkC,CAC9C,OAAA,GAAkC,SAAS,EAAA;AAE3C,IAAA,MAAM,MAAM,GAAG,2BAA2B,CAAC,OAAO,CAAC;IAEnD,OAAO;AACH,QAAA,0CAA0C,EAAE,CAAA,EAAG,MAAM,CAAC,UAAU,CAAI,EAAA,CAAA;AACpE,QAAA,0CAA0C,EAAE,CAAA,EAAG,MAAM,CAAC,UAAU,CAAI,EAAA,CAAA;AACpE,QAAA,wCAAwC,EAAE,CAAA,EAAG,MAAM,CAAC,QAAQ,CAAI,EAAA,CAAA;AAChE,QAAA,iDAAiD,EAAE,CAAA,EAAG,MAAM,CAAC,gBAAgB,CAAI,EAAA,CAAA;AACjF,QAAA,iDAAiD,EAAE,CAAA,EAAG,MAAM,CAAC,gBAAgB,CAAI,EAAA,CAAA;AACjF,QAAA,mDAAmD,EAAE,CAAA,EAAG,MAAM,CAAC,kBAAkB,CAAI,EAAA,CAAA;AACrF,QAAA,4CAA4C,EAAE,CAAA,EAAG,MAAM,CAAC,YAAY,CAAI,EAAA,CAAA;AACxE,QAAA,oDAAoD,EAAE,CAAG,EAAA,8BAA8B,CAAC,OAAO,CAAC,CAAI,EAAA,CAAA;AACpG,QAAA,mDAAmD,EAAE,CAAA,EAAG,MAAM,CAAC,kBAAkB,CAAI,EAAA,CAAA;AACrF,QAAA,oDAAoD,EAAE,CAAA,EAAG,MAAM,CAAC,mBAAmB,CAAI,EAAA,CAAA;AACvF,QAAA,6CAA6C,EAAE,CAAA,EAAG,MAAM,CAAC,YAAY,CAAI,EAAA,CAAA;AACzE,QAAA,iDAAiD,EAAE,CAAA,EAAG,MAAM,CAAC,eAAe,CAAI,EAAA,CAAA;KAClE;AACtB;AAEgB,SAAA,8BAA8B,CAAC,OAAA,GAAkC,SAAS,EAAA;IACtF,MAAM,EAAC,YAAY,EAAC,GAAG,2BAA2B,CAAC,OAAO,CAAC;AAE3D,IAAA,OAAO,CAAC,qBAAqB,GAAG,YAAY,IAAI,0BAA0B;AAC9E;;;;"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/navigation",
-  "version": "7.0.0-beta.0",
+  "version": "7.0.0-beta.1",
   "description": "Gravity UI Navigation components",
   "license": "MIT",
   "repository": {