TypeError: 'undefined' is not an object (evaluating 'e.schemeCategory10')

* **C3 version**: 0.7.20 (latest)
* **D3 version**: 7.4.4 (latest)
* **Browser**: google chrome (Version 100.0.4896.88 (Official Build) (x86_64))
* **OS**: macOS Monterey 12.2.1 (21D62)
**codepen link** : [https://codepen.io/tanya5895/pen/KKQWKJV](https://codepen.io/tanya5895/pen/KKQWKJV)

**error log** :
ERROR : TypeError: 'undefined' is not an object (evaluating 'e.schemeCategory10')

c3.min.js:2 Uncaught TypeError: this.d3.set is not a function
at l.mapTargetsToUniqueXs (c3.min.js:2:128160)
at p.t.updateXAxisTickValues (c3.min.js:2:13207)
at l.redraw (c3.min.js:2:31077)
at l.initWithData (c3.min.js:2:27500)
at l.init (c3.min.js:2:22585)
at new n (c3.min.js:2:463)
at Object.generate (c3.min.js:2:21614)
at pen.js:2:16