@xui/scroll-area 2.0.0-alpha.19 → 2.0.0-alpha.21

package/fesm2022/xui-scroll-area.mjs

@@ -19,8 +19,10 @@ const [injectXuiScrollAreaConfig, provideXuiScrollAreaConfig] = createXConfigTok
  */
 class XuiScrollArea {
     config = injectXuiScrollAreaConfig();
+    /** Extra classes, merged into the component's own rather than replacing them. */
     class = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
+    /** Which axis may scroll. The other one is clipped. */
     orientation = input(this.config.orientation, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
     computedClass = computed(() => xui('relative block', this.class()), /* @ts-ignore */

package/fesm2022/xui-scroll-area.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"xui-scroll-area.mjs","sources":["../../../../../../libs/ui/scroll-area/xui/src/lib/scroll-area.token.ts","../../../../../../libs/ui/scroll-area/xui/src/lib/scroll-area.ts","../../../../../../libs/ui/scroll-area/xui/src/index.ts","../../../../../../libs/ui/scroll-area/xui/src/xui-scroll-area.ts"],"sourcesContent":["import { createXConfigToken } from '@xui/core';\nimport type { XuiScrollOrientation } from './scroll-area';\n\n/**\n * Application-wide defaults for XuiScrollArea.\n *\n * Provide it once at the app root to change every scroll area without touching\n * call sites; individual inputs still override the configured value.\n */\nexport interface XuiScrollAreaConfig {\n  orientation: XuiScrollOrientation;\n}\n\nexport const [injectXuiScrollAreaConfig, provideXuiScrollAreaConfig] = createXConfigToken<XuiScrollAreaConfig>(\n  'XuiScrollAreaConfig',\n  {\n    orientation: 'vertical'\n  }\n);\n","import { ChangeDetectionStrategy, Component, computed, input, ViewEncapsulation } from '@angular/core';\nimport { xui } from '@xui/core';\nimport type { ClassValue } from 'clsx';\nimport { injectXuiScrollAreaConfig } from './scroll-area.token';\n\nexport type XuiScrollOrientation = 'vertical' | 'horizontal' | 'both';\n\n/**\n * A scroll container with slim, theme-aware scrollbars (WebKit and Firefox),\n * so overflowing content scrolls without the OS's default chrome. Give the host\n * a bound — a height for vertical scrolling, a width for horizontal.\n *\n * ```html\n * <xui-scroll-area class=\"h-72\">\n *   <p>…long content…</p>\n * </xui-scroll-area>\n * ```\n */\n@Component({\n  selector: 'xui-scroll-area',\n  template: `\n    <div [class]=\"viewportClass()\">\n      <ng-content />\n    </div>\n  `,\n  host: {\n    '[class]': 'computedClass()'\n  },\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None\n})\nexport class XuiScrollArea {\n  private readonly config = injectXuiScrollAreaConfig();\n\n  readonly class = input<ClassValue>('');\n  readonly orientation = input<XuiScrollOrientation>(this.config.orientation);\n\n  protected readonly computedClass = computed(() => xui('relative block', this.class()));\n\n  protected readonly viewportClass = computed(() => {\n    const orientation = this.orientation();\n    return xui(\n      'h-full w-full',\n      orientation === 'vertical' && 'overflow-x-hidden overflow-y-auto',\n      orientation === 'horizontal' && 'overflow-x-auto overflow-y-hidden',\n      orientation === 'both' && 'overflow-auto',\n      // Slim, themed scrollbars. Firefox uses `scrollbar-*`; WebKit uses the pseudo-elements.\n      '[scrollbar-width:thin] [scrollbar-color:var(--color-border)_transparent]',\n      '[&::-webkit-scrollbar]:h-2 [&::-webkit-scrollbar]:w-2',\n      '[&::-webkit-scrollbar-track]:bg-transparent',\n      '[&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-thumb]:bg-border',\n      'hover:[&::-webkit-scrollbar-thumb]:bg-foreground-subtle'\n    );\n  });\n}\n","import { XuiScrollArea } from './lib/scroll-area';\n\nexport * from './lib/scroll-area';\nexport * from './lib/scroll-area.token';\n\nexport const XuiScrollAreaImports = [XuiScrollArea] as const;\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;AAaO,MAAM,CAAC,yBAAyB,EAAE,0BAA0B,CAAC,GAAG,kBAAkB,CACvF,qBAAqB,EACrB;AACE,IAAA,WAAW,EAAE;AACd,CAAA;;ACVH;;;;;;;;;;AAUG;MAcU,aAAa,CAAA;IACP,MAAM,GAAG,yBAAyB,EAAE;IAE5C,KAAK,GAAG,KAAK,CAAa,EAAE;8EAAC;AAC7B,IAAA,WAAW,GAAG,KAAK,CAAuB,IAAI,CAAC,MAAM,CAAC,WAAW;oFAAC;AAExD,IAAA,aAAa,GAAG,QAAQ,CAAC,MAAM,GAAG,CAAC,gBAAgB,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC;sFAAC;AAEnE,IAAA,aAAa,GAAG,QAAQ,CAAC,MAAK;AAC/C,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,WAAW,EAAE;QACtC,OAAO,GAAG,CACR,eAAe,EACf,WAAW,KAAK,UAAU,IAAI,mCAAmC,EACjE,WAAW,KAAK,YAAY,IAAI,mCAAmC,EACnE,WAAW,KAAK,MAAM,IAAI,eAAe;;QAEzC,0EAA0E,EAC1E,uDAAuD,EACvD,6CAA6C,EAC7C,kFAAkF,EAClF,yDAAyD,CAC1D;IACH,CAAC;sFAAC;0HAtBS,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAb,uBAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,aAAa,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,iBAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAXd;;;;AAIT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;2FAOU,aAAa,EAAA,UAAA,EAAA,CAAA;kBAbzB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,iBAAiB;AAC3B,oBAAA,QAAQ,EAAE;;;;AAIT,EAAA,CAAA;AACD,oBAAA,IAAI,EAAE;AACJ,wBAAA,SAAS,EAAE;AACZ,qBAAA;oBACD,eAAe,EAAE,uBAAuB,CAAC,MAAM;oBAC/C,aAAa,EAAE,iBAAiB,CAAC;AAClC,iBAAA;;;ACzBM,MAAM,oBAAoB,GAAG,CAAC,aAAa;;ACLlD;;AAEG;;;;"}
+{"version":3,"file":"xui-scroll-area.mjs","sources":["../../../../../../libs/ui/scroll-area/xui/src/lib/scroll-area.token.ts","../../../../../../libs/ui/scroll-area/xui/src/lib/scroll-area.ts","../../../../../../libs/ui/scroll-area/xui/src/index.ts","../../../../../../libs/ui/scroll-area/xui/src/xui-scroll-area.ts"],"sourcesContent":["import { createXConfigToken } from '@xui/core';\nimport type { XuiScrollOrientation } from './scroll-area';\n\n/**\n * Application-wide defaults for XuiScrollArea.\n *\n * Provide it once at the app root to change every scroll area without touching\n * call sites; individual inputs still override the configured value.\n */\nexport interface XuiScrollAreaConfig {\n  orientation: XuiScrollOrientation;\n}\n\nexport const [injectXuiScrollAreaConfig, provideXuiScrollAreaConfig] = createXConfigToken<XuiScrollAreaConfig>(\n  'XuiScrollAreaConfig',\n  {\n    orientation: 'vertical'\n  }\n);\n","import { ChangeDetectionStrategy, Component, computed, input, ViewEncapsulation } from '@angular/core';\nimport { xui } from '@xui/core';\nimport type { ClassValue } from 'clsx';\nimport { injectXuiScrollAreaConfig } from './scroll-area.token';\n\nexport type XuiScrollOrientation = 'vertical' | 'horizontal' | 'both';\n\n/**\n * A scroll container with slim, theme-aware scrollbars (WebKit and Firefox),\n * so overflowing content scrolls without the OS's default chrome. Give the host\n * a bound — a height for vertical scrolling, a width for horizontal.\n *\n * ```html\n * <xui-scroll-area class=\"h-72\">\n *   <p>…long content…</p>\n * </xui-scroll-area>\n * ```\n */\n@Component({\n  selector: 'xui-scroll-area',\n  template: `\n    <div [class]=\"viewportClass()\">\n      <ng-content />\n    </div>\n  `,\n  host: {\n    '[class]': 'computedClass()'\n  },\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None\n})\nexport class XuiScrollArea {\n  private readonly config = injectXuiScrollAreaConfig();\n\n  /** Extra classes, merged into the component's own rather than replacing them. */\n  readonly class = input<ClassValue>('');\n  /** Which axis may scroll. The other one is clipped. */\n  readonly orientation = input<XuiScrollOrientation>(this.config.orientation);\n\n  protected readonly computedClass = computed(() => xui('relative block', this.class()));\n\n  protected readonly viewportClass = computed(() => {\n    const orientation = this.orientation();\n    return xui(\n      'h-full w-full',\n      orientation === 'vertical' && 'overflow-x-hidden overflow-y-auto',\n      orientation === 'horizontal' && 'overflow-x-auto overflow-y-hidden',\n      orientation === 'both' && 'overflow-auto',\n      // Slim, themed scrollbars. Firefox uses `scrollbar-*`; WebKit uses the pseudo-elements.\n      '[scrollbar-width:thin] [scrollbar-color:var(--color-border)_transparent]',\n      '[&::-webkit-scrollbar]:h-2 [&::-webkit-scrollbar]:w-2',\n      '[&::-webkit-scrollbar-track]:bg-transparent',\n      '[&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-thumb]:bg-border',\n      'hover:[&::-webkit-scrollbar-thumb]:bg-foreground-subtle'\n    );\n  });\n}\n","import { XuiScrollArea } from './lib/scroll-area';\n\nexport * from './lib/scroll-area';\nexport * from './lib/scroll-area.token';\n\nexport const XuiScrollAreaImports = [XuiScrollArea] as const;\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;AAaO,MAAM,CAAC,yBAAyB,EAAE,0BAA0B,CAAC,GAAG,kBAAkB,CACvF,qBAAqB,EACrB;AACE,IAAA,WAAW,EAAE;AACd,CAAA;;ACVH;;;;;;;;;;AAUG;MAcU,aAAa,CAAA;IACP,MAAM,GAAG,yBAAyB,EAAE;;IAG5C,KAAK,GAAG,KAAK,CAAa,EAAE;8EAAC;;AAE7B,IAAA,WAAW,GAAG,KAAK,CAAuB,IAAI,CAAC,MAAM,CAAC,WAAW;oFAAC;AAExD,IAAA,aAAa,GAAG,QAAQ,CAAC,MAAM,GAAG,CAAC,gBAAgB,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC;sFAAC;AAEnE,IAAA,aAAa,GAAG,QAAQ,CAAC,MAAK;AAC/C,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,WAAW,EAAE;QACtC,OAAO,GAAG,CACR,eAAe,EACf,WAAW,KAAK,UAAU,IAAI,mCAAmC,EACjE,WAAW,KAAK,YAAY,IAAI,mCAAmC,EACnE,WAAW,KAAK,MAAM,IAAI,eAAe;;QAEzC,0EAA0E,EAC1E,uDAAuD,EACvD,6CAA6C,EAC7C,kFAAkF,EAClF,yDAAyD,CAC1D;IACH,CAAC;sFAAC;0HAxBS,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAb,uBAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,aAAa,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,iBAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAXd;;;;AAIT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;2FAOU,aAAa,EAAA,UAAA,EAAA,CAAA;kBAbzB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,iBAAiB;AAC3B,oBAAA,QAAQ,EAAE;;;;AAIT,EAAA,CAAA;AACD,oBAAA,IAAI,EAAE;AACJ,wBAAA,SAAS,EAAE;AACZ,qBAAA;oBACD,eAAe,EAAE,uBAAuB,CAAC,MAAM;oBAC/C,aAAa,EAAE,iBAAiB,CAAC;AAClC,iBAAA;;;ACzBM,MAAM,oBAAoB,GAAG,CAAC,aAAa;;ACLlD;;AAEG;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xui/scroll-area",
-  "version": "2.0.0-alpha.19",
+  "version": "2.0.0-alpha.21",
   "description": "Modern Angular 22 UI Library based on TailwindCSS",
   "keywords": [
     "angular",
@@ -37,7 +37,7 @@
   },
   "peerDependencies": {
     "@angular/core": "22",
-    "@xui/core": "2.0.0-alpha.19",
+    "@xui/core": "2.0.0-alpha.21",
     "clsx": "^2.1.1"
   },
   "publishConfig": {

package/types/xui-scroll-area.d.ts

@@ -15,7 +15,9 @@ type XuiScrollOrientation = 'vertical' | 'horizontal' | 'both';
  */
 declare class XuiScrollArea {
     private readonly config;
+    /** Extra classes, merged into the component's own rather than replacing them. */
     readonly class: _angular_core.InputSignal<ClassValue>;
+    /** Which axis may scroll. The other one is clipped. */
     readonly orientation: _angular_core.InputSignal<XuiScrollOrientation>;
     protected readonly computedClass: _angular_core.Signal<string>;
     protected readonly viewportClass: _angular_core.Signal<string>;