@operato/gantt 2.0.0-beta.5 → 7.0.0-rc.2

package/stories/ox-gantt.stories.ts

@@ -4,14 +4,18 @@ import '../src/ox-gantt.js'
 import { html, TemplateResult } from 'lit'
 import { styles as MDTypeScaleStyles } from '@material/web/typography/md-typescale-styles'
 
-import { Task, Section } from '../src/types.js'
+import { Task, Section, TimeScale } from '../src/types.js'
 
 export default {
   title: 'ox-gantt',
   component: 'ox-gantt',
   argTypes: {
-    tasks: { control: 'object' },
-    theme: { control: 'select', options: ['light', 'dark'] }
+    fromDate: { control: 'date' },
+    toDate: { control: 'date' },
+    timeScale: { control: 'select', options: ['year-quarter', 'year-month', 'quarter-week', 'week-day'] },
+    extendGridLines: { control: 'boolean' },
+    theme: { control: 'select', options: ['light', 'dark'] },
+    tasks: { control: 'object' }
   }
 }
 
@@ -23,10 +27,21 @@ interface Story<T> {
 
 interface ArgTypes {
   tasks: Task[]
+  fromDate: number | string
+  toDate: number | string
+  extendGridLines: boolean
+  timeScale: TimeScale
   theme: 'light' | 'dark'
 }
 
-const Template: Story<ArgTypes> = ({ theme = 'light', tasks }: ArgTypes) => html`
+const Template: Story<ArgTypes> = ({
+  theme = 'light',
+  tasks,
+  fromDate,
+  toDate,
+  extendGridLines,
+  timeScale = 'week-day'
+}: ArgTypes) => html`
   <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap" rel="stylesheet" />
 
   <link href="/themes/light.css" rel="stylesheet" />
@@ -80,8 +95,9 @@ const Template: Story<ArgTypes> = ({ theme = 'light', tasks }: ArgTypes) => html
   </script>
 
   <ox-gantt
-    from-date="2022-12-27"
-    to-date="2024-12-31"
+    from-date=${new Date(fromDate).toISOString().split('T')[0]}
+    to-date=${new Date(toDate).toISOString().split('T')[0]}
+    .timeScale=${timeScale}
     .tasks=${tasks}
     @date-range-selected=${(e: CustomEvent) => {
       console.log('date-range-selected', e.detail)
@@ -89,26 +105,37 @@ const Template: Story<ArgTypes> = ({ theme = 'light', tasks }: ArgTypes) => html
     @task-clicked=${(e: CustomEvent) => {
       console.log('task-clicked', e.detail)
     }}
+    ?extend-grid-lines=${extendGridLines}
   >
   </ox-gantt>
 `
 
-const exampleSection: Section = {
+const developmentSection: Section = {
   name: 'Development'
 }
 
+const testSection: Section = {
+  name: 'Test'
+}
+
+const releaseSection: Section = {
+  name: 'Release'
+}
+
 export const Regular = Template.bind({})
 Regular.args = {
+  fromDate: '2022-12-27',
+  toDate: '2024-12-31',
   tasks: [
     {
       id: '1',
       title: 'Design',
       type: 'task',
-      section: exampleSection,
-      startTime: new Date('2023-01-01'),
-      endTime: new Date('2023-01-05'),
+      // section: developmentSection,
+      startDate: '2023-01-01',
+      endDate: '2023-01-05',
       progress: 60,
-      after: '',
+      dependsOn: '',
       length: '5d',
       tags: ['active'],
       children: []
@@ -117,11 +144,11 @@ Regular.args = {
       id: '2',
       title: 'Development',
       type: 'milestone',
-      section: exampleSection,
-      startTime: new Date('2023-01-06'),
-      endTime: new Date('2023-01-06'),
+      // section: developmentSection,
+      startDate: '2023-01-06',
+      endDate: '2023-01-06',
       progress: 30,
-      after: '1',
+      dependsOn: '1',
       length: '1d',
       tags: ['milestone'],
       children: []
@@ -130,11 +157,11 @@ Regular.args = {
       id: '3',
       title: 'Coding',
       type: 'phase',
-      section: exampleSection,
-      startTime: new Date('2023-01-07'),
-      endTime: new Date('2023-01-15'),
+      // section: developmentSection,
+      startDate: '2023-01-07',
+      endDate: '2023-01-15',
       progress: 10,
-      after: '2',
+      dependsOn: '2',
       length: '9d',
       tags: ['critical'],
       children: [
@@ -142,11 +169,11 @@ Regular.args = {
           id: '3-1',
           title: 'Coding-A',
           type: 'task',
-          section: exampleSection,
-          startTime: new Date('2023-01-07'),
-          endTime: new Date('2023-01-10'),
+          // section: developmentSection,
+          startDate: '2023-01-07',
+          endDate: '2023-01-10',
           progress: 60,
-          after: '',
+          dependsOn: '',
           length: '4d',
           tags: ['done'],
           children: []
@@ -155,10 +182,10 @@ Regular.args = {
           id: '3-2',
           title: 'Coding-B',
           type: 'task',
-          section: exampleSection,
-          startTime: new Date('2023-01-11'),
-          endTime: new Date('2023-01-15'),
-          after: '3-1',
+          // section: developmentSection,
+          startDate: '2023-01-11',
+          endDate: '2023-01-15',
+          dependsOn: '3-1',
           length: '5d',
           tags: ['active'],
           children: []
@@ -169,11 +196,11 @@ Regular.args = {
       id: '4',
       title: 'Test',
       type: 'milestone',
-      section: exampleSection,
-      startTime: new Date('2023-01-07'),
-      endTime: new Date('2023-01-10'),
+      // section: developmentSection,
+      startDate: '2023-01-07',
+      endDate: '2023-01-10',
       progress: 100,
-      after: '1',
+      dependsOn: '1',
       length: '1d',
       tags: ['done'],
       children: []
@@ -182,10 +209,10 @@ Regular.args = {
       id: '5',
       title: 'Deploy',
       type: 'milestone',
-      section: exampleSection,
-      startTime: new Date('2023-01-15'),
-      endTime: new Date('2023-01-21'),
-      after: '4',
+      // section: developmentSection,
+      startDate: '2023-01-15',
+      endDate: '2023-01-21',
+      dependsOn: '4',
       length: '1d',
       tags: ['milestone'],
       children: []
@@ -194,10 +221,10 @@ Regular.args = {
       id: '6',
       title: 'Publishing',
       type: 'milestone',
-      section: exampleSection,
-      startTime: new Date('2023-01-11'),
-      endTime: new Date('2023-01-15'),
-      after: '5',
+      // section: developmentSection,
+      startDate: '2023-01-11',
+      endDate: '2023-01-15',
+      dependsOn: '5',
       length: '1d',
       tags: ['milestone'],
       children: []
@@ -206,10 +233,10 @@ Regular.args = {
       id: '7',
       title: 'Provisioning',
       type: 'milestone',
-      section: exampleSection,
-      startTime: new Date('2023-01-12'),
-      endTime: new Date('2023-01-15'),
-      after: '6',
+      // section: developmentSection,
+      startDate: '2023-01-12',
+      endDate: '2023-01-15',
+      dependsOn: '6',
       length: '1d',
       tags: ['milestone'],
       children: []
@@ -218,10 +245,10 @@ Regular.args = {
       id: '8',
       title: 'Alpha Test',
       type: 'milestone',
-      section: exampleSection,
-      startTime: new Date('2023-01-15'),
-      endTime: new Date('2023-01-17'),
-      after: '7',
+      // section: testSection,
+      startDate: '2023-01-15',
+      endDate: '2023-01-17',
+      dependsOn: '7',
       length: '1d',
       tags: ['critical'],
       children: []
@@ -230,10 +257,10 @@ Regular.args = {
       id: '9',
       title: 'Beta Task',
       type: 'milestone',
-      section: exampleSection,
-      startTime: new Date('2023-01-15'),
-      endTime: new Date('2023-01-18'),
-      after: '8',
+      // section: testSection,
+      startDate: '2023-01-15',
+      endDate: '2023-01-18',
+      dependsOn: '8',
       length: '1d',
       tags: ['active'],
       children: []
@@ -242,10 +269,10 @@ Regular.args = {
       id: '10',
       title: 'Gamma Test',
       type: 'milestone',
-      section: exampleSection,
-      startTime: new Date('2023-01-18'),
-      endTime: new Date('2023-01-19'),
-      after: '9',
+      // section: testSection,
+      startDate: '2023-01-18',
+      endDate: '2023-01-19',
+      dependsOn: '9',
       length: '1d',
       tags: ['critical'],
       children: []
@@ -254,10 +281,10 @@ Regular.args = {
       id: '11',
       title: 'Zeta Test',
       type: 'milestone',
-      section: exampleSection,
-      startTime: new Date('2023-01-18'),
-      endTime: new Date('2023-01-22'),
-      after: '9',
+      // section: testSection,
+      startDate: '2023-01-18',
+      endDate: '2023-01-22',
+      dependsOn: '9',
       length: '1d',
       tags: ['milestone'],
       children: []
@@ -266,10 +293,10 @@ Regular.args = {
       id: '12',
       title: 'Release',
       type: 'milestone',
-      section: exampleSection,
-      startTime: new Date('2023-01-18'),
-      endTime: new Date('2023-01-23'),
-      after: '9',
+      // section: releaseSection,
+      startDate: '2023-01-18',
+      endDate: '2023-01-23',
+      dependsOn: '9',
       length: '1d',
       tags: ['milestone'],
       children: []
@@ -278,10 +305,10 @@ Regular.args = {
       id: '13',
       title: 'Release',
       type: 'milestone',
-      section: exampleSection,
-      startTime: new Date('2023-01-22'),
-      endTime: new Date('2023-01-27'),
-      after: '12',
+      // section: releaseSection,
+      startDate: '2023-01-22',
+      endDate: '2023-01-27',
+      dependsOn: '12',
       length: '1d',
       tags: ['done'],
       children: []
@@ -290,10 +317,10 @@ Regular.args = {
       id: '14',
       title: 'Release',
       type: 'milestone',
-      section: exampleSection,
-      startTime: new Date('2023-01-27'),
-      endTime: new Date('2023-01-30'),
-      after: '13',
+      // section: releaseSection,
+      startDate: '2023-01-27',
+      endDate: '2023-01-30',
+      dependsOn: '13',
       length: '1d',
       tags: ['milestone'],
       children: []
@@ -302,10 +329,10 @@ Regular.args = {
       id: '15',
       title: 'Release',
       type: 'milestone',
-      section: exampleSection,
-      startTime: new Date('2023-01-30'),
-      endTime: new Date('2023-01-31'),
-      after: '14',
+      // section: releaseSection,
+      startDate: '2023-01-30',
+      endDate: '2023-01-31',
+      dependsOn: '14',
       length: '1d',
       tags: ['milestone'],
       children: []
@@ -314,10 +341,10 @@ Regular.args = {
       id: '16',
       title: 'Release',
       type: 'milestone',
-      section: exampleSection,
-      startTime: new Date('2023-01-31'),
-      endTime: new Date('2023-02-05'),
-      after: '15',
+      // section: releaseSection,
+      startDate: '2023-01-31',
+      endDate: '2023-02-05',
+      dependsOn: '15',
       length: '1d',
       tags: ['active'],
       children: []
@@ -326,10 +353,10 @@ Regular.args = {
       id: '17',
       title: 'Release',
       type: 'milestone',
-      section: exampleSection,
-      startTime: new Date('2023-02-06'),
-      endTime: new Date('2023-02-07'),
-      after: '16',
+      // section: releaseSection,
+      startDate: '2023-02-06',
+      endDate: '2023-02-07',
+      dependsOn: '16',
       length: '1d',
       tags: ['milestone'],
       children: []
@@ -338,10 +365,10 @@ Regular.args = {
       id: '18',
       title: 'Release',
       type: 'milestone',
-      section: exampleSection,
-      startTime: new Date('2023-02-08'),
-      endTime: new Date('2023-02-09'),
-      after: '17',
+      // section: releaseSection,
+      startDate: '2023-02-08',
+      endDate: '2023-02-09',
+      dependsOn: '17',
       length: '1d',
       tags: ['critical'],
       children: []
@@ -350,10 +377,10 @@ Regular.args = {
       id: '19',
       title: 'Release',
       type: 'milestone',
-      section: exampleSection,
-      startTime: new Date('2023-02-10'),
-      endTime: new Date('2023-02-25'),
-      after: '18',
+      // section: releaseSection,
+      startDate: '2023-02-10',
+      endDate: '2023-02-25',
+      dependsOn: '18',
       length: '1d',
       tags: ['milestone'],
       children: []

package/themes/grist-theme.css

@@ -48,11 +48,9 @@ body {
   --grid-record-wide-fontsize: var(--md-sys-typescale-label-medium-size);
   --grid-record-selected-background-color: var(--md-sys-color-primary-container);
   --grid-record-selected-color: var(--md-sys-color-primary);
-  --grid-record-focused-background-color: var(--md-sys-color-secondary-container);
   --grid-record-focused-border: 1px solid var(--md-sys-color-outline-variant);
   --grid-record-focused-cell-background-color: var(--md-sys-color-secondary-container);
   --grid-record-focused-cell-border: 1px dashed var(--md-sys-color-outline);
-  --grid-record-focused-color: var(--md-sys-color-secondary);
   --grid-record-focused-box-shadow: 0px 2px 0px 0px rgb(0 0 0 / 10%);
   --grid-record-emphasized-background-color: var(--md-sys-color-tertiary-container);
   --grid-record-emphasized-color: var(--md-sys-color-tertiary);

package/translations/en.json

@@ -1 +1,11 @@
-{}
+{
+  "label.gantt-task-id": "ID",
+  "label.gantt-task-section": "section",
+  "label.gantt-task-title": "title",
+  "label.gantt-task-type": "type",
+  "label.gantt-task-start-date": "start date",
+  "label.gantt-task-end-date": "end date",
+  "label.gantt-task-tags": "tags",
+  "label.gantt-task-progress": "progress",
+  "label.gantt-task-previous": "previous"
+}

package/translations/ja.json

@@ -1 +1,11 @@
-{}
+{
+  "label.gantt-task-id": "ID",
+  "label.gantt-task-section": "セクション",
+  "label.gantt-task-title": "タイトル",
+  "label.gantt-task-type": "タイプ",
+  "label.gantt-task-start-date": "開始日",
+  "label.gantt-task-end-date": "終了日",
+  "label.gantt-task-tags": "タグ",
+  "label.gantt-task-progress": "進捗",
+  "label.gantt-task-previous": "前"
+}

package/translations/ko.json

@@ -1 +1,11 @@
-{}
+{
+  "label.gantt-task-id": "아이디",
+  "label.gantt-task-section": "섹션",
+  "label.gantt-task-title": "제목",
+  "label.gantt-task-type": "유형",
+  "label.gantt-task-start-date": "시작 날짜",
+  "label.gantt-task-end-date": "종료 날짜",
+  "label.gantt-task-tags": "태그",
+  "label.gantt-task-progress": "진행 상황",
+  "label.gantt-task-previous": "이전"
+}

package/translations/ms.json

@@ -1 +1,11 @@
-{}
+{
+  "label.gantt-task-id": "id",
+  "label.gantt-task-section": "seksyen",
+  "label.gantt-task-title": "tajuk",
+  "label.gantt-task-type": "jenis",
+  "label.gantt-task-start-date": "tarikh mula",
+  "label.gantt-task-end-date": "tarikh tamat",
+  "label.gantt-task-tags": "tag",
+  "label.gantt-task-progress": "kemajuan",
+  "label.gantt-task-previous": "sebelumnya"
+}

package/translations/zh.json

@@ -1 +1,11 @@
-{}
+{
+  "label.gantt-task-id": "ID",
+  "label.gantt-task-section": "部分",
+  "label.gantt-task-title": "标题",
+  "label.gantt-task-type": "类型",
+  "label.gantt-task-start-date": "开始日期",
+  "label.gantt-task-end-date": "结束日期",
+  "label.gantt-task-tags": "标签",
+  "label.gantt-task-progress": "进度",
+  "label.gantt-task-previous": "以前"
+}

package/dist/src/locale.d.ts

@@ -1 +0,0 @@
-export declare function setLocale(locale: string): void;

package/dist/src/locale.js

@@ -1,49 +0,0 @@
-import { timeFormatDefaultLocale } from 'd3-time-format';
-// 한국어 로케일 정의
-const koKR = {
-    dateTime: '%Y-%m-%d %a %X',
-    date: '%Y-%m-%d',
-    time: '%H:%M:%S',
-    periods: ['AM', 'PM'],
-    days: ['일요일', '월요일', '화요일', '수요일', '목요일', '금요일', '토요일'],
-    shortDays: ['일', '월', '화', '수', '목', '금', '토'],
-    months: ['1월', '2월', '3월', '4월', '5월', '6월', '7월', '8월', '9월', '10월', '11월', '12월'],
-    shortMonths: ['1월', '2월', '3월', '4월', '5월', '6월', '7월', '8월', '9월', '10월', '11월', '12월']
-};
-// 영어 로케일 정의
-const enUS = {
-    dateTime: '%x, %X',
-    date: '%-m/%-d/%Y',
-    time: '%-I:%M:%S %p',
-    periods: ['AM', 'PM'],
-    days: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],
-    shortDays: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
-    months: [
-        'January',
-        'February',
-        'March',
-        'April',
-        'May',
-        'June',
-        'July',
-        'August',
-        'September',
-        'October',
-        'November',
-        'December'
-    ],
-    shortMonths: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
-};
-// 로케일 설정 함수
-export function setLocale(locale) {
-    if (locale === 'ko') {
-        timeFormatDefaultLocale(koKR);
-    }
-    else if (locale === 'en') {
-        timeFormatDefaultLocale(enUS);
-    }
-}
-// 예제 언어 선택
-const selectedLocale = 'ko';
-setLocale(selectedLocale);
-//# sourceMappingURL=locale.js.map

package/dist/src/locale.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"locale.js","sourceRoot":"","sources":["../../src/locale.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAA;AAExD,aAAa;AACb,MAAM,IAAI,GAAG;IACX,QAAQ,EAAE,gBAAgB;IAC1B,IAAI,EAAE,UAAU;IAChB,IAAI,EAAE,UAAU;IAChB,OAAO,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC;IACrB,IAAI,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC;IACvD,SAAS,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC9C,MAAM,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC;IACnF,WAAW,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC;CAC9D,CAAA;AAE5B,YAAY;AACZ,MAAM,IAAI,GAAG;IACX,QAAQ,EAAE,QAAQ;IAClB,IAAI,EAAE,YAAY;IAClB,IAAI,EAAE,cAAc;IACpB,OAAO,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC;IACrB,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,WAAW,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,CAAC;IACpF,SAAS,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC;IAC5D,MAAM,EAAE;QACN,SAAS;QACT,UAAU;QACV,OAAO;QACP,OAAO;QACP,KAAK;QACL,MAAM;QACN,MAAM;QACN,QAAQ;QACR,WAAW;QACX,SAAS;QACT,UAAU;QACV,UAAU;KACX;IACD,WAAW,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC;CACvE,CAAA;AAE5B,YAAY;AACZ,MAAM,UAAU,SAAS,CAAC,MAAc;IACtC,IAAI,MAAM,KAAK,IAAI,EAAE,CAAC;QACpB,uBAAuB,CAAC,IAAI,CAAC,CAAA;IAC/B,CAAC;SAAM,IAAI,MAAM,KAAK,IAAI,EAAE,CAAC;QAC3B,uBAAuB,CAAC,IAAI,CAAC,CAAA;IAC/B,CAAC;AACH,CAAC;AAED,WAAW;AACX,MAAM,cAAc,GAAG,IAAI,CAAA;AAC3B,SAAS,CAAC,cAAc,CAAC,CAAA","sourcesContent":["import { timeFormatDefaultLocale } from 'd3-time-format'\n\n// 한국어 로케일 정의\nconst koKR = {\n  dateTime: '%Y-%m-%d %a %X',\n  date: '%Y-%m-%d',\n  time: '%H:%M:%S',\n  periods: ['AM', 'PM'],\n  days: ['일요일', '월요일', '화요일', '수요일', '목요일', '금요일', '토요일'],\n  shortDays: ['일', '월', '화', '수', '목', '금', '토'],\n  months: ['1월', '2월', '3월', '4월', '5월', '6월', '7월', '8월', '9월', '10월', '11월', '12월'],\n  shortMonths: ['1월', '2월', '3월', '4월', '5월', '6월', '7월', '8월', '9월', '10월', '11월', '12월']\n} as d3.TimeLocaleDefinition\n\n// 영어 로케일 정의\nconst enUS = {\n  dateTime: '%x, %X',\n  date: '%-m/%-d/%Y',\n  time: '%-I:%M:%S %p',\n  periods: ['AM', 'PM'],\n  days: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],\n  shortDays: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],\n  months: [\n    'January',\n    'February',\n    'March',\n    'April',\n    'May',\n    'June',\n    'July',\n    'August',\n    'September',\n    'October',\n    'November',\n    'December'\n  ],\n  shortMonths: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']\n} as d3.TimeLocaleDefinition\n\n// 로케일 설정 함수\nexport function setLocale(locale: string) {\n  if (locale === 'ko') {\n    timeFormatDefaultLocale(koKR)\n  } else if (locale === 'en') {\n    timeFormatDefaultLocale(enUS)\n  }\n}\n\n// 예제 언어 선택\nconst selectedLocale = 'ko'\nsetLocale(selectedLocale)\n"]}

package/src/locale.ts

@@ -1,51 +0,0 @@
-import { timeFormatDefaultLocale } from 'd3-time-format'
-
-// 한국어 로케일 정의
-const koKR = {
-  dateTime: '%Y-%m-%d %a %X',
-  date: '%Y-%m-%d',
-  time: '%H:%M:%S',
-  periods: ['AM', 'PM'],
-  days: ['일요일', '월요일', '화요일', '수요일', '목요일', '금요일', '토요일'],
-  shortDays: ['일', '월', '화', '수', '목', '금', '토'],
-  months: ['1월', '2월', '3월', '4월', '5월', '6월', '7월', '8월', '9월', '10월', '11월', '12월'],
-  shortMonths: ['1월', '2월', '3월', '4월', '5월', '6월', '7월', '8월', '9월', '10월', '11월', '12월']
-} as d3.TimeLocaleDefinition
-
-// 영어 로케일 정의
-const enUS = {
-  dateTime: '%x, %X',
-  date: '%-m/%-d/%Y',
-  time: '%-I:%M:%S %p',
-  periods: ['AM', 'PM'],
-  days: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],
-  shortDays: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
-  months: [
-    'January',
-    'February',
-    'March',
-    'April',
-    'May',
-    'June',
-    'July',
-    'August',
-    'September',
-    'October',
-    'November',
-    'December'
-  ],
-  shortMonths: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
-} as d3.TimeLocaleDefinition
-
-// 로케일 설정 함수
-export function setLocale(locale: string) {
-  if (locale === 'ko') {
-    timeFormatDefaultLocale(koKR)
-  } else if (locale === 'en') {
-    timeFormatDefaultLocale(enUS)
-  }
-}
-
-// 예제 언어 선택
-const selectedLocale = 'ko'
-setLocale(selectedLocale)