@operato/gantt 8.0.0-beta.0 → 8.0.0-beta.2

package/CHANGELOG.md

@@ -3,6 +3,24 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [8.0.0-beta.2](https://github.com/hatiolab/operato/compare/v8.0.0-beta.1...v8.0.0-beta.2) (2025-01-08)
+
+
+### :bug: Bug Fix
+
+* typo .npmignore ([d9c0c8c](https://github.com/hatiolab/operato/commit/d9c0c8c79abc688c3c2cfb6c37fcb689483a5977))
+
+
+
+## [8.0.0-beta.1](https://github.com/hatiolab/operato/compare/v8.0.0-beta.0...v8.0.0-beta.1) (2025-01-08)
+
+
+### :bug: Bug Fix
+
+* missing .npmignore ([be05985](https://github.com/hatiolab/operato/commit/be05985abfae4af53501f718dd52932099f7fbcb))
+
+
+
 ## [8.0.0-beta.0](https://github.com/hatiolab/operato/compare/v8.0.0-alpha.56...v8.0.0-beta.0) (2025-01-07)
 
 **Note:** Version bump only for package @operato/gantt

package/package.json

@@ -2,7 +2,7 @@
   "name": "@operato/gantt",
   "description": "Webcomponents for gantt chart following open-wc recommendations",
   "author": "heartyoh@hatiolab.com",
-  "version": "8.0.0-beta.0",
+  "version": "8.0.0-beta.2",
   "main": "dist/src/index.js",
   "module": "dist/src/index.js",
   "license": "MIT",
@@ -42,9 +42,9 @@
     }
   },
   "dependencies": {
-    "@operato/i18n": "^8.0.0-beta.0",
-    "@operato/styles": "^8.0.0-beta.0",
-    "@operato/utils": "^8.0.0-beta.0",
+    "@operato/i18n": "^8.0.0-beta.2",
+    "@operato/styles": "^8.0.0-beta.2",
+    "@operato/utils": "^8.0.0-beta.2",
     "d3": "^7.8.5",
     "d3-time-format": "^4.1.0",
     "i18next": "^23.11.5",
@@ -85,5 +85,5 @@
       "prettier --write"
     ]
   },
-  "gitHead": "c4e9cc245659d050a9ffd66542083a6daad4bcb9"
+  "gitHead": "ee1b5124995accb99272d3b5854f3df1d8746dda"
 }

package/.editorconfig

@@ -1,29 +0,0 @@
-# EditorConfig helps developers define and maintain consistent
-# coding styles between different editors and IDEs
-# editorconfig.org
-
-root = true
-
-
-[*]
-
-# Change these settings to your own preference
-indent_style = space
-indent_size = 2
-
-# We recommend you to keep these unchanged
-end_of_line = lf
-charset = utf-8
-trim_trailing_whitespace = true
-insert_final_newline = true
-
-[*.md]
-trim_trailing_whitespace = false
-
-[*.json]
-indent_size = 2
-
-[*.{html,js,md}]
-block_comment_start = /**
-block_comment = *
-block_comment_end = */

package/.storybook/main.js

@@ -1,3 +0,0 @@
-module.exports = {
-  stories: ['../dist/stories/**/*.stories.{js,md,mdx}']
-}

package/.storybook/preview.js

@@ -1,52 +0,0 @@
-import { i18next } from '@operato/i18n'
-
-export const globalTypes = {
-  locale: {
-    name: 'Locale',
-    description: 'Internationalization locale',
-    toolbar: {
-      icon: 'globe',
-      items: [
-        { value: 'en', right: '🇺🇸', title: 'English' },
-        { value: 'ko', right: '🇰🇷', title: '한국어' },
-        { value: 'zh', right: '🇨🇳', title: '中文' },
-        { value: 'ja', right: '🇯🇵', title: '日本語' },
-        { value: 'ms', right: '🇲🇾', title: 'Bahasa Melayu' }
-      ],
-      showName: true
-    }
-  },
-  theme: {
-    name: 'Theme',
-    description: 'Global theme for components',
-    toolbar: {
-      icon: 'paintbrush',
-      items: [
-        { value: 'light', title: 'Light' },
-        { value: 'dark', title: 'Dark' }
-      ],
-      showName: true
-    }
-  }
-}
-
-export const decorators = [
-  (Story, context) => {
-    const { locale, theme } = context.globals
-
-    if (locale) {
-      i18next.changeLanguage(locale)
-    }
-
-    // Set the theme class for the document
-    if (theme === 'dark') {
-      document.documentElement.classList.add('dark')
-      document.documentElement.classList.remove('light')
-    } else {
-      document.documentElement.classList.add('light')
-      document.documentElement.classList.remove('dark')
-    }
-
-    return Story()
-  }
-]

package/.storybook/server.mjs

@@ -1,8 +0,0 @@
-import { storybookPlugin } from '@web/dev-server-storybook'
-import baseConfig from '../web-dev-server.config.mjs'
-
-export default /** @type {import('@web/dev-server').DevServerConfig} */ ({
-  ...baseConfig,
-  open: '/',
-  plugins: [storybookPlugin({ type: 'web-components' }), ...baseConfig.plugins]
-})

package/demo/index.html

@@ -1,22 +0,0 @@
-<!DOCTYPE html>
-<html lang="en-GB">
-  <head>
-    <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1" />
-    <style>
-      body {
-        background: #fafafa;
-      }
-
-      a {
-        display: block;
-      }
-    </style>
-    <link href="/themes/app-theme.css" rel="stylesheet" />
-    <link href="/themes/input-theme.css" rel="stylesheet" />
-    <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
-  </head>
-  <body>
-    <a href="./index-select.html">select</a>
-  </body>
-</html>

package/src/draw-time-scale-header.ts

@@ -1,142 +0,0 @@
-import * as d3 from 'd3'
-import { TimeScale } from './types'
-
-export function drawTimeScaleHeader(
-  svgHeader: SVGElement,
-  timeScale: d3.ScaleTime<number, number, never>,
-  fromTime: Date,
-  toTime: Date,
-  baseWidth: number,
-  level: TimeScale,
-  isTwoLevelHeader: boolean = true
-) {
-  const header = d3.select(svgHeader)
-
-  header.selectAll('*').remove()
-  header.attr('width', getChartWidth(fromTime, toTime, baseWidth, level))
-
-  if (!isTwoLevelHeader) {
-    header.attr('height', '30px')
-  } else {
-    header.attr('height', '40px')
-  }
-
-  const addGridLines = (ticks: Date[], yStart: number, yEnd: number) => {
-    ticks.forEach(tick => {
-      const startX = timeScale(tick)
-      header
-        .append('line')
-        .attr('x1', startX)
-        .attr('x2', startX)
-        .attr('y1', yStart)
-        .attr('y2', yEnd)
-        .attr('stroke', 'var(--ox-gantt-color-gridlines, var(--md-sys-color-outline))')
-        .attr('stroke-width', 1)
-    })
-  }
-
-  const centerLabel = (
-    selection: d3.Selection<SVGGElement, unknown, null, undefined>,
-    tickInterval: d3.CountableTimeInterval
-  ) => {
-    selection.selectAll('text').attr('transform', (d: any) => {
-      const tickIntervalWidth = timeScale(tickInterval.offset(d, 1)) - timeScale(d)
-      return `translate(${tickIntervalWidth / 2}, ${isTwoLevelHeader ? -2 : -8})`
-    })
-  }
-
-  const drawLevel = (
-    mainTicks: Date[],
-    mainFormat: (d: Date) => string,
-    mainInterval: d3.CountableTimeInterval,
-    detailTicks: Date[],
-    detailFormat: (d: Date) => string,
-    detailInterval: d3.CountableTimeInterval
-  ) => {
-    if (isTwoLevelHeader) {
-      const mainAxis = d3
-        .axisTop(timeScale)
-        .ticks(mainInterval)
-        .tickFormat(mainFormat as any)
-        .tickSize(0)
-      addGridLines(mainTicks, 0, 20)
-
-      const mainAxisG = header
-        .append('g')
-        .classed('main-axis no-select md-typescale-label-small', true)
-        .attr('transform', 'translate(0, 20)')
-        .call(mainAxis)
-
-      centerLabel(mainAxisG, mainInterval)
-    }
-
-    const detailAxis = d3
-      .axisTop(timeScale)
-      .ticks(detailInterval)
-      .tickFormat(detailFormat as any)
-      .tickSize(0)
-    addGridLines(detailTicks, isTwoLevelHeader ? 20 : 0, isTwoLevelHeader ? 40 : 30)
-
-    const detailAxisG = header
-      .append('g')
-      .classed('detail-axis no-select md-typescale-label-small', true)
-      .attr('transform', `translate(0, ${isTwoLevelHeader ? 40 : 30})`)
-      .call(detailAxis)
-
-    centerLabel(detailAxisG, detailInterval)
-  }
-
-  if (level === 'week-day') {
-    drawLevel(
-      d3.timeWeek.every(1)!.range(d3.timeWeek.floor(fromTime), d3.timeWeek.offset(toTime, 1)),
-      d3.timeFormat('%B %d'),
-      d3.timeWeek,
-      d3.timeDay.every(1)!.range(d3.timeDay.floor(fromTime), d3.timeDay.offset(toTime, 1)),
-      d3.timeFormat('%d'),
-      d3.timeDay
-    )
-  } else if (level === 'quarter-week') {
-    drawLevel(
-      d3.timeMonth.every(3)!.range(d3.timeMonth.floor(fromTime), d3.timeMonth.offset(toTime, 3)),
-      d3.timeFormat('%Y %b'),
-      d3.timeMonth.every(3)! as any,
-      d3.timeWeek.every(1)!.range(d3.timeWeek.floor(fromTime), d3.timeWeek.offset(toTime, 1)),
-      d3.timeFormat('%b %d'),
-      d3.timeWeek
-    )
-  } else if (level === 'year-month') {
-    drawLevel(
-      d3.timeYear.every(1)!.range(d3.timeYear.floor(fromTime), d3.timeYear.offset(toTime, 1)),
-      d3.timeFormat('%Y'),
-      d3.timeYear,
-      d3.timeMonth.every(1)!.range(d3.timeMonth.floor(fromTime), d3.timeMonth.offset(toTime, 1)),
-      d3.timeFormat('%b'),
-      d3.timeMonth
-    )
-  } else if (level === 'year-quarter') {
-    drawLevel(
-      d3.timeYear.every(1)!.range(d3.timeYear.floor(fromTime), d3.timeYear.offset(toTime, 1)),
-      d3.timeFormat('%Y'),
-      d3.timeYear,
-      d3.timeMonth.every(3)!.range(d3.timeMonth.floor(fromTime), d3.timeMonth.offset(toTime, 3)),
-      d3.timeFormat('%Y %b'),
-      d3.timeMonth.every(3)! as any
-    )
-  }
-}
-
-export function getChartWidth(fromTime: Date, toTime: Date, baseWidth: number, level: TimeScale): number {
-  const totalDays = d3.timeDay.count(fromTime, d3.timeDay.offset(toTime, 1))
-  return (totalDays * baseWidth) / getScale(level)
-}
-
-export function getScale(level: TimeScale): number {
-  if (level === 'quarter-week') {
-    return 7 / 2
-  } else if (level === 'year-month') {
-    return 30 / 2
-  } else if (level === 'year-quarter') {
-    return 90 / 2
-  }
-  return 1
-}